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

【问题标题】：Android layout: variable-width view between two fixed-width viewsAndroid布局：两个固定宽度视图之间的可变宽度视图
【发布时间】：2017-02-15 14:40:39
【问题描述】：

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

【问题讨论】：

标签： android android-layout android-relativelayout

【解决方案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>

【讨论】：

【解决方案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>

【讨论】：

【解决方案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>

【讨论】：