Android UI Screen

Question

Good Day,

I'm new in Android UI development. May I have any knowledge on how will I achieve this kind of UI Screen:

Thanks in advance.

Answer 1

Here is the code with TextView.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <LinearLayout
        android:id="@+id/upparLayout1"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:background="#9DAD0C"
        android:orientation="horizontal"
        android:weightSum="3">

        <TextView
            android:layout_width="0dp"
            android:layout_height="50dp"
            android:layout_weight="1"
            android:background="#9DAD0C"
            android:text="Tab1" />

        <TextView
            android:layout_width="0dp"
            android:layout_height="50dp"
            android:layout_weight="1"
            android:background="#717D11"
            android:text="Tab2" />
    </LinearLayout>

    <TextView
        android:id="@+id/screen1"
        android:layout_width="match_parent"
        android:layout_height="120dp"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_below="@+id/upparLayout1"
        android:background="#CD5E93"
        android:text="Screen1" />

    <LinearLayout
        android:id="@+id/middleLayout"
        android:layout_width="match_parent"
        android:layout_height="120dp"
        android:layout_below="@+id/screen1"
        android:background="#9F165A"
        android:orientation="horizontal"
        android:weightSum="2">

        <TextView
            android:layout_width="0dp"
            android:layout_height="120dp"
            android:layout_weight="1"
            android:text="SubTab1" />

        <TextView
            android:layout_width="0dp"
            android:layout_height="120dp"
            android:layout_weight="1"
            android:text="SubTab2" />
    </LinearLayout>

    <TextView
        android:id="@+id/textView2"
        android:layout_width="match_parent"
        android:layout_height="120dp"
        android:layout_below="@+id/middleLayout"
        android:background="#A9BB2B"
        android:text="List Based on Sub Tab" />

    <TextView
        android:id="@+id/textView3"
        android:layout_width="match_parent"
        android:layout_height="120dp"
        android:layout_below="@+id/textView2"
        android:layout_centerHorizontal="true"
        android:background="#A9BB2B"
        android:text="List Based on Sub Tab" />

    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="50dp"
        android:layout_alignParentBottom="true"
        android:layout_below="@+id/textView3"
        android:layout_centerHorizontal="true"
        android:background="#A9BB2B"
        android:text="Button" />

</RelativeLayout>