如何在约束布局Android中的组件组之间具有相同的垂直权重？答案

【问题标题】：How to have same vertical weight between group of components in Constraint Layout Android?如何在约束布局Android中的组件组之间具有相同的垂直权重？
【发布时间】：2018-07-10 12:35:29
【问题描述】：

我正在使用约束布局。我想要的是在 group1 和 group2 以及 group2 和屏幕末端之间具有相同的垂直权重（宽度）。在线性布局中，我会将一组放在垂直线性布局中，将 group2 放在垂直线性布局中，并将这两个布局放在 parrent垂直布局并将权重设置为1。但是如何在约束布局中做到这一点？

这是示例图片：

所以我想要的是在 group1 和 group2 以及 group2 和屏幕结束之间有相同宽度的空间。

像这样：

这是我的代码：

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/constrait"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:minHeight="47dp"
app:layout_constraintVertical_chainStyle="spread"
app:layout_constraintVertical_weight="4"
tools:context="example.com.constrait.MainActivity">

<TextView
    android:id="@+id/textView7"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_marginStart="8dp"
    android:text="TextView"
    app:layout_constraintStart_toStartOf="parent"
    tools:layout_editor_absoluteY="24dp" />

<EditText
    android:id="@+id/editText6"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_marginStart="8dp"
    android:background="@drawable/rounded_border_edittext"
    android:ems="10"
    android:inputType="textPersonName"
    app:layout_constraintEnd_toEndOf="@+id/textView7"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/textView7" />

<TextView
    android:id="@+id/textView8"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginStart="8dp"
    android:layout_marginTop="8dp"
    android:text="TextView"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/editText6" />

<EditText
    android:id="@+id/editText8"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_marginStart="8dp"
    android:background="@drawable/rounded_border_edittext"
    android:ems="10"
    android:inputType="textPersonName"
    app:layout_constraintEnd_toEndOf="@+id/textView8"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/textView8" />

【问题讨论】：

你在谈论垂直重量和宽度，所以我不确定你的问题。您是在寻找两个组具有相同的高度还是两个组中的组件都具有相同的大小？
请查看我的更新以获得更多说明。

标签： android android-layout layout

【解决方案1】：

您可能正在寻找Chains。

您可以查看blogpost，我从中获取了以下 sn-ps。

基本上你想像这样将你的小部件链接在一起

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

    <Button
        android:id="@+id/view1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="View 1"
        app:layout_constraintRight_toLeftOf="@+id/view2"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <Button
        android:id="@+id/view2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="View 2"
        app:layout_constraintRight_toLeftOf="@+id/view3"
        app:layout_constraintVertical_chainStyle="packed"
        app:layout_constraintLeft_toRightOf="@+id/view1"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <Button
        android:id="@+id/view3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="View 3"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintVertical_chainStyle="packed"
        app:layout_constraintLeft_toRightOf="@+id/view2"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>

对于您的特定用例，您可能希望使用

app:layout_constraintHorizontal_chainStyle=”spread”

【讨论】：

app:layout_constraintHorizontal_chainStyle="spread", 在哪里添加这个属性？
在约束布局内链接在一起的每个小部件上。

【解决方案2】：

我已根据需要修改了您的代码，测试此代码并查看它是否适合您：-

<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">

<android.support.constraint.ConstraintLayout
    android:id="@+id/constraintLayout"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:layout_marginTop="8dp"
    app:layout_constraintBottom_toTopOf="@+id/constraintLayout2"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintVertical_bias="0.0">

    <TextView
        android:id="@+id/textView11"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:text="TextView"
        app:layout_constraintEnd_toStartOf="@+id/textView15"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintHorizontal_chainStyle="spread_inside"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/textView15"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:text="TextView"
        app:layout_constraintEnd_toStartOf="@+id/textView16"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintHorizontal_chainStyle="spread_inside"
        app:layout_constraintStart_toEndOf="@+id/textView11"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/textView16"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:text="TextView"
        app:layout_constraintEnd_toStartOf="@+id/textView17"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintHorizontal_chainStyle="spread_inside"
        app:layout_constraintStart_toEndOf="@+id/textView15"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/textView17"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:text="TextView"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintHorizontal_chainStyle="spread_inside"
        app:layout_constraintStart_toEndOf="@+id/textView16"
        app:layout_constraintTop_toTopOf="parent" />

    <EditText
        android:id="@+id/editText12"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:ems="10"
        android:inputType="textPersonName"
        app:layout_constraintEnd_toStartOf="@+id/editText13"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintHorizontal_chainStyle="spread_inside"
        app:layout_constraintStart_toEndOf="@+id/editText10"
        app:layout_constraintTop_toTopOf="@+id/editText10" />

    <EditText
        android:id="@+id/editText10"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:ems="10"
        android:inputType="textPersonName"
        app:layout_constraintEnd_toStartOf="@+id/editText12"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintHorizontal_chainStyle="spread_inside"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/textView11" />

    <EditText
        android:id="@+id/editText13"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:ems="10"
        android:inputType="textPersonName"
        app:layout_constraintEnd_toStartOf="@+id/editText14"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintHorizontal_chainStyle="spread_inside"
        app:layout_constraintStart_toEndOf="@+id/editText12"
        app:layout_constraintTop_toTopOf="@+id/editText12" />

    <EditText
        android:id="@+id/editText14"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:ems="10"
        android:inputType="textPersonName"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintHorizontal_chainStyle="spread_inside"
        app:layout_constraintStart_toEndOf="@+id/editText13"
        app:layout_constraintTop_toTopOf="@+id/editText13" />
</android.support.constraint.ConstraintLayout>

<android.support.constraint.ConstraintLayout
    android:id="@+id/constraintLayout2"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:layout_marginBottom="8dp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/constraintLayout">

    <TextView
        android:id="@+id/textView21"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:text="TextView"
        app:layout_constraintEnd_toStartOf="@+id/textView22"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintHorizontal_chainStyle="spread_inside"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/textView22"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="TextView"
        app:layout_constraintEnd_toStartOf="@+id/textView23"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintHorizontal_chainStyle="spread_inside"
        app:layout_constraintStart_toEndOf="@+id/textView21"
        app:layout_constraintTop_toTopOf="@+id/textView21" />

    <TextView
        android:id="@+id/textView23"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="TextView"
        app:layout_constraintEnd_toStartOf="@+id/textView25"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintHorizontal_chainStyle="spread_inside"
        app:layout_constraintStart_toEndOf="@+id/textView22"
        app:layout_constraintTop_toTopOf="@+id/textView22" />

    <TextView
        android:id="@+id/textView25"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="TextView"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintHorizontal_chainStyle="spread_inside"
        app:layout_constraintStart_toEndOf="@+id/textView23"
        app:layout_constraintTop_toTopOf="@+id/textView23" />

    <EditText
        android:id="@+id/editText15"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:ems="10"
        android:inputType="textPersonName"
        app:layout_constraintEnd_toStartOf="@+id/editText16"
        app:layout_constraintHorizontal_chainStyle="spread_inside"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/textView21" />

    <EditText
        android:id="@+id/editText16"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:ems="10"
        android:inputType="textPersonName"
        app:layout_constraintEnd_toStartOf="@+id/editText17"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintHorizontal_chainStyle="spread_inside"
        app:layout_constraintStart_toEndOf="@+id/editText15"
        app:layout_constraintTop_toTopOf="@+id/editText15" />

    <EditText
        android:id="@+id/editText17"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:ems="10"
        android:inputType="textPersonName"
        app:layout_constraintEnd_toStartOf="@+id/editText18"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintHorizontal_chainStyle="spread_inside"
        app:layout_constraintStart_toEndOf="@+id/editText16"
        app:layout_constraintTop_toTopOf="@+id/editText15" />

    <EditText
        android:id="@+id/editText18"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:ems="10"
        android:inputType="textPersonName"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintHorizontal_chainStyle="spread_inside"
        app:layout_constraintStart_toEndOf="@+id/editText17"
        app:layout_constraintTop_toTopOf="@+id/editText15" />
</android.support.constraint.ConstraintLayout>

我已经根据需要编辑了布局。现在看看。根据您的需要添加编辑文本背景。

【讨论】：

和我的xml一样
更新了答案。现在检查。