只有當它們有足夠的空間時才能查看，否則請在底部

Question

使用ConstraintLayout我有2 TextView，我希望當它們有足夠的空間來查看它們的內容時，它們彼此相鄰。但是，如果TextView A佔用大量空間並填充所有屏幕寬度，那麼比我希望TextView B在TextView A下移動，而不是仍然處於右側，但不可見（不在屏幕上）。

所以用下面的代碼，我得到了我的2 TextView彼此相鄰。

<android.support.constraint.ConstraintLayout 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content"> 

    <TextView 
     android:id="@+id/text_view_a" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_marginLeft="8dp" 
     app:layout_constraintLeft_toLeftOf="parent" 
     app:layout_constraintTop_toTopOf="parent" 
     android:layout_marginTop="8dp" 
     tools:text="a very long text ..." /> 

    <TextView 
     android:id="@+id/text_view_b" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_marginLeft="8dp" 
     android:layout_marginTop="8dp" 
     app:layout_constraintLeft_toRightOf="@+id/text_view_a" 
     app:layout_constraintTop_toTopOf="parent" 
     tools:text="some text" /> 

</android.support.constraint.ConstraintLayout> 

我應該如何編輯此代碼片段，以便TextView B在TextView A下進入，如果他們沒有留給他任何空間的話？

Answer 1

看看Google的FlexboxLayout。這可能是你需要流動你的TextView。你可以找到一些文件here和教程here。

FlexboxLayout是一個庫項目，爲CSS帶來了CSS靈活框佈局模塊的類似功能。

你可以看一下在ConstraintLayout內FlexbotLayout包裹你的TextView s到允許在需要它們的流動。

下面是一個示例佈局。由於TextView排名第一的長文本，兩個TextView將被堆疊。如果縮短這段文字，兩個TextView將並列。

我希望這會有所幫助。

<?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="com.example.flexer.MainActivity"> 

    <com.google.android.flexbox.FlexboxLayout 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="0dp" 
     app:alignContent="stretch" 
     app:alignItems="stretch" 
     app:flexWrap="wrap" 
     app:layout_constraintLeft_toLeftOf="parent" 
     app:layout_constraintRight_toRightOf="parent" 
     app:layout_constraintTop_toTopOf="parent"> 

     <TextView 
      android:id="@+id/text_view_a" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_margin="8dp" 
      android:text="a very long text ...a very long text ...a very long text ...a very long text ...a very long text ...a very long text ...a very long text ...a very long text ..." /> 

     <TextView 
      android:id="@+id/text_view_b" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_margin="8dp" 
      android:text="some text" /> 
    </com.google.android.flexbox.FlexboxLayout> 
</android.support.constraint.ConstraintLayout>