Issue
I have a BottomAppBar
with a FAB from the new Material Design.
That BottomAppBar
has a specific menu, which contains 2 items, plus one navigation icon.
The problem is, I've set the bottom app bar color to be white, and the icons are white too. How can I change this?
This is my activity_layout
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.google.android.material.bottomappbar.BottomAppBar
android:id="@+id/bottomAppBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
app:hideOnScroll="true"
style="@style/BottomAppBarTheme"
app:menu="@menu/bottom_app_bar"
app:navigationIcon="@drawable/ic_menu_black_24"
app:fabCradleMargin="10dp" />
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:srcCompat="@drawable/ic_add_white_24"
app:layout_anchor="@id/bottomAppBar"
app:shapeAppearance="@style/FabDiamondOverlay"
/>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
And this is my styles.xml
<style name="AppTheme" parent="Theme.MaterialComponents.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">@color/primaryColor</item>
<item name="colorPrimaryDark">@color/primaryDarkColor</item>
<item name="colorAccent">@color/secondaryColor</item>
<item name="android:actionMenuTextColor">@android:color/black</item>
</style>
<style name="FabDiamondOverlay" parent="">
<item name="cornerFamily">cut</item>
<item name="cornerSize">8dp</item>
</style>
<style name="BottomAppBarTheme" parent="Widget.MaterialComponents.BottomAppBar.Colored">
<item name="android:itemBackground">@android:color/black</item>
</style>
Here is an image of how the bottom app bar is (with the icons, that are white...):
Solution
You can use:
<com.google.android.material.bottomappbar.BottomAppBar
android:theme="@style/BottomAppBarOverlay"
.../>
with:
<style name="BottomAppBarOverlay">
<item name="colorControlNormal">@color/...</item>
</style>
You can also use:
<com.google.android.material.bottomappbar.BottomAppBar
style="@style/MyBottomAppBar"
..>
with:
<style name="MyBottomAppBar" parent="Widget.MaterialComponents.BottomAppBar">
<item name="materialThemeOverlay">@style/ThemeOverlay.BottomAppBar</item>
</style>
<style name="ThemeOverlay.BottomAppBar" parent="ThemeOverlay.MaterialComponents.BottomAppBar.Primary">
<item name="colorOnPrimary">@color/.....</item>
</style>
Answered By - Gabriele Mariotti
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.