You need to enable JavaScript to run this app.
最新活动
大模型
产品
解决方案
定价
生态与合作
支持与服务
开发者
了解我们

Android Toolbar导航图标点击显示强调色问题求助

问题:Toolbar导航图标点击时出现不必要的强调色闪烁

你在布局中定义了透明背景的Toolbar:

<androidx.appcompat.widget.Toolbar android:id="@+id/business_details_tb" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@color/transparent" android:elevation="0dp" app:navigationIcon="@drawable/ic_arrow_back_w_background" app:title="" app:titleTextColor="@color/white" />

在Activity中引用并设置点击监听:

@BindView(R.id.business_tb) Toolbar acceptTb;
acceptTb.setNavigationOnClickListener(v -> { onBackPressed(); });

但点击导航图标时会短暂显示不必要的强调色(波纹效果),以下是几种实用的解决方法:

解决方案

方法1:快速移除整个Toolbar的点击波纹(最简单)

直接在Toolbar的XML布局中添加android:foreground="@null"属性,就能去掉整个Toolbar区域的点击反馈波纹,包括导航图标:

<androidx.appcompat.widget.Toolbar
    android:id="@+id/business_details_tb"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/transparent"
    android:elevation="0dp"
    android:foreground="@null" <!-- 添加这一行 -->
    app:navigationIcon="@drawable/ic_arrow_back_w_background"
    app:title=""
    app:titleTextColor="@color/white" />

方法2:仅针对导航图标移除波纹效果

如果想保留Toolbar其他区域的点击反馈,只针对导航图标处理,可以自定义一个无状态变化的图标drawable:

  1. res/drawable目录下创建ic_back_no_ripple.xml文件:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- 不管是否点击,都显示同一个图标,没有颜色变化 -->
    <item android:drawable="@drawable/ic_arrow_back_w_background" android:state_pressed="false"/>
    <item android:drawable="@drawable/ic_arrow_back_w_background" android:state_pressed="true"/>
</selector>
  1. 然后在Toolbar布局中替换原有的导航图标引用:
app:navigationIcon="@drawable/ic_back_no_ripple"

方法3:通过代码动态移除导航图标反馈

如果需要在代码中灵活控制,可以找到导航图标对应的View并移除其波纹效果:

// 获取导航图标对应的View
View navigationIconView = acceptTb.getNavigationIcon().getCurrent();
// 移除前景波纹效果
navigationIconView.setForeground(null);
// 也可以移除状态动画,进一步确保无反馈
navigationIconView.setStateListAnimator(null);

内容的提问来源于stack exchange,提问作者Md Istiak Morsalin

火山引擎 最新活动