Updated Material 3 progress indicators
Summary
#The LinearProgressIndicator and CircularProgressIndicator have been updated to match the Material 3 Design specifications.
The LinearProgressIndicatorchanges include a gap between the active and inactive tracks, a stop indicator, and rounded corners. The CircularProgressIndicator changes include a gap between the active and inactive tracks, and rounded stroke cap.
Context
#The Material 3 Design specifications for the LinearProgressIndicator and CircularProgressIndicator were updated in December 2023.
To opt into the 2024 design specifications, set the LinearProgressIndicator.year2023 and CircularProgressIndicator.year2023 flags to false. This is done to ensure that existing apps aren't affected by the updated design spec.
Description of change
#The LinearProgressIndicator and CircularProgressIndicator widgets each have a year2023 flag that can be set to false to opt in to the updated design specification. The default value for the year2023 flag is true, which means that the progress indicators use the 2023 design spec.
When LinearProgressIndicator.year2023 is set to false, the progress indicator have gaps between active and inactive tracks, a stop indicator, and rounded corners. If the LinearProgressIndicator is indeterminate, the stop indicator isn't shown.
When CircularProgressIndicator.year2023 is set to false, the progress indicator has a track gap and rounded stroke cap.
Migration guide
#To opt into the updated design spec for the LinearProgressIndicator, set the year2023 flag to false:
LinearProgressIndicator(
year2023: false,
value: 0.5,
),To opt into the updated design spec for the CircularProgressIndicator, set the year2023 flag to false:
CircularProgressIndicator(
year2023: false,
value: 0.5,
),Timeline
#Landed in version: 3.28.0-0.1.pre
In stable release: Not yet
References
#API documentation:
LinearProgressIndicatorCircularProgressIndicatorLinearProgressIndicator.year2023CircularProgressIndicator.year2023
Relevant issues:
Relevant PRs:
- Update Material 3
LinearProgressIndicatorfor new visual style - Update Material 3
CircularProgressIndicatorfor new visual style
除非另有说明,否则本网站上的文档反映的是 Flutter 的最新稳定版本。页面最后更新于 2025-01-30。 查看源代码 或 报告问题。