代码创建含双按钮与EditText的ConstraintLayout失败

当前代码存在以下问题导致不符合预期：

• EditText未开启多行输入属性，无法自动换行扩展高度
• EditText宽度设为WRAP_CONTENT，无法填充两侧按钮之间的空间
• 约束逻辑未确保EditText在按钮间自适应宽度，且按钮与EditText的对齐关系存在疏漏

修复后的完整代码如下：

@Composable
fun ShowWrapped() {
    AndroidView(factory = { context ->
        createChat(context)
    })
}

fun createChat(context: Context): ConstraintLayout {
    val constraintLayout = ConstraintLayout(context).apply {
        id = View.generateViewId()
        layoutParams = ViewGroup.LayoutParams(
            MATCH_PARENT,
            MATCH_PARENT,
        )
        // 添加内边距避免内容贴边
        setPadding(16.dpToPx(context), 16.dpToPx(context), 16.dpToPx(context), 16.dpToPx(context))
    }

    val buttonA = ImageButton(context).apply {
        id = View.generateViewId()
        layoutParams = ConstraintLayout.LayoutParams(
            WRAP_CONTENT,
            WRAP_CONTENT,
        )
    }

    val buttonB = ImageButton(context).apply {
        id = View.generateViewId()
        layoutParams = ConstraintLayout.LayoutParams(
            WRAP_CONTENT,
            WRAP_CONTENT,
        )
    }

    val editText = EditText(context).apply {
        id = View.generateViewId()
        layoutParams = ConstraintLayout.LayoutParams(
            0, // 宽度设为0dp，通过约束自适应填充空间
            WRAP_CONTENT,
        )
        // 开启多行输入
        inputType = InputType.TYPE_TEXT_FLAG_MULTI_LINE or InputType.TYPE_CLASS_TEXT
        // 控制高度范围
        minLines = 1
        maxLines = 5
        hint = "输入内容..."
    }

    constraintLayout.addView(buttonA)
    constraintLayout.addView(buttonB)
    constraintLayout.addView(editText)

    buttonA.setImageResource(R.drawable.ic_launcher_foreground)
    buttonB.setImageResource(R.drawable.ic_launcher_foreground)

    val set = ConstraintSet()
    set.clone(constraintLayout)

    // 左侧按钮：左对齐父布局，顶部对齐EditText顶部
    set.connect(buttonA.id, ConstraintSet.START, constraintLayout.id, ConstraintSet.START)
    set.connect(buttonA.id, ConstraintSet.TOP, editText.id, ConstraintSet.TOP)
    set.setMargin(buttonA.id, ConstraintSet.END, 8.dpToPx(context))

    // 右侧按钮：右对齐父布局，顶部对齐EditText顶部
    set.connect(buttonB.id, ConstraintSet.END, constraintLayout.id, ConstraintSet.END)
    set.connect(buttonB.id, ConstraintSet.TOP, editText.id, ConstraintSet.TOP)
    set.setMargin(buttonB.id, ConstraintSet.START, 8.dpToPx(context))

    // EditText：底部对齐父布局，左右连接两侧按钮
    set.connect(editText.id, ConstraintSet.BOTTOM, constraintLayout.id, ConstraintSet.BOTTOM)
    set.connect(editText.id, ConstraintSet.START, buttonA.id, ConstraintSet.END)
    set.connect(editText.id, ConstraintSet.END, buttonB.id, ConstraintSet.START)

    set.applyTo(constraintLayout)

    return constraintLayout
}

// 扩展函数：dp转px
fun Int.dpToPx(context: Context): Int {
    return (this * context.resources.displayMetrics.density).toInt()
}

关键修改说明： #

1. EditText多行配置：通过inputType开启多行输入，设置minLines和maxLines限制高度范围，确保内容过多时自动扩展高度。
2. 自适应宽度设置：将EditText宽度设为0dp，通过左右约束绑定到两侧按钮，自动填充中间剩余空间。
3. 对齐逻辑修正：让两侧按钮的顶部严格绑定到EditText的顶部，当EditText因多行内容变高时，按钮会始终对齐其顶部位置。
4. 视觉优化：给父布局和控件间添加内边距、间距，提升界面美观度。

内容的提问来源于stack exchange，提问作者J. Doe