Fixed in Stable

The issues below have a fix that has landed in the latest stable hotfix or earlier version of Flutter.

The status of fixes to known issues is typically reviewed when a new stable release lands.

This list is included to show what older versions of Flutter the theming fixes do not apply to. Prefer using the latest stable version of Flutter to benefit from all fixes listed below.

When you theme or style a FilledButton.icon, ElevatedButton.icon, OutlinedButton.icon, TextButton.icon or a SegmentedButton with icons, and give them a foreground color, the text color and the used icon color should both use the specified foreground color. This was the case in all versions prior to Flutter 3.27.0. In Flutter 3.27.0 and 3.29 the styling and theming is broken and the icon color keep default colors.

For more information, see issue #162839. This issue was fixed in PR 162880 and landed in Flutter stable 3.29.

The

ProgressIndicatorThemeData

is missing many key properties from

LinearProgressIndicator

and

CircularProgressIndicator

making it impossible to theme their styles. For more information, see issue

#131690

. This issue was fixed in

PR 158104

and landed in Flutter stable 3.29.

The SegmentedButton sets its

MaterialState

incorrectly for

overlayColor

in its used

ButtonStyleButton

segments. See issue

123308

. Reported as probably fixed by

PR

, which landed in Flutter 3.27.

The style indication of the found and focused/selected item in a

DropdownMenu

does not use

MenuButtonThemeData

. Its simulation of the focused state omits the theme. This makes it impossible to provide a consistent style for the focused/selected item when using a custom theme in a

DropdownMenu

. We have to use the default style for the entire menu, or accept a deviant and out-of-style looking focused/selected item. For more information, see issue

#123736

. This issue was fixed in

PR 153159

and landed in Flutter stable 3.27.

The Material-3 specification gives a height of 40 dp for Segmented buttons and a recommended

TapTargetSize

of 48 dp. This cannot be achieved in Flutter since the

minimumSize

style-property does not affect the widget. The correct minimumSize was actually set as default value in

PR #120095

, but is not honored, see issue

#121493

. This was fixed in

PR

that landed in Flutter stable 3.22, maybe already in 3.19.

When passing in

iconTheme

to

Chip

,

ActionChip

,

ChoiceChip

,

FilterChip

or

InputChip

, it is not applied. See issue

#111828

. Was fixed via

#PR 135751

, that landed in Flutter 3.19.

Based on Material-3 specification menus should use text style

labelLarge

(M3 14 dp) for its menu items. For a

Textfield

part in a dropdown menu, the default for

Textfield

should be used, which is

bodyLarge

(M3 16 dp). The menus currently do not always use these correct Material-3 defaults. For more information, see issue

#131676

, fixed by

PR #131930

.

When using an input decorator theme in

ThemeData

, the form field of the

DropdownButtonFormField

gets the correct themed result, but the shape is not clipped based on used radius of the input decorator for focused and hovered states. For more information, see issue

#131282

, fixed via

PR #131481

.

The

TimePicker

clock-dial uses wrong spec color, and its M3 web spec has a mistake. See issue

#118657

, fixed by

PR #131045

When using a leading icon in a

DropdownMenu

in the entry field, the menu nicely automatically aligns the text in the menu entry field, with the text part in the dropdown menu entries, shown when it is opened. However, if we also add a

leadingIcon

to a

DropdownMenuEntry

, we also get the extra leading space and things do not line up. For more information, see issue

#131350

, fixed by

PR #135004

.

The

Chip

does not conform to Material3 design spec when

useMaterial3

is enabled. See umbrella issue

#115364

for details.

The theme related issues listed in the Chips umbrella issue have been fixed since Flutter 3.13. However, some of the Chips theming limitation issues will need further investigation and still appears to apply when theming Chips. New issue(s) demonstrating remaining theming limitations will need to be created to get them addressed. One of the issues listed issues in the Chip umbrella issue is still open, but considering the main issues in it closed and will track new specific issues via new issues.

The default color of the icon on a selected item in

NavigationDrawer

does not follow Material3 spec. Based on

published spec

the color should in Flutter be

ColorScheme.onSecondaryContainer

. For more information, see issue

#129572

. Fixed via

PR #129625

.

The

SearchAnchor.bar

picks up app InputDecorator theme, and it cannot be removed. For more information, see issue

#126623

. Fixed via

PR #127465

.

DatePicker Divider cannot be removed or styled, it does not fit with a custom header background. For more information, see issue

#126597

. Fixed via

PR #127197

.

Some

Chip

variants in M3 should have state elevations when interacted with, they do not. See issue

#115825

. Fixed via

PR #128049

. Unverified if the fix is 100% correct based on M3 Web spec (like dragged elevations) and all the Chip variants elevations, but it is definitely much better.

No ink splashes on actionable

Chips

when using color on them. See issue

#115824

. The ink effects get covered by color on the used

Material

the button is constructed off. Fixed via

PR #124673

.

When creating a Chip, cannot set different background color for each different material state. Has fix

PR #128584

in

stable 3.13

. It is uncertain if the fix can be used with themes for each Chip variant, it will work well on Chip property level though.

The

AppBar

's foreground theme color, from theme or widget foreground color properties are

not applied

to action icon color for

SliverAppBar.medium

and

SliverAppBar.large

. The defaults for M2 foreground color on a

SliverAppBar.medium

and

SliverAppBar.large

are

incorrect

in

light theme

mode when using

Material-2

. For more information, see issue

#123943

. Fixed via

PR #123293

.

This issue is actually not a Flutter issue. Turns out the text animation of

MenuButton

items when using inverse text color on selected item, compared to unselected items,

can

be removed with a

ButtonStyle

property on

MenuButtonThemeData

. FlexColorScheme version 7.2 added this setting to FIX this issue. In FCS 7.1 and earlier, the issue still exists.

Original issue text was:

A menu selection label is not supposed to animate when it is highlighted, nor does it do so on icons in the menu, only on the text. For more information, see issue

#23615

.

If a

DropdownMenu

is placed in a

ListView

, the menu overlay expands to the width of the layout. This is a minor issue. You can work around it by placing the

DropdownMenu

e.g. in a

Column

in the

ListView

. Interestingly, when opening a menu overlay from a

MenuBar

or the

MenuAnchor

, even when they are placed in a

ListView

, they do not exhibit this behavior. Neither does

DropdownMenu

, if it is in a

Column

. For more information, see issue

#123631

.

Wrong selected plus disabled

InputChip

color used in M3, see issue

#115826

. A fix exists in master, but based on an initial view of the fix, the fix may still suffer from unexpected results when theming Chips. It will need to be further investigated, and a new issue opened if that is the case. Has a

fix

PR #120192

in master, is now in 3.10 stable.

The Material-3 specification depicts

SegmentedButton

unselected button segments, as having transparent color, used to show background color of surface it is placed upon. This is needed for it to work well on elevation-tinted surfaces in Material-3 design. See issue

#123292

, it has a merged fix in beta 3.10 and master via

PR #123293

.

The

SegmentedButton

uses wrong default color for unselected item color, it uses

primary

color, it should be

onSurface

. See issue

# 119733

for more information. FCS7 includes a theme fix for this working already in Flutter 3.7. Has a

fix

PR #120095

in beta 3.10 and master, not yet landed in stable, is in 3.10

If the

NavigationDrawer

shape is modified via

indicatorShape

by widget or theme, from its default M3

StadiumBorder

shape, the indicator correctly gets the new shape, but

InkWell

used by overlay color for focus, hover and pressed state do not use the specified shape. For more information, see issue

#123324

, it has a merged fix in master via

PR #123325

.

The

dividerColor

in the

TabBarThemeData

was never applied to the used divider on the bottom of the

TabBar

that is part of the

M3 spec

. It was used when passed via widget

dividerColor

, but ignored when set via

TabBarThemeData

. There is no report submitted for this issue. The fix was added in master without any reported issue, or at least there is no linked issue. Has a

fix

PR #119690

in beta 3.10 and master, is now in stable 3.10.

ShapeBorder on input decorator

UnderlineInputBorder

has gaps in its equality operator and hashCode in Flutter SDK, it is missing the borderRadius property. See

issue #118282

.

This can be seen in the Themes Playground app where changing the controller value borderRadius on the used UnderlineInputBorder property does not trigger a rebuild of the Theme via Listenable in the AnimatedBuilder, since the value change is not observed because the property is not included in the object equality. Equality remains true, even though one of its property values has changed. Has a fix PR #118284 in master, is now in 3.10 stable.

The background color of the

BottomAppBar

cannot be changed when enabling Material-3 in Flutter. This applies to using its color property, theme, and any other means of trying to change its background color. This is bug in Flutter 3.7. There is a fix

PR #117082

in the master channel. It is from December 16, 2022, but it did not get included in the Flutter 3.7 Jan 25, 2023 release. The issue is also reported in the FlexColorScheme repo here

FCS #115

. Has a

fix

PR #117082

in master, is now in 3.10 stable.

The

BottomAppBar

does not match M3 spec, it incorrectly has a shadow. See issue

#118150

. Has a

fix

PR #121406

in master, is in 3.10.

The

BottomSheet

incorrectly has a shadow in M3 mode. See issue

#118244

. Has a

fix

PR #121406

in master, is in 3.10.

When defining

foregroundColor

for the new Material-3 style

SliverAppBar.large

or

SliverAppBar.medium

either via an

AppBarTheme

or their properties, the defined color is not getting applied to the

AppBar

as it should. See issue

#110951

. Has a

fix

PR #118322

in master, is in 3.10.

If you change the

NavigationBar

from M3 default value of 80 dp, the ink level moves up or down with same amount as the deviation from the default 80 dp height. See issue report and illustration here

FCS #114

as well as in Flutter SDK issue

#117420

. The issue was caused by a regression in Flutter 3.7. It did not exist in Flutter 3.3 and earlier. It is also fixed in the current master channel via

PR 117473

.

The M3

NavigationBar

has a Material-2 styled ink effects also when opting in on Material-3. This is not according to Material design specification. See issues

#113870

and

#114618

for more information. This issue was fixed via

PR #115499

.

The

Themes Playground

version 7, removes the previous extensive

Typography

change crash workaround. The

Typography

changes now also correctly lerp animate when the setting is toggled in the Themes Playground app.

Switching Typography dynamically in Flutter SDK ThemeData was broken for many years, see issue #103864 for more information. If it was done and the error ignored, an app doing so eventually become unstable. A fix PR #110870 solved the issue and is included in Flutter 3.7 stable and later, but it is not available in the Flutter 3.3 stable channel.

Versions 5.0.0 to 6.1.2 of Themes Playground app contained a workaround to avoid issue #103864. The workaround was done by always using the 2021 Typography, and simulating 2018 Typography. This was implemented by using a custom TextTheme that made it look like the 2018 Typography was used when using the Material-2 theme mode. The Playground App actually always stayed in 2021 Typography, but it looked like it switched. Which it accomplished by applying a custom TextTheme to 2021 Typography, that made it look like the 2018 Typography was being used. Other FlexColorScheme example applications, avoided the issue by only using the M3 2021 Typography, and not even mimicking a switch between M2 and M3 Typography.

The above workaround was needed because the Playground app has toggles that switch Typography frequently, without the workaround it eventually crashed. With this workaround, it never switched Typography. It just looked like it did, but the app stayed in 2021 Typography all the time. The by Themes Playground generated ThemeData config use the actual real effective Typography. This was also fine, since an app using the theme would likely never switch used Typography. However, if it does, it will face the same issue as the Playground app did.

Regression:

AppBarTheme

properties

iconTheme

and

actionsIconTheme

are ignored when

useMaterial3

is true. This was not seen in Flutter stable 3.0.5, but is now in 3.3.0. See issue

#107305

, that was fixed via

PR #108332

in master. The fix did not land in Flutter 3.3.0, as mentioned in issue

#110878

it regressed into stable 3.3 release, even though it was fixed in master 28 days before stable 3.3 release.

The

TimePickerDialog

does however not yet have M3 support in Flutter 3.7. However, FCS 7.0 styles it correctly anyway, but the elevation can not be changed from its default value. The elevation property does not exist in Flutter 3.7 theme for

TimePickerDialog

, it does exist in master. The

TimePickerDialog

M3 implementation in master still has some issues, see

118657

, which is probably why it did not land in Flutter 3.7.

In Flutter 3.0 and 3.3, when opting in on useMaterial3:true, the Material widget and other SDK widgets built on it, gets no elevation when only the elevation property is defined. It is required to also define shadowColor and/or surfaceTintColor to get any elevation effect. When using the Material widget itself this is easy to address. However, widgets like Drawer, PopupMenuButton, BottomNavigationBar, NavigationRail, Dialog, AlertDialog, TimePickerDialog, DatePickerDialog, MaterialBanner and BottomSheet do not expose these Material properties and cannot be elevated.

The issue is reported and tracked here #107190 and also mentioned in the FlexColorScheme repo here #54. There are no good workarounds for using elevation on these widgets when useMaterial3 is true. The options are to not use M3. However, if such elevations are important to your app design, one working fix is to wrap those widgets in a theme where useMaterial3 is false, the rest of your app can still use it. This is a rather tedious workaround. Due to this current SDK Material elevation issue when useMaterial3 is true, it is recommended to avoid opting in on Material-3 if correctly elevated Material on Dialogs, Drawers, BottomSheet and PopupMenuButton are critical for the app's design. Dialogs and Drawers use a scrim, so the issue was not so bas when using them, but it was very problematic on e.g. BottomSheet and PopupMenuButton. FlexColorScheme 6.1 release included a theme fix to apply elevation color to the themed backgrounds of these two widgets as a workaround this issue. This workaround has been removed in FlexColorScheme 7 and later as no longer needed in Flutter 3.7.

This PR #110624 addresses the default elevation issue for Material, but it is not yet available in Flutter 3.3. It also does not fully solve the poor dark mode PopupMenuButton style, that needs widget level support for it to work properly.

The

Chip

theme in Flutter 3.3 does not M3 style the plain vanilla

Chip

. A proposal to fix this can be tracked via issue

#109470

. This issue has been fixed in the master channel via

PR #111597

, but it never landed in the 3.3 stable releases.

Due to Flutter SDK

issue #100027

"Using systemNavigationBarDividerColor changes statusBarIconBrightness and systemNavigationBarIconBrightness on Android 11"

, two temporary changes had been made to

FlexColorScheme.themedSystemNavigationBar

implementation:

• The divider feature was disabled (until the issue was solved).
• A temporary workaround implemented for Android 11. It managed to keep system icons from getting the wrong brightness on Android 11 by calling systemChrome twice.

The temporary changes were reverted by FlexColorScheme version 7. Other related issues on the Android System Navigation Bar topic worth tracking is the umbrella issue "System Navigation Bar APIs are Confusing" #112301.

When opting in on Material-3,

TextField

gets wrong

focused

and

hovered

styles in some states. See issue

#113329

for details. The

PR #113776

in the master channel fixes the issue. This issue only occurred in the master channel, because M3 mode support for

TextField

did not exist in the Flutter stable 3.3 channel. This issue never regressed to the stable channel.