web-dev-qa-db-ja.com

3行以上のときにConstraintLayout TextViewの重なりを修正する方法

1つのテキストビューのテキストが2行目に達すると、その下にあるように制約されている別のテキストビューが行の中央までプッシュダウンされないという制約レイアウトに問題があります。

3つのテキストビューを持つ単純なレイアウトを作成しました。最初のテキストビューは左側にあり、幅が設定されています。 2番目のものは、この右側、親とその間にあります。 3番目は2番目の下、最初の左側にあります。

私はそれを次のように見せたいです: Layout of activity with the three text views as desired

ただし、「重複しない」というテキストを削除した場合。私は得る: Layout of activity with the third text view overlapping the second.

変更されるポイント(「オーバーラップしない」の「O」)は、最初のテキストビューが存在しないときに、テキストの長さが2行になったように見えます。 Image showing if the first TextView was not there that the text would wrap perfectly.

画面の左側にテキストビューがある場合でも、2行に達するとすぐにテキストビュー3を押し下げるように、このレイアウトを変更するにはどうすればよいですか? 2行目の途中まで押し下げるのとは対照的です。

私のXML:

<?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="wrap_content"
    tools:context="com.testapp.myapplication.MainActivity">

    <TextView
        Android:id="@+id/text_view_1"
        Android:layout_width="120dp"
        Android:layout_height="0dp"
        Android:background="@color/colorAccent"
        Android:text="Text View 1"
        Android:textAppearance="@style/TextAppearance.AppCompat.Body2"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        Android:id="@+id/text_view_2"
        Android:layout_width="0dp"
        Android:layout_height="wrap_content"
        Android:background="#22AA99"
        Android:text="Text View 2 Showing problem with overlap. Overlapping. Not O"
        Android:textAppearance="@style/TextAppearance.AppCompat.Body2"
        app:layout_constraintLeft_toRightOf="@id/text_view_1"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <TextView
        Android:id="@+id/text_view_3"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:background="#FF00FF"
        Android:text="Text View 3"
        Android:textAppearance="@style/TextAppearance.AppCompat.Body2"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toRightOf="@id/text_view_1"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@id/text_view_2" />

</Android.support.constraint.ConstraintLayout>

ありがとう。

9
MungoRae

私はそれ以来見つけました

app:layout_constrainedHeight="true"

制約レイアウトから 1.1.0-beta2 wrap_contentに制約を適用します。したがって、これはapp:layout_constraintBottom_toBottomOf="parent"これは、ビューの下部のマージンを有効にします。

27
MungoRae

この行を削除します。

app:layout_constraintBottom_toBottomOf="parent"

iD text_view_3TextViewから:

<TextView
    Android:id="@+id/text_view_3"
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content"
    Android:background="#FF00FF"
    Android:text="Text View 3"
    Android:textAppearance="@style/TextAppearance.AppCompat.Body2"
    app:layout_constraintLeft_toRightOf="@id/text_view_1"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toBottomOf="@id/text_view_2" />
3