Kotlin Android开发：如何将CheckBox关联文本设置在复选框下方

实现方案 #

你可以通过两种常用方案实现复选框文字放在下方的需求： #

方案1：使用CheckBox自带属性实现（无额外布局嵌套）

只需要修改原有CheckBox的属性即可快速实现效果：

• 隐藏默认的左侧按钮：添加android:button="@null"属性
• 将复选框状态Drawable设置到文字顶部：通过android:drawableTop传入复选框状态选择器，可用系统自带样式，也可以用自定义的状态选择器
• 用android:drawablePadding调整复选框和下方文字的间距

修改后的示例代码：

<CheckBox
    android:id="@+id/checkBox"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerInParent="true"
    android:button="@null"
    android:drawableTop="@android:drawable/btn_check"
    android:drawablePadding="4dp"
    android:buttonTint="@color/white"
    android:text="test"
    android:textColor="@color/white"/>

如果需要统一多设备的样式表现，建议自己编写复选框的状态选择器替代系统自带的@android:drawable/btn_check。 #

方案2：布局嵌套实现（灵活度更高）

如果后续需要调整样式、扩展交互，建议用垂直布局直接包裹无文字的CheckBox和TextView，只需要给外层布局加点击事件同步选中状态即可：
布局示例代码：

<LinearLayout
    android:id="@+id/checkBoxWrapper"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerInParent="true"
    android:gravity="center"
    android:orientation="vertical">

    <CheckBox
        android:id="@+id/checkBox"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:buttonTint="@color/white"/>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="test"
        android:textColor="@color/white"
        android:layout_marginTop="4dp"/>

</LinearLayout>

对应交互逻辑示例（Kotlin）：

checkBoxWrapper.setOnClickListener {
    checkBox.isChecked = !checkBox.isChecked
}

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