我们在一些应用中看到单选按钮、复选框在选中、未选中的图标是这样的： 但在鸿蒙开发中，看到原始的单选按钮、复选框在选中、未选中时的状态却是这样的： 简单美化一下后，是这样的： 对美的追求驱使我们进一步美化一下该组件。具体方法如下： 1. 准备4张图片，分别为单选按钮选中、未选中和复选框选中、未选中状态时对应的图片，并导入到media资源中： 2. 新建一个单选按钮的xml样式文件radiobutton_state.xml，内容如下： <?xml version="1.0" encoding="utf-8"?><state-container xmlns:ohos="http://schemas.huawei.com/res/ohos";> <item ohos:state="component_state_checked" ohos:element="$media:rbyes"/> <item ohos:state="component_state_empty" ohos:element="$media:rbno"/></state-container> 新建一个复选框的xml样式文件checkbox_state.xml，内容如下： <?xml version="1.0" encoding="utf-8"?><state-container xmlns:ohos="http://schemas.huawei.com/res/ohos";> <item ohos:state="component_state_checked" ohos:element="$media:cbyes"/> <item ohos:state="component_state_empty" ohos:element="$media:cbno"/></state-container> 3. 在ability_main布局文件中加入单选按钮、复选框组件标签，将每个RadioButton的check_element设置为radiobutton_state，将每个Checkbox的check_element设置为checkbox_state。 <RadioButton ohos:height="match_content" ohos:width="match_content" ohos:text="男" ohos:text_size="20fp" ohos:margin="20vp" ohos:background_element="$graphic:radionbutton_state"/> <Checkbox ohos:height="match_content" ohos:width="match_content" ohos:top_margin="50vp" ohos:alignment="left" ohos:text="排球" ohos:margin="20vp" ohos:text_size="20fp" ohos:check_element="$graphic:checkbox_state"/> 在模拟器中运行，就看到自己设置的美美的样式了。 这样一来，是不是简约又美美的？ 需要注意的是：

• 预先准备的图片尺寸要适中，要与文字大小比例适配。
• radiobutton_state.xml和checkbox_state.xml文件中，<item ohos:state="component_state_empty" />标签要放到<item ohos:state="component_state_checked"/>标签之后，否则无法显示预期效果。