BottomNavigationView - 如何更改每个项目的波纹效果的形状

Question

我正在开发一个应用程序，它具有

com.google.android.material.bottomnavigation.BottomNavigationView

每个项目都有一个圆形波纹效果。但我想将波纹的形状更改为方形，并且我想在该波纹上添加边距。我的

XML

文件夹中有一个自定义波纹，但我想知道如何将其设置在

BottomNavigationView

上

这是我的自定义波纹

<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:color="@color/red"
    tools:targetApi="lollipop">
    <item android:id="@android:id/mask">
        <shape android:shape="rectangle">
            <solid android:color="@color/red" />
            <corners android:topLeftRadius="10dp" android:topRightRadius="10dp"
                android:bottomLeftRadius="10dp" android:bottomRightRadius="10dp" />
        </shape>
    </item>
</ripple>

底部导航视图

Answer 1

它对我有用

只需在 XML 底部导航中添加此代码

app:itemBackground="?attr/selectableItemBackground"

祝你好运

Answer 2

对我有用的是创建一个自定义波纹，如下所示：

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="@color/colorLightGray">
    <item android:id="@android:id/mask">
        <shape android:shape="rectangle">
            <solid android:color="@color/colorLightGray" />
            <corners android:radius="25dp" />
        </shape>
    </item>
    <item>
        <shape android:shape="rectangle">
            <solid android:color="@android:color/transparent" />
            <corners android:radius="25dp" />
        </shape>
    </item>
</ripple>

然后在我的

BottomNavigationView

中添加

app:itemBackground="@drawable/ripple_nav_bar"

，请不要直接在背景中设置波纹，因为这不起作用

<com.google.android.material.bottomnavigation.BottomNavigationView
            android:id="@+id/bottomNavigationView"
            style="@style/BottomNavTheme"
            android:layout_width="wrap_content"
            android:layout_height="60dp"
            android:layout_gravity="bottom"
            android:background="@android:color/transparent"
            android:layout_marginEnd="20dp"
            app:itemBackground="@drawable/ripple_nav_bar"
            app:elevation="0dp"
            app:labelVisibilityMode="labeled"
            app:menu="@menu/menu_home_archive" />

我的例子的结果是令人赏心悦目的松鼠形波纹