Question

如何水平布置3个视图，使外部2个视图具有固定宽度，中间视图填充剩余的可用水平空间？我所做的所有尝试都导致最右边的视图被推离屏幕。

Answer 1

我挣扎了一段时间才开始工作，并找到了如何使用RelativeLayout。请参阅下面的代码示例，并密切关注layout_toRightOf，layout_toLeftOf和layout_alignParentRight的使用情况

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="@dimen/eventDetailSectionHeight"
    android:background="@color/grayout">

    <SomeFixedWidthView
        android:id="@+id/leftFixedWidthView"
        android:layout_width="100dp"
        android:layout_height="match_parent"/>

    <SomeVariableWidthView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_toRightOf="@id/leftFixedWidthView"
        android:layout_toLeftOf="@+id/rightFixedWidthView"/>

    <SomeFixedWidthView
        android:id="@+id/rightFixedWidthView"
        android:layout_width="100dp"
        android:layout_height="match_parent"
        android:layout_alignParentRight="true"/>

</RelativeLayout>

Answer 2

尝试根据要求为每个孩子设置layout_weight。

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


        <View
            android:id="@+id/leftView"
            android:layout_width="0dp"
            android:layout_weight="0.4"
            android:layout_height="match_parent"
            android:background="#ff0000"/>

        <View
            android:id="@+id/middleView"
            android:layout_width="0dp"
            android:layout_weight="0.2"
            android:layout_height="match_parent"
            android:background="#33cc33"/>

        <View
            android:id="@+id/rightView"
            android:layout_width="0dp"
            android:layout_weight="0.4"
            android:layout_height="match_parent"
            android:background="#ff0000"/>/>


</LinearLayout>

Answer 3

使用以下代码获得所需结果

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

    <View
        android:id="@+id/leftView"
        android:layout_width="100dp"
        android:layout_height="match_parent"
        android:background="#ff0000"/>

    <View
        android:id="@+id/middleView"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:background="#33cc33"/>

    <View
        android:id="@+id/rightView"
        android:layout_width="100dp"
        android:layout_height="match_parent"
        android:background="#ff0000"/>

</LinearLayout>

Android布局：两个固定宽度视图之间的可变宽度视图

3 个答案: