Updated to Flutter 3.22 and no color is shown in cards and navbars background

Question

I just updated two of my apps to Flutter 3.22, and the colors of cards and bottom navigation bars have disappeared. Now the background color is transparent on these elements. Any solutions on how to fix it?

As I saw in the release notes, they made changes to theming, but nothing should have impacted it.

• Cards with transparent backgrounds
• Navbar with transparent backgrounds
• Cards with transparent backgrounds

I tried updating the theme with the new material theme builder but nothing have changed.

Here is a example code of the widgets:

@override
  Widget build(BuildContext context) {
    return Card(
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.circular(12),
      ),
      child: InkWell(
        onTap: () {
          // [...]
        },
        borderRadius: BorderRadius.circular(12),
        child: Padding(
            padding: const EdgeInsets.all(18.0),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                // List of widgets like ListTiles, rows of text, etc
              ],
            )),
      ),
    );
  }

This is one of the cards, but the problem is across all widgets that envolves Theme.of(context).colorScheme.surfaceTint. I think is some bug with the update.

Answer 1

I figured out the problem! The theme was provided by the official Material Theme Builder website, and appears that the builder is missing some parameters

In the generated file the parameter surfaceContainerLow and others aren't declared in the toColorScrheme() function, inside the MaterialTheme class.

I added these parameters to the builder function myself and now everything is working!