问答博客资讯标签用户活动
logo极客观点logo项目管理logoHarmonyOS
javascript
前端
python
node.js
react
vue.js
php
laravel
go
人工智能
mysql
linux
ios
java
android
css
typescript
spring
程序员
logoONES 研发管理logo思否企业问答logo安谋科技 XPU

如何去掉CheckBox一类控件的点击效果？

头像
江南一点雨
    9.2k3921

    不想要点击CheckBox、Switch一类控件的点击效果（onPressed时出现的外围阴影），怎么去掉？

    HarmonyOSharmonyos
    阅读 721
    avatarAI BotBETA

    去掉CheckBox或Switch等控件的点击效果（通常指的是点击时产生的涟漪效果或外围阴影），可以通过自定义控件的样式来实现。这通常涉及到修改控件的背景或者修改控件的点击效果反馈。以下是在Android开发中，基于Material Components库和原生Android Widgets的两种常见方法：

    对于Material Components库（如MaterialCheckBox和MaterialSwitch）

    Material Components库中的控件提供了更丰富的样式定制选项。要禁用点击效果，可以通过修改控件的app:rippleColor属性为透明色，或者直接设置控件的android:clickable为false（但后者会禁用整个控件的点击事件，可能不是你想要的）。

    示例（仅修改涟漪颜色为透明）:

    <com.google.android.material.checkbox.MaterialCheckBox
    android:id="@+id/checkbox"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:rippleColor="@android:color/transparent" />

    对于原生Android Widgets（如CheckBox和Switch）

    对于原生Android Widgets，可能没有一个直接的属性来禁用点击效果。但你可以通过自定义控件的背景来实现这一点。通常，这些控件的点击效果是由它们的背景drawable（尤其是state list drawable）控制的。

    一种方法是：通过XML定义一个没有点击效果的背景drawable，并将其设置为控件的背景。

    示例（创建一个空的drawable作为背景）:

    在你的res/drawable目录下创建一个名为checkbox_no_ripple.xml的drawable资源文件：

    <!-- res/drawable/checkbox_no_ripple.xml -->
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="true" android:drawable="@drawable/checkbox_on" />
    <item android:state_checked="false" android:drawable="@drawable/checkbox_off" />
    <!-- 默认情况下不设置背景，以去除点击效果 -->
    <item android:drawable="@null" />
</selector>

    然后，在你的布局文件中引用这个drawable作为CheckBox的背景：

    <CheckBox
    android:id="@+id/checkbox"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@drawable/checkbox_no_ripple"
    android:button="@null" <!-- 如果需要隐藏默认的checkbox图标，可以使用这个属性 -->
    android:drawableLeft="@drawable/your_custom_checkbox_icon" <!-- 使用自定义图标 -->
    android:drawablePadding="8dp" />

    注意：android:button="@null"会移除默认的checkbox图标，如果你需要自定义图标，可以使用android:drawableLeft等属性配合android:button="@null"来实现。

    注意：上述解决方案可能需要根据你使用的具体控件和Android版本进行调整。

    1 个回答
    得票最新
    头像
    KaKa
      1.2k2224
      ✓ 已被采纳

      如果你想要去除CheckBox、Switch等控件在被按下时出现的外围阴影效果，可以通过设置hoverEffect属性为HoverEffect.None来实现。

      Toggle({ type: ToggleType.Checkbox, isOn: true })
.hoverEffect(HoverEffect.None)
.size({ width: 28, height: 28 })
.selectedColor(0x39a2db)
.onChange((isOn: boolean) => {
  console.info('Component status:' + isOn)
})
      撰写回答
      你尚未登录，登录后可以
      • 和开发者交流问题的细节
      • 关注并接收问题和回答的更新提醒
      • 参与内容的编辑和改进，让解决方法与时俱进
      推荐问题