How Do I Split A Scrollview Layout In Half To Show Parent Background Color And Two Panes?

I have a simple UI screen with a white background. Then I have Scrollview with 10 dp margins all around and black background, so basically a rectangle within a rectangle. How wo

Solution 1:

My approach would be to set the black background to the two rectangles instead of setting it to the ScrollView, which you can't split. Also a ScrollView can only host one direct child and then add to it the two layouts that conforms your rectangle:

<?xml version="1.0" encoding="utf-8"?><LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"xmlns:tools="http://schemas.android.com/tools"android:orientation="vertical"android:layout_width="match_parent"android:layout_height="match_parent"android:background="@android:color/white"android:focusableInTouchMode="true"tools:context=".MainActivity" ><ScrollViewandroid:id="@+id/ScrollView2"android:layout_width="match_parent"android:layout_height="match_parent"android:layout_margin="10dp"android:background="@android:color/transparent"><LinearLayoutandroid:layout_width="match_parent"android:layout_height="wrap_content"android:orientation="vertical"><LinearLayoutandroid:id="@+id/MainLayout1"android:layout_width="match_parent"android:layout_height="300dp"android:orientation="vertical"android:background="@android:color/black"></LinearLayout><android.support.v4.widget.Spaceandroid:layout_width="match_parent"android:layout_height="5dp" /><LinearLayoutandroid:id="@+id/MainLayout2"android:layout_width="match_parent"android:layout_height="700dp"android:orientation="vertical"android:background="@android:color/black"></LinearLayout></LinearLayout></ScrollView></LinearLayout>

This will give you the following UI:

Note that I've put a Space element to separate the two Linear Layouts. You can replace it with a margin if you prefer.