更改 Material You 底部导航栏处于活动和非活动状态的图标

Posted 2023-04-13

【中文标题】更改 Material You 底部导航栏处于活动和非活动状态的图标

【英文标题】：Change icons in Material You bottom navigation bar in active and inactive states

【发布时间】：2021-12-29 00:47:07

【问题描述】：

Google 最近发布了适用于 android 的 Material You (M3)。

根据设计指南，如下所述：https://m3.material.io/components/navigation-bar/overview，底部导航栏的图标必须在非活动时被勾勒出来，在活动时被填充（当有合适的轮廓版本的图标时）。

但是，在实施过程中，我看不到任何方法可以使图标在不活动时勾勒并在活动时填充。

我们是否必须上传同一个图标的两个版本，轮廓和填充，我们如何在我们的菜单资源文件中链接这两个图标？

从材料设计文档中可以看出，每个菜单项只定义了一个图标。

即使在非活动状态下，这也会导致填充图标，如下所示。

我们如何根据图标的状态填充和勾勒图标？这必须以编程方式还是通过 XML 完成？

谢谢。

【参考方案1】：

您必须为此制作另一个可绘制对象，您必须添加一个选定的图标和未选择的图标，例如这个

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/icon_selected" 
android:state_checked="true"/>
<item android:drawable="@drawable/icon_non_selected" 
android:state_checked="false"/>
</selector>

然后在这里调用它

android:icon="your drawable name"

【讨论】：

谢谢。我将在我的应用程序上对此进行测试，如果可行，我会接受这个答案