logo标签列表

底部导航选中项背景颜色更改

javaandroidcolorsbottomnavigationview
4

我想要像Google Play商店一样更改底部导航栏中所选项目的背景颜色。我尝试解决它，但到目前为止我还没有找到解决方案。

google_play_bottomnavigation

更新
我发现了一个名为app:itemActiveIndicatorStyle的属性，它应该可以改变指示器的颜色。但出于某种原因它不起作用。这里有一张图片展示了这个属性应该如何工作。 bottomnavigation diagram
这个回答解决了你的问题吗？如何在Android底部导航中更改特定项目的背景颜色？ - Hamed Goharshad
我的问题是如何删除所选项目的背景（https://ibb.co/MfLMG98），而你的问题解决了我的问题。哈哈。我添加了app:itemActiveIndicatorStyle="@color/black"。 - undefined
7个回答
2

我成功地使用下面的样式改变了颜色：

<style name="Widget.BottomNavigationView.ActiveIndicator" parent="Widget.Material3.BottomNavigationView.ActiveIndicator">
    <item name="shapeAppearance">
        @style/ShapeAppearance.M3.Comp.NavigationBar.ActiveIndicator.Shape
    </item>
    <item name="android:color">@color/white</item>
</style>

在BottomNavigationView中：

<com.google.android.material.bottomnavigation.BottomNavigationView
    android:id="@+id/bottom_navigation"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    style="@style/Widget.App.BottomNavigationView"
    app:labelVisibilityMode="labeled" />
2

尝试下面的属性。它对我有用。

        app:itemActiveIndicatorStyle="@android:color/transparent"
1
这可以去除它/使它透明。但不能用来应用不同的颜色。 - undefined
1
如果您的项目使用 style.xml 文件来主题化项目，请将以下代码添加到该文件中。请注意，您的应用程序主题必须从 MaterialComponents 主题继承，以使着色功能正常工作。
<style name="Theme.App" parent="Theme.MaterialComponents.*">
    ...
    <item name="bottomNavigationStyle">@style/Widget.MaterialComponents.BottomNavigationView.Colored</item>
    <item name="colorPrimary">COLOR_FOR_ICONS_AND_SURFACES</item>
    <item name="colorOnPrimary">COLOR_FOR_ON_ICONS_OR_ON_SURFACES</item>
</style>

这将在整个系统范围内更改颜色。如果您只想将其应用于特定组件，则必须在style.xml中将颜色属性定义为覆盖。

<style name="Theme.App" parent="Theme.MaterialComponents.*">
    ...
    <item name="bottomNavigationStyle">@style/Widget.App.BottomNavigationView</item>
</style>

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

<style name="ThemeOverlay.App.BottomNavigationView" parent="">
    <item name="colorPrimary">COLOR_FOR_ICONS_AND_SURFACES</item>
    <item name="colorOnPrimary">COLOR_FOR_ON_ICONS_OR_ON_SURFACES</item>
</style>

Theme.App中定义的bottomNavigationStyle将默认为所有底部导航视图着色。如果您不想要这个效果，那么可以通过定义其style属性将样式应用于特定的BottomNavigationView。这将覆盖在应用程序主题中定义的默认样式。

<com.google.android.material.bottomnavigation.BottomNavigationView
    ...
    style="@style/Widget.App.BottomNavigationView"
/>
这个对我不起作用。 - IamNotMe_
如果你没有正确实现它，显然它是不会工作的。请分享展示你如何在代码中实现它的代码。 - Kozmotronik
1
尝试一下
步骤1：为您的活动指示器定义一个样式
<style name="Theme.BottomNavigationView.ActiveIndicator" parent="Widget.Material3.BottomNavigationView.ActiveIndicator">
    <item name="android:color">@color/white</item>
</style>

第二步：在您的BottomNavigationView中使用该样式（Theme.BottomNavigationView.ActiveIndicator）。
        <com.google.android.material.bottomnavigation.BottomNavigationView
            android:id="@+id/bottomNavigationView"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:backgroundTint="@color/primary"
            app:labelVisibilityMode="selected"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:itemTextColor="@color/testing_color"
            app:itemActiveIndicatorStyle="@style/Theme.BottomNavigationView.ActiveIndicator"
            app:menu="@menu/bottom_navigation" />
这个真的有效！谢谢你。 - undefined
0

类似这样的代码应该可以运行：

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@color/blue" android:state_checked="true"/>
    <item android:drawable="@color/gray"/>
</selector>
这个方法不起作用，也与我所需的无关。 - IamNotMe_
0

我已经默认使用这种样式：

api "com.google.android.material:material:1.6.1"

并使用样式：<style name="AppTheme" parent="Theme.Material3.Light.NoActionBar">

0

试试这个：

<style name="Base.Theme.Challenge" parent="Theme.Material3.DayNight.NoActionBar">
    <item name="colorPrimary">#F7C500</item>
    <item name="colorSecondaryContainer">#FFFFED</item>   <--- This is the color
</style>

欲了解更多信息，请访问此页面

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接