androidx.constraintlayout.helper.widget.나는 모른다

만약 개수가 정해지지 않은 View & 너비가 줄을 바꾸려는 레이아웃으로 가득 차면
GridView(Grid Layout) #num Columns(auto fit)와 Chip Group을 사용자 정의해서 Flexbox Layout을 사용했는지 ConstraintLayout2.0에 Flow라는 Layout이 추가되었는지 모르겠습니다.
금방 해볼게요.

xml로 지정할 때

배치

<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <androidx.constraintlayout.helper.widget.Flow
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:orientation="horizontal"
            app:flow_wrapMode="chain"
            app:constraint_referenced_ids="test1,test2,test3,test4,test5,test6"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintEnd_toEndOf="parent" />
        <TextView
            android:id="@+id/test1"
            android:text="TEST"
            android:layout_height="wrap_content"
            android:layout_width="wrap_content" />
        <TextView
            android:id="@+id/test2"
            android:text="TEST2"
            android:layout_height="wrap_content"
            android:layout_width="wrap_content" />
        <TextView
            android:id="@+id/test3"
            android:text="TEST3"
            android:layout_height="wrap_content"
            android:layout_width="wrap_content" />
        <TextView
            android:id="@+id/test4"
            android:text="TESTあああああああああ"
            android:layout_height="wrap_content"
            android:layout_width="wrap_content" />
        <TextView
            android:id="@+id/test5"
            android:text="TEST5いいいいいいいいいいいい"
            android:layout_height="wrap_content"
            android:layout_width="wrap_content" />
        <TextView
            android:id="@+id/test6"
            android:text="TEST6ううううううううううう"
            android:layout_height="wrap_content"
            android:layout_width="wrap_content" />
    </androidx.constraintlayout.widget.ConstraintLayout>
</layout>

ConstraintLayout의 부하에 Flow를 배치한다.
constraint_referenced_id에 표시할 레이아웃의 id를 지정합니다.
이번에는 뷰를 가로로 배열하려고 지정했다android:orientation="horizontal"또한 폭이 충분하지 않으면 다른 줄을 원합니다app:flow_wrapMode="chain"하고 있습니다.

스크린

한 줄만 가라앉을 수 없는test5와test6의View가 줄로 바뀌었습니다.
목적과 같다.

동적 지정 시

전체 화면의 배치

<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <androidx.constraintlayout.widget.ConstraintLayout
        android:id="@+id/constraint"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <androidx.constraintlayout.helper.widget.Flow
            android:id="@+id/flow"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:orientation="horizontal"
            app:flow_wrapMode="chain"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintEnd_toEndOf="parent" />
    </androidx.constraintlayout.widget.ConstraintLayout>
</layout>

동일한 레이아웃 추가

<?xml version="1.0" encoding="utf-8"?>
<layout
    xmlns:android="http://schemas.android.com/apk/res/android">
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
</layout>

코드

class MainActivity : AppCompatActivity() {

    private val binding: MainActivityBinding by dataBinding()

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.main_activity)
        val test = (0..20).map { "test$it" }
        val ids = IntArray(test.size)

        test.forEachIndexed { index, text ->
            val binding = ViewTextBinding.inflate(LayoutInflater.from(this))
            val textView = binding.root as TextView
            textView.text = text
            textView.id = View.generateViewId()
            this.binding.constraint.addView(textView)
            ids[index] = textView.id
        }
        binding.flow.referencedIds = ids
    }
}

같은 추가 시 xml을 사용하여 지정한 것과 기본적으로 같으며, Add는 ConstraintLayout에 추가할 View를 추가합니다.
그리고 View의 id를 Flow의referencedIds에 건네주면 완성됩니다.

스크린

이윤을 모르는 사람이 됐지만 줄을 섰어요
참고로 커미션 등 문제는 xml의 플로우에서 ↓를 설정하여 해결할 수 있다.

app:flow_horizontalStyle="packed"
app:flow_horizontalGap="4dp"
app:flow_verticalGap="4dp"

메시지

코드 끝에 View 동적 추가

ids.forEach {
    binding.constraint.removeView(binding.constraint.findViewById(it))
}

추가되었습니다.

어?사라지다
아니, 일할 때 사라지지 않았어. 울었어!!
진짜 울었어!!
날 믿어!!

View가 사라진 경우 처리 방법 없음

ViewGroup#removeView(index) 정상적으로 작동하니까 그걸 썼어요.

최후

여느 때와 다른 플로우입니다.
끝맺다