flutter/dev/a11y_assessments/lib/use_cases/slider.dart
DBowen33 7d588feacd
Flutter Web App: adds a11y semantic attributes to slider (#151985)
added Semantics wrapper over slider to add appropriate a11y semantic attributes to slider

Before: https://screenshot.googleplex.com/8jmDh3RSB3oG5Z2
After: https://screenshot.googleplex.com/7Z4FdVgwcC4ZQxm

fixes b/340638215
2024-07-25 15:58:24 +00:00

58 lines
1.4 KiB
Dart

// Copyright 2014 The Flutter Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
import 'package:flutter/material.dart';
import 'use_cases.dart';
class SliderUseCase extends UseCase {
@override
String get name => 'Slider';
@override
String get route => '/slider';
@override
Widget build(BuildContext context) => const MainWidget();
}
class MainWidget extends StatefulWidget {
const MainWidget({super.key});
@override
State<MainWidget> createState() => MainWidgetState();
}
class MainWidgetState extends State<MainWidget> {
double currentSliderValue = 20;
static const String accessibilityLabel = 'Accessibility Test Slider';
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
backgroundColor: Theme.of(context).colorScheme.inversePrimary,
title: const Text('Slider'),
),
body: Center(
child: Semantics(
label: accessibilityLabel,
child: Slider(
value: currentSliderValue,
max: 100,
divisions: 5,
label: currentSliderValue.round().toString(),
onChanged: (double value) {
setState(() {
currentSliderValue = value;
});
},
),
),
),
);
}
}