ConstraintLayout 流式布局：Flow的动态加载

废话不多说，直接上菜，内容也比较简单。

首先，第一部分：布局

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/constraintLayout"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    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="wrap_content"
      android:orientation="horizontal"
      app:flow_wrapMode="chain"
      app:layout_constraintBottom_toBottomOf="parent"
      app:layout_constraintEnd_toEndOf="parent"
      app:layout_constraintStart_toStartOf="parent"
      />
</androidx.constraintlayout.widget.ConstraintLayout>

Flow的部分属性含义：

<androidx.constraintlayout.helper.widget.Flow
    android:id="@+id/flow"
    //宽度要指定，否则会顶出屏幕外面
    android:layout_width="0dp" 
    android:layout_height="wrap_content"
    android:layout_marginStart="10dp"
    android:layout_marginEnd="10dp"
    //引用的id（内部的view的id）
    app:constraint_referenced_ids="tv_type,tv_online_state,tv_switch_state"
    //chain或者aligned，chain：链形式，依次挨着排，aligned会两端对齐
    app:flow_wrapMode="chain" 
    //首行的对齐方式，packed:靠最左侧挨着排，水平间隔：horizontalGap生效， 
    // spread：分散对齐，两端不贴边。spread_inside：分散对齐，两头贴边
    app:flow_firstHorizontalStyle="packed"
    //最后一行的对齐方式，其他属性参考firstHorizontalStyle
    app:flow_lastHorizontalStyle="packed"
    // 全局水平bias，为0时，每行都贴左边，可解决中间行单独占一行时，不贴最左侧的问题
    app:flow_horizontalBias="0"
    // 第一行水平bias，为0时，贴最左边
    app:flow_firstHorizontalBias="0"
    // 最后一行水平bias，为0时，贴最左边
    app:flow_lastHorizontalBias="0"
    // 控件水平方向上的间隔
    app:flow_horizontalGap="10dp"
    // 行间隔
    app:flow_verticalGap="8dp"
    app:layout_constraintEnd_toStartOf="@id/ibt_go"
    app:layout_constraintStart_toEndOf="@id/guideline"
    app:layout_constraintTop_toTopOf="@id/tv_org_name" />

第二部分，代码的方式，动态添加

val ids = mutableListOf<Int>()
for (i in 0..4) {
    val customView = CustomComponent (this)
    val id = View.generateViewId()
    customView.id = id 
    ids.add(id)
    constraintLayout.addView(customView,i)
    flow.addView(customView)
}
flow.referencedIds = ids.toIntArray()

主要的内容就是这两句：constraintLayout.addView(customView,i)和

flow.referencedIds = ids.toIntArray()

固定个数实现

private fun refreshHistoryV2(){
        val history = SPFUserData.getHistoryList()
        val childViews = mBind.llHistoryLabel.flowCategory.referencedIds.map { id ->
            mBind.llHistoryLabel.root.findViewById<View>(id)
        }
        if (history.isEmpty()) {
            childViews.forEach {
                it.hide()
            }
            mBind.groupHistory.hide()
            return
        }
        mBind.groupHistory.show()
        history.forEachIndexed { _index, _str ->
            if (_index < childViews.size) {
                val child = childViews[_index]
                if (child is TextView) {
                    child.show()
                    child.text = _str
                    child.tag = _str
                    child.setOnClickListener {
                        val search = child.text.toString()
                        mBind.includeSearch.edInputSearch.setText(search)
                        startSearch(search)
                    }
                }
            }
        }
    }

思路：

在布局中，先添加到flow中，然后控制哪些显示和隐藏