Skip to content

BottomNavigationBar uses the wrong theme #19653

@nathansamson

Description

@nathansamson

I am trying to build an aplication that changes its theme on runtime. When changing the theme, new BottomNavigationBars follow the wrong color until next state change.

Steps to Reproduce

https://gist.github.com/nathansamson/ac5a11e8a4d8e6d4d8b19610a267c931

  1. Run the application
  2. Click on the button
    The button changes themes, but also changes pages
  3. The bottom bar should be yellow (the new theme) but is blue (the old theme)

In code speak

  1. Change the theme of the MaterialApp
  2. Create and Navigate to a new page with a BottomNavigationBar
  3. Observe that the BottomNavigationBar is still the old theme color
  4. The BottomNavigationBar changes color when updating its state

Also observe the build() of the encolosing widget that builds the BottomNavigationBar is being run multple times (see logs).

Note: when I switch to fixed layout (instead of shifting) the correct background colors are observed immediately.

Logs

(Full logs in the gist)

[ +154 ms] I/flutter ( 2836): THEME CHANGE
[   +1 ms] I/flutter ( 2836): CHANGED THEME
[  +26 ms] I/flutter ( 2836): NEW APP
[  +58 ms] I/flutter ( 2836): MaterialColor(primary value: Color(0xff2196f3))
[ +114 ms] I/flutter ( 2836): Color(0xfffeea3b)
[  +56 ms] I/flutter ( 2836): MaterialColor(primary value: Color(0xffffeb3b))
[PERSONAL ANNOTATION]: after this log the BottomNavigationBar should clearly be yellow (see last color), but isn't
[+5835 ms] I/flutter ( 2836): MaterialColor(primary value: Color(0xffffeb3b))
[nathan@linux bottom_navigation_bar_theme]$ flutter analyze
Analyzing bottom_navigation_bar_theme...                         
No issues found! (ran in 1.0s)
[nathan@linux bottom_navigation_bar_theme]$ 

[✓] Flutter (Channel beta, v0.5.1, on Linux, locale en_US.UTF-8)
    • Flutter version 0.5.1 at /home/nathan/flutter
    • Framework revision c7ea3ca377 (8 weeks ago), 2018-05-29 21:07:33 +0200
    • Engine revision 1ed25ca7b7
    • Dart version 2.0.0-dev.58.0.flutter-f981f09760

[✓] Android toolchain - develop for Android devices (Android SDK 27.0.3)
    • Android SDK at /home/nathan/Android/Sdk
    • Android NDK location not configured (optional; useful for native profiling support)
    • Platform android-27, build-tools 27.0.3
    • Java binary at: /home/nathan/android-studio/jre/bin/java
    • Java version OpenJDK Runtime Environment (build 1.8.0_152-release-1024-b01)
    • All Android licenses accepted.

[✓] Android Studio (version 3.1)
    • Android Studio at /home/nathan/android-studio
    • Flutter plugin version 25.0.1
    • Dart plugin version 173.4700
    • Java version OpenJDK Runtime Environment (build 1.8.0_152-release-1024-b01)

[✓] Connected devices (1 available)
    • Google • 192.168.56.101:5555 • android-x86 • Android 8.0.0 (API 26)

• No issues found!

Metadata

Metadata

Assignees

No one assigned

    Labels

    d: api docsIssues with https://api.flutter.dev/f: material designflutter/packages/flutter/material repository.frameworkflutter/packages/flutter repository. See also f: labels.

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions