如何在ConstraintLayout中通过代码添加多视图并调整位置？

当然可以通过代码给ConstraintLayout添加多个视图并自定义位置约束，你的思路方向正确，调整约束设置时机能避免不必要的问题。以下是修正后的完整代码示例，以及关键实现细节说明：

完整代码示例 #

val layout = findViewById<ConstraintLayout>(R.id.activity_main)

// 创建第一个按钮并添加到布局
val button = Button(this)
button.text = "Hello"
button.id = View.generateViewId()
layout.addView(button)

// 创建第二个按钮并添加到布局
val newButton = Button(this)
newButton.text = "Yeeey"
newButton.id = View.generateViewId()
layout.addView(newButton)

// 初始化ConstraintSet并克隆当前布局状态
val set = ConstraintSet()
set.clone(layout)

// 配置第一个按钮约束：底部对齐父布局，左右填充父布局，固定高度200px
set.connect(button.id, ConstraintSet.BOTTOM, ConstraintSet.PARENT_ID, ConstraintSet.BOTTOM, 0)
set.connect(button.id, ConstraintSet.LEFT, ConstraintSet.PARENT_ID, ConstraintSet.LEFT, 0)
set.connect(button.id, ConstraintSet.RIGHT, ConstraintSet.PARENT_ID, ConstraintSet.RIGHT, 0)
set.constrainHeight(button.id, 200)

// 配置第二个按钮约束：底部对齐第一个按钮顶部，左右填充父布局，固定高度200px
set.connect(newButton.id, ConstraintSet.BOTTOM, button.id, ConstraintSet.TOP, 0)
set.connect(newButton.id, ConstraintSet.LEFT, ConstraintSet.PARENT_ID, ConstraintSet.LEFT, 0)
set.connect(newButton.id, ConstraintSet.RIGHT, ConstraintSet.PARENT_ID, ConstraintSet.RIGHT, 0)
set.constrainHeight(newButton.id, 200)

// 将所有约束应用到布局
set.applyTo(layout)

关键实现细节 #

• 生成唯一视图ID：所有动态添加的视图必须调用View.generateViewId()生成唯一ID，否则ConstraintSet无法识别并设置约束。
• 先添加视图再处理约束：必须先把所有视图添加到ConstraintLayout，再调用set.clone(layout)捕获布局的当前状态，确保ConstraintSet能获取到新视图的引用。
• 统一应用约束：避免多次调用applyTo()，统一配置完所有视图的约束后再一次性应用，既提升性能也能避免约束冲突。

常见约束场景示例 #

• 左/右对齐父布局（带边距）：

  set.connect(view.id, ConstraintSet.LEFT, ConstraintSet.PARENT_ID, ConstraintSet.LEFT, 16)
  set.connect(view.id, ConstraintSet.RIGHT, ConstraintSet.PARENT_ID, ConstraintSet.RIGHT, 16)
  

• 视图居中显示：

  // 快捷方式实现居中
  set.centerHorizontally(centerBtn.id, ConstraintSet.PARENT_ID)
  set.centerVertically(centerBtn.id, ConstraintSet.PARENT_ID)
  
  // 手动连接约束实现居中
  set.connect(centerBtn.id, ConstraintSet.LEFT, ConstraintSet.PARENT_ID, ConstraintSet.LEFT, 0)
  set.connect(centerBtn.id, ConstraintSet.RIGHT, ConstraintSet.PARENT_ID, ConstraintSet.RIGHT, 0)
  set.connect(centerBtn.id, ConstraintSet.TOP, ConstraintSet.PARENT_ID, ConstraintSet.TOP, 0)
  set.connect(centerBtn.id, ConstraintSet.BOTTOM, ConstraintSet.PARENT_ID, ConstraintSet.BOTTOM, 0)
  

• 视图间相对定位：让B视图在A视图右侧且顶部对齐：

  set.connect(viewB.id, ConstraintSet.LEFT, viewA.id, ConstraintSet.RIGHT, 16)
  set.connect(viewB.id, ConstraintSet.TOP, viewA.id, ConstraintSet.TOP, 0)
  

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