Repository navigation
RangeSlider thumb's center doesn't align with division's center, thumb padding, and rounded corners don't work as expected #159586
Copy link
Copy link
Closed
Labels
found in release: 3.27Found to occur in 3.27Found to occur in 3.27frameworkflutter/packages/flutter repository. See also f: labels.flutter/packages/flutter repository. See also f: labels.has reproducible stepsThe issue has been confirmed reproducible and is ready to work onThe issue has been confirmed reproducible and is ready to work onp: material_uimaterial_ui package in flutter/packagesmaterial_ui package in flutter/packagesr: fixedIssue is closed as already fixed in a newer versionIssue is closed as already fixed in a newer versionteam-designOwned by Design Languages teamOwned by Design Languages team
Description
Steps to reproduce
These three issues also exist for RangeSlider widget. This breaks fundamental behaviors such as proper alignment, shape and padding.
Expected results
Thumb's center to align with division's center, proper thumb padding and rounded corners.
Actual results
Code sample
Code sample
import 'package:flutter/material.dart';
void main() => runApp(const MyApp());
class MyApp extends StatefulWidget {
const MyApp({super.key});
@override
State<MyApp> createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
double _discreetSliderValue = 0.6;
RangeValues _discreteRangeSliderValues = const RangeValues(0.2, 0.6);
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
theme: ThemeData(
sliderTheme: const SliderThemeData(
trackHeight: 32,
thumbColor: Colors.green,
activeTrackColor: Colors.deepPurple,
inactiveTrackColor: Colors.amber,
),
),
home: Scaffold(
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
'Discrete Slider',
style: Theme.of(context).textTheme.titleMedium,
),
Slider(
value: _discreetSliderValue,
divisions: 5,
onChanged: (double newValue) {
setState(() {
_discreetSliderValue = newValue;
});
}),
Text(
'Discrete Range Slider',
style: Theme.of(context).textTheme.titleMedium,
),
RangeSlider(
values: _discreteRangeSliderValues,
divisions: 5,
onChanged: (RangeValues newValues) {
setState(() {
_discreteRangeSliderValues = newValues;
});
},
),
],
),
),
),
);
}
}Screenshots or Video
Screenshots / Video demonstration
[Upload media here]
Logs
Logs
[Paste your logs here]Flutter Doctor output
Doctor output
[Paste your output here]Reactions are currently unavailable
Metadata
Metadata
Assignees
Labels
found in release: 3.27Found to occur in 3.27Found to occur in 3.27frameworkflutter/packages/flutter repository. See also f: labels.flutter/packages/flutter repository. See also f: labels.has reproducible stepsThe issue has been confirmed reproducible and is ready to work onThe issue has been confirmed reproducible and is ready to work onp: material_uimaterial_ui package in flutter/packagesmaterial_ui package in flutter/packagesr: fixedIssue is closed as already fixed in a newer versionIssue is closed as already fixed in a newer versionteam-designOwned by Design Languages teamOwned by Design Languages team
Type
Projects
- StatusShow more project fieldsDone (PR merged)
Activity
TahaTesser commentedon Nov 28, 2024
These issues are also a blocker when migrating
RangeSliderto updated M3 design.[-]`RangeSlider` thumb's center doesn't align with division's center and thumb padding + rounded corners don't work as expected[/-][+]`RangeSlider` thumb's center doesn't align with division's center, thumb padding, and rounded corners don't work as expected[/+]Fix `RangeSlider` thumb doesn't align with divisions, thumb padding, …
github-actions commentedon Dec 23, 2024
This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of
flutter doctor -vand a minimal reproduction of the issue.