How to add a gradient in the navigationBar of the device in Android?

Question

I have a Flutter app and I'm trying to add a gradient in the NaviagtionBottomBar of the app.
I've managed to add a singular color but I cant understand how to add a gradient.

This is my code and this is what the output

styles.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="LaunchTheme" parent="@android:style/Theme.Black.NoTitleBar">
        <item name="android:windowBackground">@drawable/launch_background</item>
        <item name="android:windowFullscreen">true</item>
    </style>
    <style name="NormalTheme" parent="@android:style/Theme.Black.NoTitleBar">
    <item name="android:windowDrawsSystemBarBackgrounds">true</item>
    <item name="android:navigationBarColor">@color/blue</item>
    <item name="android:windowLightNavigationBar">true</item>
    </style>
</resources>

colors.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="blue">#87ceeb</color>
</resources>

Output:

Does this help? https://stackoverflow.com/a/41001947/8257908 — Joy Terence, Nov 14 '20 at 09:27

score 0 · Answer 1 · answered Nov 14 '20 at 08:22

0

In your dart code you can wrap BottomNavigationBar widget with Container and set BoxDecoration for decoration property of Container. then set gradient for BoxDecoration.

answered Nov 14 '20 at 08:22

Ali Mohammadzadeh

626
2
4
9

So this isn’t the bottomNav bar. It’s the Navigation Bar of the device. – Simran Aswani Nov 14 '20 at 08:23
Sorry. Now I understand what you say – Ali Mohammadzadeh Nov 14 '20 at 08:27

How to add a gradient in the navigationBar of the device in Android?

1 Answers1