Question

我正在尝试使用ConstrainLayout，但发现它很难使用。我有一个用于设置屏幕的布局，它使用LinearLayout和RelativeLayout，非常简单，易于实现。这是布局：

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

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <TextView
            android:id="@+id/tv_stay_awake"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Stay awake"
            android:padding="10dp"/>
        <Switch
            android:id="@+id/switch_stay_awake"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_centerVertical="true"/>
    </RelativeLayout>


    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <TextView
            android:id="@+id/tv_notification"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Enable Notification"
            android:padding="10dp"/>
        <Switch
            android:id="@+id/switch_notification"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_centerVertical="true"/>
    </RelativeLayout>


    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <TextView
            android:id="@+id/tv_location"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Enable location"
            android:padding="10dp"/>
        <Switch
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_centerVertical="true"/>
    </RelativeLayout>

</LinearLayout>

这就是它的样子：

现在我想构建相同的设置UI，但是使用ConstrainLayout，这里是我对此设置UI的ConstrainLayout。

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

    <TextView
        android:id="@+id/tv_stay_awake"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="10dp"
        android:text="Stay awake"/>
    <Switch
        android:id="@+id/switch_stay_awake"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintRight_toRightOf="parent" />


    <TextView
        android:id="@+id/tv_notification"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="10dp"
        android:text="Enable Notification"
        app:layout_constraintTop_toBottomOf="@+id/tv_stay_awake"/>

    <Switch
        android:id="@+id/switch_notification"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/switch_stay_awake"/>


    <TextView
        android:id="@+id/tv_location"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="10dp"
        android:text="Enable location"
        app:layout_constraintTop_toBottomOf="@+id/tv_notification"/>
    <Switch
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/switch_notification"/>

</android.support.constraint.ConstraintLayout>

结果如下：

如您所见，“切换”按钮未与TextView对齐。如何在同一行级别将它们与TextView对齐，所以它看起来与我使用LinearyLayout和RelativeLayout的那个相同？我知道我可以在每行的RelativeLayout中放置TextView和Switch按钮，但如果我这样做，就没有理由使用ConstrainLayout。

Answer 1

你可以试试这个。

在app:layout_constraintBaseline_toBaselineOf="@+id/tv_notification" XML代码中添加Switch。

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

    <TextView
        android:id="@+id/tv_stay_awake"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="10dp"
        android:text="Stay awake"/>

    <Switch
        android:id="@+id/switch_stay_awake"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintBaseline_toBaselineOf="@+id/tv_stay_awake"
        app:layout_constraintRight_toRightOf="parent"/>


    <TextView
        android:id="@+id/tv_notification"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="10dp"
        android:text="Enable Notification"
        app:layout_constraintTop_toBottomOf="@+id/tv_stay_awake"/>

    <Switch
        android:id="@+id/switch_notification"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintBaseline_toBaselineOf="@+id/tv_notification"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/switch_stay_awake"/>


    <TextView
        android:id="@+id/tv_location"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="10dp"
        android:text="Enable location"
        app:layout_constraintTop_toBottomOf="@+id/tv_notification"/>

    <Switch
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintBaseline_toBaselineOf="@+id/tv_location"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/switch_notification"/>

</android.support.constraint.ConstraintLayout>

<强>输出

如何将此LinearLayout和RelativeLayout转换为ConstraintLayout？

1 个答案: