mirror of
https://github.com/flutter/flutter.git
synced 2026-02-13 06:13:10 +08:00
559c314ba3
Fixes [Update `RangeSlider` for Material 3 redesign](https://github.com/flutter/flutter/issues/162505) ### Description This PR updates `RangeSlider` with `year2023` flag which can be used to opt into the 2024 `RangeSlider design appearance. ### Code Sample <details> <summary>expand to view the code sample</summary> ```dart import 'package:flutter/material.dart'; void main() => runApp(const RangeSliderExampleApp()); class RangeSliderExampleApp extends StatelessWidget { const RangeSliderExampleApp({super.key}); @override Widget build(BuildContext context) { return MaterialApp( theme: ThemeData( sliderTheme: const SliderThemeData( showValueIndicator: ShowValueIndicator.always, ), ), home: Scaffold( appBar: AppBar(title: const Text('RangeSlider Sample')), body: const RangeSliderExample(), ), ); } } class RangeSliderExample extends StatefulWidget { const RangeSliderExample({super.key}); @override State<RangeSliderExample> createState() => _RangeSliderExampleState(); } class _RangeSliderExampleState extends State<RangeSliderExample> { RangeValues _currentRange1Values = const RangeValues(20.0, 60.0); RangeValues _currentRange2Values = const RangeValues(30.0, 80.0); @override Widget build(BuildContext context) { return Column( spacing: 20.0, mainAxisAlignment: MainAxisAlignment.center, children: <Widget>[ RangeSlider( year2023: false, values: _currentRange1Values, max: 100, onChanged: (RangeValues values) { setState(() { _currentRange1Values = values; }); }, ), RangeSlider( year2023: false, values: _currentRange2Values, max: 100, divisions: 10, labels: RangeLabels( _currentRange2Values.start.round().toString(), _currentRange2Values.end.round().toString(), ), onChanged: (RangeValues values) { setState(() { _currentRange2Values = values; }); }, ), ], ); } } ``` </details> | Preview 1 | Preview 2 | | --------------- | --------------- | | <img src="https://github.com/user-attachments/assets/e14a1b04-4e32-4b37-b2f5-2d2001f53114"/> | <img src="https://github.com/user-attachments/assets/aad36529-d576-4ec7-b2e5-49c9387456be"/> | # Custom track gap and thumb size <img width="343" alt="Screenshot 2025-02-20 at 15 26 09" src="https://github.com/user-attachments/assets/06c09679-1df8-4380-b3e6-c4add8f0cc42" /> <img width="338" alt="Screenshot 2025-02-20 at 15 27 19" src="https://github.com/user-attachments/assets/6226c515-f96b-412a-b59e-cafd2fba0515" /> ## Pre-launch Checklist - [x] I read the [Contributor Guide] and followed the process outlined there for submitting PRs. - [x] I read the [Tree Hygiene] wiki page, which explains my responsibilities. - [x] I read and followed the [Flutter Style Guide], including [Features we expect every widget to implement]. - [x] I signed the [CLA]. - [x] I listed at least one issue that this PR fixes in the description above. - [x] I updated/added relevant documentation (doc comments with `///`). - [x] I added new tests to check the change I am making, or this PR is [test-exempt]. - [ ] I followed the [breaking change policy] and added [Data Driven Fixes] where supported. - [x] All existing and new tests are passing. If you need help, consider asking for advice on the #hackers-new channel on [Discord]. <!-- Links --> [Contributor Guide]: https://github.com/flutter/flutter/blob/main/docs/contributing/Tree-hygiene.md#overview [Tree Hygiene]: https://github.com/flutter/flutter/blob/main/docs/contributing/Tree-hygiene.md [test-exempt]: https://github.com/flutter/flutter/blob/main/docs/contributing/Tree-hygiene.md#tests [Flutter Style Guide]: https://github.com/flutter/flutter/blob/main/docs/contributing/Style-guide-for-Flutter-repo.md [Features we expect every widget to implement]: https://github.com/flutter/flutter/blob/main/docs/contributing/Style-guide-for-Flutter-repo.md#features-we-expect-every-widget-to-implement [CLA]: https://cla.developers.google.com/ [flutter/tests]: https://github.com/flutter/tests [breaking change policy]: https://github.com/flutter/flutter/blob/main/docs/contributing/Tree-hygiene.md#handling-breaking-changes [Discord]: https://github.com/flutter/flutter/blob/main/docs/contributing/Chat.md [Data Driven Fixes]: https://github.com/flutter/flutter/blob/main/docs/contributing/Data-driven-Fixes.md
Token Defaults Generator
Script that generates component theme data defaults based on token data.
Usage
Run this program from the root of the git repository:
dart dev/tools/gen_defaults/bin/gen_defaults.dart [-v]
This updates generated/used_tokens.csv and the various component theme files.
Templates
There is a template file for every component that needs defaults from
the token database. These templates are implemented as subclasses of
TokenTemplate. This base class provides some utilities and a structure
for adding a new block of generated code to the bottom of a given file.
Templates need to override the generate method to provide the generated
code block as a string.
See lib/fab_template.dart for an example that generates defaults for the
Floating Action Button.
Tokens
Tokens are stored in JSON files in data/, and are sourced from
an internal Google database.
template.dart should provide nearly all useful token resolvers
(e.g. color, shape, etc.). For special cases in which one shouldn't
be defined, use getToken to get the raw token value. The script, through
the various revolvers and getToken, validates tokens, keeps track of
which tokens are used, and generates generated/used_tokens.csv.