如何将 Scrollview 布局分成两半以显示父背景颜色和两个窗格?
How do I split a Scrollview layout in half to show parent background color and two panes?
我有一个白色背景的简单 UI 屏幕。然后我有 10 dp 边距和黑色背景的滚动视图,所以基本上是矩形内的矩形。我如何将 Scrollview 分成两半,以便我可以在内部黑色矩形的中间显示一条白色水平线,从而创建两个黑色窗格?下面上传的图片显示了我目前拥有的图片(请忽略捕获的用于显示主要 UI 白色背景的微小外部彩色边框。
layout.xml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns: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="#FFFFFF"
style="@style/scrollbar_shape_style"
android:focusableInTouchMode="true"
tools:context=".MainActivity" >
<ScrollView
android:id="@+id/ScrollView2"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#000000"
android:layout_marginLeft="10dp"
android:layout_marginStart="10dp"
android:layout_marginRight="10dp"
android:layout_marginEnd="10dp"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp" >
<LinearLayout
android:id="@+id/MainLayout1"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:orientation="vertical"
android:background="#FFFFFF"
>
</LinearLayout>
</ScrollView>
<TextView
android:id="@+id/xyztext"
android:text="xyz"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:textStyle="bold"
android:textColor="#FFFFFF"
android:background="@color/colorPrimary"
android:textAppearance="?android:attr/textAppearanceMedium"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:clickable="true" />
</LinearLayout>
我的做法是将黑色背景设置为两个矩形,而不是将其设置为无法拆分的ScrollView。
此外,ScrollView 只能托管一个直接子项,然后向其添加符合矩形的两个布局:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns: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" >
<ScrollView
android:id="@+id/ScrollView2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="10dp"
android:background="@android:color/transparent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout
android: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.Space
android:layout_width="match_parent"
android:layout_height="5dp" />
<LinearLayout
android:id="@+id/MainLayout2"
android:layout_width="match_parent"
android:layout_height="700dp"
android:orientation="vertical"
android:background="@android:color/black">
</LinearLayout>
</LinearLayout>
</ScrollView>
</LinearLayout>
这将为您提供以下内容 UI:
请注意,我放置了一个 Space 元素来分隔两个线性布局。如果您愿意,可以用边距替换它。
我有一个白色背景的简单 UI 屏幕。然后我有 10 dp 边距和黑色背景的滚动视图,所以基本上是矩形内的矩形。我如何将 Scrollview 分成两半,以便我可以在内部黑色矩形的中间显示一条白色水平线,从而创建两个黑色窗格?下面上传的图片显示了我目前拥有的图片(请忽略捕获的用于显示主要 UI 白色背景的微小外部彩色边框。
layout.xml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns: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="#FFFFFF"
style="@style/scrollbar_shape_style"
android:focusableInTouchMode="true"
tools:context=".MainActivity" >
<ScrollView
android:id="@+id/ScrollView2"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#000000"
android:layout_marginLeft="10dp"
android:layout_marginStart="10dp"
android:layout_marginRight="10dp"
android:layout_marginEnd="10dp"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp" >
<LinearLayout
android:id="@+id/MainLayout1"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:orientation="vertical"
android:background="#FFFFFF"
>
</LinearLayout>
</ScrollView>
<TextView
android:id="@+id/xyztext"
android:text="xyz"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:textStyle="bold"
android:textColor="#FFFFFF"
android:background="@color/colorPrimary"
android:textAppearance="?android:attr/textAppearanceMedium"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:clickable="true" />
</LinearLayout>
我的做法是将黑色背景设置为两个矩形,而不是将其设置为无法拆分的ScrollView。 此外,ScrollView 只能托管一个直接子项,然后向其添加符合矩形的两个布局:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns: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" >
<ScrollView
android:id="@+id/ScrollView2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="10dp"
android:background="@android:color/transparent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout
android: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.Space
android:layout_width="match_parent"
android:layout_height="5dp" />
<LinearLayout
android:id="@+id/MainLayout2"
android:layout_width="match_parent"
android:layout_height="700dp"
android:orientation="vertical"
android:background="@android:color/black">
</LinearLayout>
</LinearLayout>
</ScrollView>
</LinearLayout>
这将为您提供以下内容 UI:
请注意,我放置了一个 Space 元素来分隔两个线性布局。如果您愿意,可以用边距替换它。