android - ConstraintLayout は複数の水平チェーンを異なる方法で処理します

Question

ConstraintLayout一連のテキスト エントリがあり、言語ごとにサイズが変わる可能性のあるラベルを使用して、シンプルなレイアウトにする必要があると思われるものをセットアップしようとしています。ラベルの右側にバリアがあるため、ラベルの長さが変わってもテキスト エントリは整列されたままになります。

テキスト エントリを公称サイズ (この例では、一番上のものは 200 dp、他のものは 150 dp) にしたいのですが、ラベルが長くて画面が小さい場合は、画面に合わせて必要に応じて縮小できるようにします。ランドスケープ モードまたは大きな画面では、エントリは最大サイズで、バリアに対して左に揃える必要があります。

多くの試行錯誤の後、2 つのチェーンを「spread_inside」に設定し、最後のチェーンを「packed」に設定することで、以下のレイアウトが機能するようになりました。それらをすべて spread_inside に設定すると、レイアウトが台無しになります (entry_2 が最小サイズに縮小されます)。

これは、将来のアップデートでこのように動作しなくなるような匂いがしますConstraintLayout(これは com.android.support.constraint:constraint-layout:1.1.0-beta5 を使用しています)。このレイアウトの動作は、beta4 を使用すると異なります (これも間違っていますが、別の方法で間違っています。beta4 ではすべてが画面の右側に配置されます)。

ここで何か不足していますか？他の誰かが同様のチェーンパターンを持っていますか? これを行うより良い方法はありますか？

<?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"
    android:padding="16dp"
    tools:context="com.mypackage.testapp.MainActivity">

    <TextView
        android:text="Label 1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintTop_toTopOf="@+id/entry_1"
        app:layout_constraintBottom_toBottomOf="@+id/entry_1"
        android:id="@+id/label_1" />

    <EditText
        android:id="@+id/entry_1"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_margin="5dp"
        android:inputType="text"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintHorizontal_chainStyle="spread_inside"
        app:layout_constraintHorizontal_weight="100.0"
        app:layout_constraintLeft_toRightOf="@+id/guideline"
        app:layout_constraintRight_toLeftOf="@+id/space_1"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintWidth_max="200sp"
        app:layout_constraintWidth_min="100sp" />

    <Space
        android:id="@+id/space_1"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintLeft_toRightOf="@+id/entry_1"
        app:layout_constraintHorizontal_weight="0.01"
        app:layout_constraintTop_toTopOf="@+id/entry_1"
        app:layout_constraintBottom_toBottomOf="@+id/entry_1"/>

    <TextView
        android:text="Label 2 Is very very long"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintTop_toTopOf="@+id/entry_2"
        app:layout_constraintBottom_toBottomOf="@+id/entry_2"
        android:id="@+id/label_2" />

    <EditText
        android:id="@+id/entry_2"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_margin="5dp"
        android:inputType="text"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintHorizontal_chainStyle="spread_inside"
        app:layout_constraintHorizontal_weight="100.0"
        app:layout_constraintLeft_toRightOf="@+id/guideline"
        app:layout_constraintRight_toLeftOf="@+id/space_2"
        app:layout_constraintTop_toBottomOf="@+id/entry_1"
        app:layout_constraintWidth_max="150sp"
        app:layout_constraintWidth_min="100sp" />

    <Space
        android:id="@+id/space_2"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintLeft_toRightOf="@+id/entry_2"
        app:layout_constraintHorizontal_weight="0.01"
        app:layout_constraintTop_toTopOf="@+id/entry_2"
        app:layout_constraintBottom_toBottomOf="@+id/entry_2"/>

    <TextView
        android:text="Label Three"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintTop_toTopOf="@+id/entry_3"
        app:layout_constraintBottom_toBottomOf="@+id/entry_3"
        android:id="@+id/label_3" />

    <EditText
        android:id="@+id/entry_3"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_margin="5dp"
        android:inputType="text"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintHorizontal_chainStyle="packed"
        app:layout_constraintHorizontal_weight="100.0"
        app:layout_constraintLeft_toRightOf="@+id/guideline"
        app:layout_constraintRight_toLeftOf="@+id/space_3"
        app:layout_constraintTop_toBottomOf="@+id/entry_2"
        app:layout_constraintWidth_max="150sp"
        app:layout_constraintWidth_min="100sp" />

    <Space
        android:id="@+id/space_3"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintLeft_toRightOf="@+id/entry_3"
        app:layout_constraintHorizontal_weight="0.01"
        app:layout_constraintTop_toTopOf="@+id/entry_3"
        app:layout_constraintBottom_toBottomOf="@+id/entry_3"/>

    <android.support.constraint.Barrier
        android:id="@+id/guideline"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        app:barrierDirection="right"
        app:constraint_referenced_ids="label_1,label_2,label_3" />

</android.support.constraint.ConstraintLayout>

編集：

この問題を Google の ConstraintLayout チームに報告したところ、バグであることが確認されました。修正したら、複雑なチェーンなしでこれを実行できるはずです。

Answer 1

で試してみてくださいRelative Layout

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    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:padding="16dp">

    <TextView
        android:id="@+id/label_1"
        android:text="Label 1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="20sp"/>
    <EditText
        android:id="@+id/entry_1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="15dp"
        android:layout_alignBaseline="@+id/label_1"
        android:layout_toEndOf="@+id/label_1"
        android:maxLength="20"
        android:textSize="20sp"
        android:inputType="text" />
    <TextView
        android:id="@+id/label_2"
        android:text="Label 2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp"
        android:textSize="20sp"
        android:layout_below="@+id/label_1"/>
    <EditText
        android:id="@+id/entry_2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="15dp"
        android:layout_alignBaseline="@+id/label_2"
        android:layout_toEndOf="@+id/label_2"
        android:maxLength="20"
        android:textSize="20sp"
        android:inputType="text" />
    <TextView
        android:id="@+id/label_3"
        android:text="Label 3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp"
        android:textSize="20sp"
        android:layout_below="@+id/label_2"/>
    <MultiAutoCompleteTextView
        android:id="@+id/entry_3"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="15dp"
        android:layout_alignBaseline="@+id/label_3"
        android:layout_toEndOf="@+id/label_3"
        android:maxLength="200"
        android:textSize="20sp"/>
</RelativeLayout>

編集:ConstraintLayoutこれが唯一のオプションではない場合、フォームの基本構造である必要があります。

• 相対レイアウトを使用するだけで、Table Layoutここでは必要ありません
• 設定値android:maxLength
• より多くのテキスト文字を含めるにはMultiAutoCompleteTextView