Android XML实现四按钮自适应布局：单行转2*2排列需求

方法一：调整FlexboxLayout属性（推荐） #

既然你已经在用FlexboxLayout，只需调整几个关键属性就能限制最多2行，同时保证换行时自动转为2列：

1. 给FlexboxLayout设置核心属性：

   <com.google.android.flexbox.FlexboxLayout
       android:layout_width="match_parent"
       android:layout_height="wrap_content"
       app:flexWrap="wrap"
       app:justifyContent="space_between"
       app:alignItems="center"
       app:maxLines="2"> <!-- 强制最多显示2行 -->
   

2. 给每个Button配置约束，避免出现3行：

   <Button
       android:layout_width="0dp"
       android:layout_height="wrap_content"
       app:flexGrow="1" <!-- 单行时均分父容器宽度 -->
       android:minWidth="0dp" <!-- 允许宽度收缩适配 -->
       android:maxLines="1" <!-- 按钮文本不换行，防止宽度异常 -->
       android:paddingHorizontal="8dp"/> <!-- 避免文本贴边 -->
   

   原理：flexGrow="1"让按钮在单行时均分空间；当字体放大导致总宽度超出父容器时，Flexbox自动换行，每个按钮的最小宽度被约束为父容器的1/2，因此只会出现每行2个的2行布局，不会出现3行。

方法二：用ConstraintLayout Flow组件 #

Flow是ConstraintLayout自带的流式布局组件，天生支持精准的换行规则：

1. 布局示例：

   <androidx.constraintlayout.widget.ConstraintLayout
       android:layout_width="match_parent"
       android:layout_height="wrap_content">
   
       <Button android:id="@+id/btn1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="按钮1"/>
       <Button android:id="@+id/btn2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="按钮2"/>
       <Button android:id="@+id/btn3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="按钮3"/>
       <Button android:id="@+id/btn4" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="按钮4"/>
   
       <androidx.constraintlayout.helper.widget.Flow
           android:layout_width="match_parent"
           android:layout_height="wrap_content"
           app:constraint_referenced_ids="btn1,btn2,btn3,btn4"
           app:flow_wrapMode="chain"
           app:flow_horizontalStyle="spread"
           app:flow_maxElementsWrap="2"/> <!-- 强制每行最多2个元素 -->
   </androidx.constraintlayout.widget.ConstraintLayout>
   

   原理：flow_maxElementsWrap="2"直接限制每行元素数量，当单行放不下4个按钮时，自动拆分为2行2列，完全匹配需求。

方法三：代码动态调整（兜底方案） #

如果布局属性无法覆盖极端场景，可通过代码监听布局变化，手动调整：

1. 在Activity/Fragment中添加逻辑：

   val flexbox = findViewById<FlexboxLayout>(R.id.flexbox)
   val btn1 = findViewById<Button>(R.id.btn1)
   
   flexbox.viewTreeObserver.addOnGlobalLayoutListener(object : ViewTreeObserver.OnGlobalLayoutListener {
       override fun onGlobalLayout() {
           flexbox.viewTreeObserver.removeOnGlobalLayoutListener(this)
           val btnWidth = btn1.width
           val parentWidth = flexbox.width
           val maxPerRow = parentWidth / btnWidth
   
           if (maxPerRow < 4) {
               // 切换为2行2列
               listOf(btn1, btn2, btn3, btn4).forEach {
                   it.flexBasisPercent = 0.5f
               }
               flexbox.maxLines = 2
           } else {
               // 恢复单行均分
               listOf(btn1, btn2, btn3, btn4).forEach {
                   it.flexBasisPercent = 0f
               }
               flexbox.maxLines = 1
           }
       }
   })
   

   这段逻辑会在布局测量完成后自动判断，调整按钮的宽度占比和布局行数。

内容的提问来源于stack exchange，提问作者skv1996