Question

This is the layout I am going to do using Constraint Layout.

我想创建没有任何嵌套视图的上述布局，这是使用约束布局的优势之一。

这是一个简单的布局。但我希望在布局中添加垂直链接。

如果我添加垂直链接，则每个视图都会散布。但是我的条件是“文本视图”和“视图（水平线）”应该作为一个组在一起。

我需要将那个小组链接起来。我尝试了以下方法：

<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"
    tools:context=".activities.Settings">

    <include
        android:id="@+id/toolbarLayout"
        layout="@layout/app_bar_main"
        android:layout_width="match_parent"
        android:layout_height="56dp"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/cancelPolicy"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:padding="@dimen/padding_small"
        android:text="@string/canc_pol"
        app:layout_constraintEnd_toEndOf="@id/guidelineRight"
        app:layout_constraintStart_toStartOf="@id/guidelineLeft"
        app:layout_constraintTop_toBottomOf="@id/toolbarLayout" />

    <View
        android:id="@+id/cancelPolicyLine"
        android:layout_width="0dp"
        android:layout_height="2dp"
        android:background="#c0c0c0"
        app:layout_constraintEnd_toEndOf="@id/guidelineRight"
        app:layout_constraintStart_toStartOf="@id/guidelineLeft"
        app:layout_constraintTop_toBottomOf="@id/cancelPolicy" />

    <android.support.constraint.Group
        app:layout_constraintVertical_chainStyle="spread"
        app:layout_constraintTop_toTopOf="@id/toolbarLayout"
        app:layout_constraintBottom_toTopOf="@id/termsAndCondGroup"
        android:id="@+id/cancelPolicyGroup"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:constraint_referenced_ids="cancelPolicy,cancelPolicyLine" />


    <TextView
        android:id="@+id/termsAndCond"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:padding="@dimen/padding_small"
        android:text="@string/t_and_c"
        app:layout_constraintEnd_toEndOf="@id/guidelineRight"
        app:layout_constraintStart_toStartOf="@id/guidelineLeft"
        app:layout_constraintTop_toBottomOf="@id/cancelPolicyLine" />

    <View
        android:id="@+id/termsAndCondLine"
        android:layout_width="0dp"
        android:layout_height="2dp"
        android:background="#c0c0c0"
        app:layout_constraintEnd_toEndOf="@id/guidelineRight"
        app:layout_constraintStart_toStartOf="@id/guidelineLeft"
        app:layout_constraintTop_toBottomOf="@id/termsAndCond" />

    <android.support.constraint.Group
        app:constraint_referenced_ids="termsAndCond,termsAndCondLine"
        app:layout_constraintTop_toBottomOf="@id/cancelPolicyGroup"
        app:layout_constraintBottom_toTopOf="@id/privatePolicyGroup"
        android:id="@+id/termsAndCondGroup"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

    <TextView
        android:id="@+id/privatePolicy"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:padding="@dimen/padding_small"
        android:text="@string/priv_pol"
        app:layout_constraintEnd_toEndOf="@id/guidelineRight"
        app:layout_constraintStart_toStartOf="@id/guidelineLeft"
        app:layout_constraintTop_toBottomOf="@id/termsAndCondLine" />

    <View
        android:id="@+id/privatePolicyLine"
        android:layout_width="0dp"
        android:layout_height="2dp"
        android:background="#c0c0c0"
        app:layout_constraintEnd_toEndOf="@id/guidelineRight"
        app:layout_constraintStart_toStartOf="@id/guidelineLeft"
        app:layout_constraintTop_toBottomOf="@id/privatePolicy" />

    <android.support.constraint.Group
        android:id="@+id/privatePolicyGroup"
        app:layout_constraintTop_toBottomOf="@id/termsAndCondGroup"
        app:layout_constraintBottom_toTopOf="@id/aboutGroup"
        app:constraint_referenced_ids="privatePolicy,privatePolicyLine"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

    <TextView
        android:id="@+id/about"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:padding="@dimen/padding_small"
        android:text="@string/about"
        app:layout_constraintEnd_toEndOf="@id/guidelineRight"
        app:layout_constraintStart_toStartOf="@id/guidelineLeft"
        app:layout_constraintTop_toBottomOf="@id/privatePolicyLine" />

    <View
        android:id="@+id/aboutLine"
        android:layout_width="0dp"
        android:layout_height="2dp"
        android:background="#c0c0c0"
        app:layout_constraintEnd_toEndOf="@id/guidelineRight"
        app:layout_constraintStart_toStartOf="@id/guidelineLeft"
        app:layout_constraintTop_toBottomOf="@id/about" />

    <android.support.constraint.Group
        android:id="@+id/aboutGroup"
        app:layout_constraintTop_toBottomOf="@id/privatePolicyGroup"
        app:layout_constraintBottom_toBottomOf="@id/guidelineBottom"
        app:constraint_referenced_ids="about,aboutLine"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />


    <android.support.constraint.Guideline
        android:id="@+id/guidelineTop"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0" />

    <android.support.constraint.Guideline
        android:id="@+id/guidelineBottom"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0.5" />

    <android.support.constraint.Guideline
        android:id="@+id/guidelineLeft"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        app:layout_constraintGuide_percent="0.1" />

    <android.support.constraint.Guideline
        android:id="@+id/guidelineRight"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        app:layout_constraintGuide_percent="0.9" />

    </android.support.constraint.ConstraintLayout>

但是，只有这些团体被束缚在一起，观点仍然保持不变。 This is What i got. 我想知道，我们可以在不嵌套布局的情况下链接视图组。

Answer 1

最后，这对我有用：

<?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:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".activities.Settings">

    <include
        android:id="@+id/toolbarLayout"
        layout="@layout/app_bar_main"
        android:layout_width="match_parent"
        android:layout_height="56dp"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/cancelPolicy"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:padding="@dimen/padding_small"
        android:text="@string/canc_pol"
        app:layout_constraintBottom_toTopOf="@id/cancelPolicyLine"
        app:layout_constraintEnd_toEndOf="@id/guidelineRight"
        app:layout_constraintStart_toStartOf="@id/guidelineLeft"
        app:layout_constraintTop_toTopOf="@id/cancelPolicyGroup"
        app:layout_constraintVertical_chainStyle="packed" />

    <View
        android:id="@+id/cancelPolicyLine"
        android:layout_width="0dp"
        android:layout_height="2dp"
        android:background="#c0c0c0"
        app:layout_constraintBottom_toBottomOf="@id/cancelPolicyGroup"
        app:layout_constraintEnd_toEndOf="@id/guidelineRight"
        app:layout_constraintStart_toStartOf="@id/guidelineLeft"
        app:layout_constraintTop_toBottomOf="@id/cancelPolicy" />

    <android.support.constraint.Group
        android:id="@+id/cancelPolicyGroup"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        app:constraint_referenced_ids="cancelPolicy,cancelPolicyLine"
        app:layout_constraintBottom_toTopOf="@id/termsAndCondGroup"
        app:layout_constraintTop_toBottomOf="@id/toolbarLayout"
        app:layout_constraintVertical_chainStyle="spread" />

    <TextView
        android:id="@+id/termsAndCond"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:padding="@dimen/padding_small"
        android:text="@string/t_and_c"
        app:layout_constraintBottom_toTopOf="@id/termsAndCondLine"
        app:layout_constraintEnd_toEndOf="@id/guidelineRight"
        app:layout_constraintStart_toStartOf="@id/guidelineLeft"
        app:layout_constraintTop_toTopOf="@id/termsAndCondGroup"
        app:layout_constraintVertical_chainStyle="packed" />

    <View
        android:id="@+id/termsAndCondLine"
        android:layout_width="0dp"
        android:layout_height="2dp"
        android:background="#c0c0c0"
        app:layout_constraintBottom_toBottomOf="@id/termsAndCondGroup"
        app:layout_constraintEnd_toEndOf="@id/guidelineRight"
        app:layout_constraintStart_toStartOf="@id/guidelineLeft"
        app:layout_constraintTop_toBottomOf="@id/termsAndCond" />

    <android.support.constraint.Group
        android:id="@+id/termsAndCondGroup"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        app:constraint_referenced_ids="termsAndCond,termsAndCondLine"
        app:layout_constraintBottom_toTopOf="@id/privatePolicyGroup"
        app:layout_constraintTop_toBottomOf="@id/cancelPolicyGroup" />

    <TextView
        android:id="@+id/privatePolicy"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:padding="@dimen/padding_small"
        android:text="@string/priv_pol"
        app:layout_constraintBottom_toTopOf="@id/privatePolicyLine"
        app:layout_constraintEnd_toEndOf="@id/guidelineRight"
        app:layout_constraintStart_toStartOf="@id/guidelineLeft"
        app:layout_constraintTop_toTopOf="@id/privatePolicyGroup"
        app:layout_constraintVertical_chainStyle="packed" />

    <View
        android:id="@+id/privatePolicyLine"
        android:layout_width="0dp"
        android:layout_height="2dp"
        android:background="#c0c0c0"
        app:layout_constraintBottom_toBottomOf="@id/privatePolicyGroup"
        app:layout_constraintEnd_toEndOf="@id/guidelineRight"
        app:layout_constraintStart_toStartOf="@id/guidelineLeft"
        app:layout_constraintTop_toBottomOf="@id/privatePolicy" />

    <android.support.constraint.Group
        android:id="@+id/privatePolicyGroup"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        app:constraint_referenced_ids="privatePolicy,privatePolicyLine"
        app:layout_constraintBottom_toTopOf="@id/aboutGroup"
        app:layout_constraintTop_toBottomOf="@id/termsAndCondGroup" />

    <TextView
        android:id="@+id/about"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:padding="@dimen/padding_small"
        android:text="@string/about"
        app:layout_constraintBottom_toTopOf="@id/aboutLine"
        app:layout_constraintEnd_toEndOf="@id/guidelineRight"
        app:layout_constraintStart_toStartOf="@id/guidelineLeft"
        app:layout_constraintTop_toTopOf="@id/aboutGroup"
        app:layout_constraintVertical_chainStyle="packed" />

    <View
        android:id="@+id/aboutLine"
        android:layout_width="0dp"
        android:layout_height="2dp"
        android:background="#c0c0c0"
        app:layout_constraintBottom_toBottomOf="@id/aboutGroup"
        app:layout_constraintEnd_toEndOf="@id/guidelineRight"
        app:layout_constraintStart_toStartOf="@id/guidelineLeft"
        app:layout_constraintTop_toBottomOf="@id/about" />

    <android.support.constraint.Group
        android:id="@+id/aboutGroup"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        app:constraint_referenced_ids="about,aboutLine"
        app:layout_constraintBottom_toBottomOf="@id/guidelineBottom"
        app:layout_constraintTop_toBottomOf="@id/privatePolicyGroup" />


    <android.support.constraint.Guideline
        android:id="@+id/guidelineTop"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0" />

    <android.support.constraint.Guideline
        android:id="@+id/guidelineBottom"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0.6" />

    <android.support.constraint.Guideline
        android:id="@+id/guidelineLeft"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        app:layout_constraintGuide_percent="0.1" />

    <android.support.constraint.Guideline
        android:id="@+id/guidelineRight"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        app:layout_constraintGuide_percent="0.9" />

</android.support.constraint.ConstraintLayout>

我只是通过将高度设置为0并在这些组中放置我的视图来使这些组分布在整个布局中。我知道了：Output

对于任何试图在整个屏幕上散布视图的人，只需使垂直指南具有app:layout_constraintGuide_percent="1"

Answer 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">

    <include
        android:id="@+id/toolbarLayout"
        layout="@layout/app_bar_main"
        android:layout_width="match_parent"
        android:layout_height="56dp"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        android:id="@+id/cancelPolicy"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="canc_pol"
        app:layout_constraintBottom_toTopOf="@+id/cancelPolicyLine"
        app:layout_constraintEnd_toEndOf="@id/guidelineRight"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="@id/guidelineLeft"
        app:layout_constraintTop_toBottomOf="@+id/toolbarLayout" />

    <View
        android:id="@+id/cancelPolicyLine"
        android:layout_width="0dp"
        android:layout_height="2dp"
        android:background="#c0c0c0"
        app:layout_constraintEnd_toEndOf="@id/guidelineRight"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="@id/guidelineLeft"
        app:layout_constraintTop_toBottomOf="@+id/cancelPolicy" />

    <android.support.constraint.Group
        android:id="@+id/cancelPolicyGroup"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:constraint_referenced_ids="cancelPolicy,cancelPolicyLine"
        app:layout_constraintBottom_toTopOf="@id/termsAndCondGroup"
        app:layout_constraintTop_toTopOf="@id/toolbarLayout"
        app:layout_constraintVertical_chainStyle="spread" />


    <TextView
        android:id="@+id/termsAndCond"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="t_and_c"
        app:layout_constraintBottom_toTopOf="@+id/termsAndCondLine"
        app:layout_constraintEnd_toEndOf="@id/guidelineRight"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="@id/guidelineLeft"
        app:layout_constraintTop_toBottomOf="@+id/termsAndCondGroup" />

    <View
        android:id="@+id/termsAndCondLine"
        android:layout_width="0dp"
        android:layout_height="2dp"
        android:background="#c0c0c0"
        app:layout_constraintEnd_toEndOf="@id/guidelineRight"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="@id/guidelineLeft"
        app:layout_constraintTop_toBottomOf="@+id/termsAndCond" />

    <android.support.constraint.Group
        android:id="@+id/termsAndCondGroup"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:constraint_referenced_ids="termsAndCond,termsAndCondLine"
        app:layout_constraintBottom_toTopOf="@id/privatePolicyGroup"
        app:layout_constraintTop_toBottomOf="@id/cancelPolicyGroup" />

    <TextView
        android:id="@+id/privatePolicy"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="priv_pol"
        app:layout_constraintBottom_toTopOf="@+id/privatePolicyLine"
        app:layout_constraintEnd_toEndOf="@id/guidelineRight"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="@id/guidelineLeft"
        app:layout_constraintTop_toBottomOf="@+id/privatePolicyGroup" />

    <View
        android:id="@+id/privatePolicyLine"
        android:layout_width="0dp"
        android:layout_height="2dp"
        android:background="#c0c0c0"
        app:layout_constraintEnd_toEndOf="@id/guidelineRight"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="@id/guidelineLeft"
        app:layout_constraintTop_toBottomOf="@+id/privatePolicy" />

    <android.support.constraint.Group
        android:id="@+id/privatePolicyGroup"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:constraint_referenced_ids="privatePolicy,privatePolicyLine"
        app:layout_constraintBottom_toTopOf="@id/aboutGroup"
        app:layout_constraintTop_toBottomOf="@id/termsAndCondGroup" />

    <TextView
        android:id="@+id/about"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="about"
        app:layout_constraintBottom_toTopOf="@+id/aboutLine"
        app:layout_constraintEnd_toEndOf="@id/guidelineRight"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="@id/guidelineLeft"
        app:layout_constraintTop_toBottomOf="@+id/aboutGroup" />

    <View
        android:id="@+id/aboutLine"
        android:layout_width="0dp"
        android:layout_height="2dp"
        android:background="#c0c0c0"
        app:layout_constraintEnd_toEndOf="@id/guidelineRight"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="@id/guidelineLeft"
        app:layout_constraintTop_toBottomOf="@+id/about" />

    <android.support.constraint.Group
        android:id="@+id/aboutGroup"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:constraint_referenced_ids="about,aboutLine"
        app:layout_constraintBottom_toBottomOf="@id/guidelineBottom"
        app:layout_constraintTop_toBottomOf="@id/privatePolicyGroup" />


    <android.support.constraint.Guideline
        android:id="@+id/guidelineTop"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0" />

    <android.support.constraint.Guideline
        android:id="@+id/guidelineBottom"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0.5" />

    <android.support.constraint.Guideline
        android:id="@+id/guidelineLeft"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        app:layout_constraintGuide_percent="0.1" />

    <android.support.constraint.Guideline
        android:id="@+id/guidelineRight"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        app:layout_constraintGuide_percent="0.9" />

</android.support.constraint.ConstraintLayout>

这样的输出...

如何在约束布局中链接组？

2 个答案: