如果actionBar/Toolbar是白色，菜单项没有水波纹效果

Question

我有一个白色的工具栏，其中菜单项显示为来自材料图标的黑色向量资产。由于涟漪效果也是白色的，因此在单击菜单项时没有涟漪效果。如果将工具栏背景更改为其他颜色，例如蓝色，则会出现涟漪。如何更改菜单项涟漪颜色，以便在白色背景上可见？我尝试在AppTheme中更改colorControlHighlight，但它并没有更改菜单项涟漪颜色。

样式

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">  
    <item name="colorPrimary">#ffffff</item>     
</style>

布局

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>

    </android.support.design.widget.AppBarLayout>

</LinearLayout>

菜单

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <item
        android:id="@+id/menu_action_read_all"
        android:icon="@drawable/ic_done_all_black_24dp"
        android:title="@string/menu_notifications_read_all"
        app:showAsAction="ifRoom" />

</menu>

活动

@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {      
    super.onCreate(savedInstanceState);    
    setSupportActionBar((Toolbar) findViewById(R.id.toolbar));     
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    getMenuInflater().inflate(R.menu.menu_notifications, menu);
    return true;
}

- Aleksander Mielczarek

Answer 1

在你的样式表中：

<style name="MyToolbarTheme" parent="@style/ThemeOverlay.AppCompat.Light">
    <item name="colorControlHighlight">@color/colorAccent</item>
</style>

将此主题应用于您的工具栏：

<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:popupTheme="@style/MyToolbarTheme"/>

结果：

编辑

对于行动项：

<style name="MyAppBarLayoutTheme" parent="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
    <item name="colorControlHighlight">@color/colorAccent</item>
</style>

<android.support.design.widget.AppBarLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:theme="@style/MyAppBarLayoutTheme">

    <android.support.v7.widget.Toolbar/>

</android.support.design.widget.AppBarLayout>

结果：

- azizbekian

---

谢谢您的回答，但对于显示为操作的菜单项无效。我已编辑问题。 - Aleksander Mielczarek

它工作得很好 :) 但现在又出现了另一个问题，如果你不介意的话。我还有一个与菜单项不同颜色的 actionMode。是否可以为 action mode 项指定不同的涟漪颜色？ - Aleksander Mielczarek

我不确定你是否可以动态更改主题。 - azizbekian

我看到了，已经有这样的问题没有答案了。http://stackoverflow.com/questions/29820178/android-having-different-ripple-colors-for-action-bar-and-action-mode-with-app - Aleksander Mielczarek

@AleksanderMielczarek，我会看一下。 - azizbekian

"编辑"这个概念对我的BottomNavigationView起了作用。非常感谢！ - Dmitry Smolyaninov

Answer 2

我也曾因AppTheme遇到类似的问题。我将Theme.MaterialComponents.NoActionBar作为应用程序的默认主题，但仅对于工具栏，涟漪效果无法正常工作。然而，我使用了app:theme解决了这个问题。

请尝试在您的工具栏中添加app:theme="@style/Theme.AppCompat.Light.NoActionBar"。我已经测试过了androidx.appcompat.widget.Toolbar，它对我有效。

<androidx.appcompat.widget.Toolbar
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="@android:color/white"
    app:layout_collapseMode="pin"
    android:elevation="4dp"
    app:theme="@style/Theme.AppCompat.Light.NoActionBar"
    android:stateListAnimator="@animator/appbar_elevation"
    tools:targetApi="lollipop">

如果你的视图默认情况下没有涟漪效果，那么你只需要在你的视图中添加 android:background="?attr/selectableItemBackground" 就可以获得纹波/触摸效果。

<ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:background="?attr/selectableItemBackground"
            android:contentDescription="@null"
            android:src="@mipmap/ic_launcher" />

- Vijay E

Answer 3

路径：drawable/action_item_ripple

action_item_ripple.xml

<?xml version="1.0" encoding="utf-8"?>
<ripple 
   xmlns:android="http://schemas.android.com/apk/res/android"
   android:color="@android:color/white"
   android:radius="20dp">
</ripple>

使用

<com.google.android.material.appbar.AppBarLayout 
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/AppTheme.AppBarOverlay">

<androidx.appcompat.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="?attr/colorPrimary"
    app:popupTheme="@style/AppTheme.PopupOverlay"
    app:titleTextAppearance="@style/TextAppearance.Widget.Event.Toolbar.Title"
    app:titleTextColor="@android:color/white">


    <TextView
        android:id="@+id/textViewTitleToolbar"
        style="@style/TextAppearance.AppCompat.Widget.ActionBar.Title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:text="@string/app_name"
        android:textColor="@android:color/white" />

    <androidx.appcompat.widget.AppCompatImageButton
        android:id="@+id/imageViewToolbar"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="start"
        android:background="@drawable/action_item_ripple"
        android:src="@android:drawable/ic_delete"
        android:visibility="invisible" />
</androidx.appcompat.widget.Toolbar>

- Meysam Keshvari