Skip to content

Commit 51c6402

Browse files
authored
Slider shows visual label of value on focus (#152960)
Fixed issue to where value indicator label is not shown to user when initially focused. Before: [Screen recording 2024-08-05 12.16.24 PM.webm](https://github.com/user-attachments/assets/806e94d7-7c6c-40e5-93af-dbf2fb9e0dd4) After: https://screencast.googleplex.com/cast/NTY5NzIzMTYxNjIxMjk5MnxkY2IyMGNkYi1iZA Fixes flutter/flutter#113538
1 parent ed40925 commit 51c6402

File tree

2 files changed

+53
-2
lines changed

2 files changed

+53
-2
lines changed

packages/flutter/lib/src/material/slider.dart

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -713,6 +713,7 @@ class _SliderState extends State<Slider> with TickerProviderStateMixin {
713713
if (focused != _focused) {
714714
setState(() { _focused = focused; });
715715
}
716+
showValueIndicator();
716717
}
717718

718719
bool _hovering = false;

packages/flutter/test/material/slider_test.dart

Lines changed: 52 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4484,12 +4484,12 @@ void main() {
44844484
),
44854485
);
44864486

4487-
// Slider does not show value indicator initially.
4487+
// Slider shows value indicator initially on focus.
44884488
await tester.pumpAndSettle();
44894489
RenderBox valueIndicatorBox = tester.renderObject(find.byType(Overlay));
44904490
expect(
44914491
valueIndicatorBox,
4492-
isNot(paints..scale()..path(color: theme.colorScheme.primary)),
4492+
paints..scale()..path(color: theme.colorScheme.primary),
44934493
);
44944494

44954495
// Right arrow (increase)
@@ -4548,4 +4548,54 @@ void main() {
45484548
paints..scale()..path(color: theme.colorScheme.primary),
45494549
);
45504550
}, variant: TargetPlatformVariant.desktop());
4551+
4552+
testWidgets('Value indicator label is shown when focused', (WidgetTester tester) async {
4553+
double value = 0.5;
4554+
final FocusNode focusNode = FocusNode();
4555+
addTearDown(focusNode.dispose);
4556+
4557+
Widget buildApp() {
4558+
return MaterialApp(
4559+
home: Material(
4560+
child: Center(
4561+
child: StatefulBuilder(builder: (BuildContext context, StateSetter setState) {
4562+
return Slider(
4563+
value: value,
4564+
focusNode: focusNode,
4565+
divisions: 5,
4566+
label: value.toStringAsFixed(1),
4567+
onChanged:
4568+
(double newValue) {
4569+
setState(() {
4570+
value = newValue;
4571+
});
4572+
}
4573+
);
4574+
}),
4575+
),
4576+
),
4577+
);
4578+
}
4579+
await tester.pumpWidget(buildApp());
4580+
4581+
// Slider does not show value indicator without focus.
4582+
await tester.pumpAndSettle();
4583+
expect(focusNode.hasFocus, false);
4584+
RenderBox valueIndicatorBox = tester.renderObject(find.byType(Overlay));
4585+
expect(
4586+
valueIndicatorBox,
4587+
isNot(paints..path(color: const Color(0xff000000))..paragraph()),
4588+
);
4589+
4590+
focusNode.requestFocus();
4591+
await tester.pumpAndSettle();
4592+
expect(focusNode.hasFocus, true);
4593+
4594+
// Slider shows value indicator when focused.
4595+
valueIndicatorBox = tester.renderObject(find.byType(Overlay));
4596+
expect(
4597+
valueIndicatorBox,
4598+
paints..path(color: const Color(0xff000000))..paragraph(),
4599+
);
4600+
}, variant: TargetPlatformVariant.desktop());
45514601
}

0 commit comments

Comments
 (0)