When a widget with a non-transparent background color, such as a `Container` or `ColoredBox` that sets `color`, sits between a `ListTile` and its nearest `Material` ancestor, the framework now reports an error.
- Who is affected
- Applications and packages relying on the previous behaviour or signature. Code that uses Container, ColoredBox, ListTile and related APIs.
- Practical impact
- Behaviour or API differences that can break builds or change runtime behaviour.
- What action should I take?
- Follow the official migration guide below, update affected call sites, run `dart fix --apply` where a fix is available, then run your tests.
Before and after (from the official guide)
| 1 | − | // The colored Container hides the ink splashes from the ListTile. |
| 2 | Material( | |
| 3 | child: Container( | |
| 4 | − | color: Colors.pink, |
| 5 | child: ListTile( | |
| 6 | title: const Text('Title'), | |
| 7 | onTap: () {}, | |
| 8 | ), | |
| 9 | ), | |
| 10 | ) |
| 1 | + | // Use a Material widget directly for the background color. |
| 2 | Material( | |
| 3 | + | color: Colors.pink, |
| 4 | child: Container( | |
| 5 | child: ListTile( | |
| 6 | title: const Text('Title'), | |
| 7 | onTap: () {}, | |
| 8 | ), | |
| 9 | ), | |
| 10 | ) |
Raw before / after
// The colored Container hides the ink splashes from the ListTile.
Material(
child: Container(
color: Colors.pink,
child: ListTile(
title: const Text('Title'),
onTap: () {},
),
),
)// Use a Material widget directly for the background color.
Material(
color: Colors.pink,
child: Container(
child: ListTile(
title: const Text('Title'),
onTap: () {},
),
),
)Official migration guide (excerpt, © The Flutter Authors, CC BY 3.0)
To fix the error,
remove the background color from the intermediate widget or
wrap the ListTile in its own Material widget.
Code before migration:
// The colored Container hides the ink splashes from the ListTile.
Material(
child: Container(
color: Colors.pink,
child: ListTile(
title: const Text('Title'),
onTap: () {},
),
),
)Code after migration:
// Use a Material widget directly for the background color.
Material(
color: Colors.pink,
child: Container(
child: ListTile(
title: const Text('Title'),
onTap: () {},
),
),
)Alternatively,
wrap the ListTile in its own Material widget:
Container(
color: Colors.blue,
child: Material(
type: MaterialType.transparency,
child: ListTile(
title: const Text('Title'),
onTap: () {},
),
),
)AI_PROVIDER (for example to openai-compatible with a local Ollama or LM Studio endpoint) to enable grounded explanations. Everything else on this page works without an AI provider.Listed in the official breaking-changes index (docs.flutter.dev/release/breaking-changes).
An official announcement or migration guide documents an intended behaviour or API change. A verified source change (git diff) shows code changed but does not by itself prove a public API is breaking. AI interpretations are labelled and never used to classify a change.
- Official migration guide
- ListTile.selectedTileColor not visible when parent Container has explicit background color
- Add warning when there is a widget with color between Material and ListTile
- Source commit
- b3045439b7c0
- Source last updated
- Oct 21, 2026
- Last synchronized
- Oct 21, 2026
- Publication status
- published
Publication history
- Oct 21, 2026, 8:31 PM: new → published (ingestion) — Backed by an official breaking-change/migration guide.
AI_PROVIDER (for example to openai-compatible with a local Ollama or LM Studio endpoint) to enable grounded explanations. Everything else on this page works without an AI provider.