Android studio底部导航栏图标部分的圈圈如何去除，很影响美观😭😭

Question

将android studio自带的底部导航栏样例复制到自己的项目中，导入的资源都是一样的，按键功能也正常，但是显示效果和原版的却不一样，图标多了个圈，下面的中文也自动加粗了，求帮帮忙如何去除圈圈和让中文取消加粗😭😭

Answer 1

引自免费微信小程序：皆我百晓生

在Android Studio中，底部导航栏的样式通常是通过BottomNavigationView控件实现，并且图标样式是由app:itemicontint属性控制的。如果你发现图标周围多出了一个圈圈，这很可能是由于默认主题或样式设置了图标的背景或者选中态效果。

要去除这个圈圈并让文字不加粗，你可以按照以下步骤操作：

1. 在你的布局文件（例如activity_main.xml）中找到BottomNavigationView标签，并确保其样式引用了自定义或修改过的主题样式。添加或修改以下属性：

<com.google.android.material.bottomnavigation.BottomNavigationView
    ...
    app:itemIconTint="@drawable/bottom_navigation_item_tint"
    app:itemTextColor="@drawable/bottom_navigation_item_tint"
    app:labelVisibilityMode="labeled"
    ... />

1. 创建一个名为bottom_navigation_item_tint.xml的selector资源文件，在res/color/目录下（如果不存在该目录，请自行创建），内容如下：

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="true" android:color="@android:color/white"/>
    <item android:state_checked="false" android:color="@android:color/darker_gray"/>
</selector>

上述代码将使未选中的图标和文字颜色为深灰色，选中时为白色。你也可以根据需要调整颜色。

1. 如果字体加粗问题是因为使用了Material Design组件库导致的，可以在主题样式中覆盖字体样式。在res/values/styles.xml中添加或修改你的应用主题，包含以下内容：

<style name="AppTheme" parent="Theme.MaterialComponents.Light.DarkActionBar">
    <!-- 其他样式属性 -->
    <item name="bottomNavigationStyle">@style/AppBottomNavigationView</item>
</style>

<style name="AppBottomNavigationView" parent="Widget.MaterialComponents.BottomNavigationView.Colored">
    <item name="materialThemeOverlay">@style/AppBottomNavigationViewThemeOverlay</item>
</style>

<style name="AppBottomNavigationViewThemeOverlay">
    <item name="textAppearanceLabelLarge">@style/AppBottomNavigationViewTextAppearance</item>
</style>

<style name="AppBottomNavigationViewTextAppearance" parent="@style/TextAppearance.MaterialComponents.Body1">
    <item name="fontFamily">@font/your_font</item>
    <item name="android:textSize">14sp</item> <!-- 调整字号大小 -->
    <item name="android:textStyle">normal</item> <!-- 设置字体样式为正常，即非加粗 -->
</style>

请替换@font/your_font为你想要使用的字体文件路径。

经过以上设置后，你应该能看到底部导航栏的图标去除了圈圈，并且文字不再加粗。不过请注意，具体样式可能因Material Design组件库版本的不同而有所差异，你需要根据实际情况进行微调。