How to show 2 colors in layer list with responsive UI in different screen sizes

Question

I need to show a splash screen with 2 colors. 1 of the color hight requires 40% and another one requires 60%. UI is not responsive for different screens when I provide height in dp.

XML:

<?xml version="1.0" encoding="UTF-8" ?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:height="290dp" android:gravity="fill_horizontal|top">
        <color android:color="#00549F"/>
    </item>
     <item android:height="560dp" android:gravity="fill_horizontal|bottom">
        <color android:color="@android:color/white"/>
     </item>
    <item android:bottom="80dp">
        <bitmap
          android:src="@drawable/Image_null"
          android:gravity="center_horizontal|bottom"/>
    </item>
</layer-list>

I Tried below code with layout.But it's not working.Showing errors at weightSum

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent" android:background="@android:color/white" android:weightSum="2">
    <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_weight="0.8"
    android:background="#00549F"/>
    <LinearLayout
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     android:layout_weight="1.2">
            <ImageView
                 android:layout_width="wrap_content"
                 android:layout_height="80dp"
                android:layout_gravity="bottom"
                android:foregroundGravity="center"
                android:src="@drawable/Image_null"
                />
    </LinearLayout>

 </LinearLayout>

Java Code:

public class SplashActivity : AppCompatActivity
{
    static readonly string TAG = "X:" + typeof(SplashActivity).Name;

    public override void OnCreate(Bundle savedInstanceState, PersistableBundle persistentState)
    {
        base.OnCreate(savedInstanceState, persistentState);

        Log.Debug(TAG, "SplashActivity.OnCreate");
    }

   
    protected override void OnResume()
    {
        base.OnResume();
        Log.Debug(TAG, "Startup work is finished - starting MainActivity.");
        StartActivity(new Intent(this, typeof(MainActivity)));
    }

}

Answer 1

Divide screen in two parts and set the background to each part .

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">

<View
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="4"
    android:background="#00549F" />

<View
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="6"
    android:background="#FFFFFF" />

</LinearLayout>

Answer 2

The values for left, top, right and bottom are measured from their respective edge.

So left=0dp, top=0dp, bottom=0dp & right=50dp will give you a rectangle that is (match_parent - 50dp) wide and not 50dp wide. Therefore larger values for "right" will actually give you a smaller rectangle.

The same would apply to the other value, but these would behave as expected in most cases, its just "right" that might cause confusion.

Either you use px instead of dp or multiply all dimensions by 10.

Divide screen in two parts:-

android:layout_weight=5 android:layout_weight=5

Answer 3

Use LinearLayout and divide with two different child views and assign them weight. Use below code

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

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="0.5"
    android:background="#00549F" />

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="1.5" />
 </LinearLayout>