Skip to content

Commit

Permalink
Adds more a11y use cases (#136761)
Browse files Browse the repository at this point in the history
  • Loading branch information
chunhtai authored Oct 20, 2023
1 parent 464e751 commit ffc0423
Show file tree
Hide file tree
Showing 13 changed files with 459 additions and 1 deletion.
16 changes: 15 additions & 1 deletion dev/a11y_assessments/lib/main.dart
Original file line number Diff line number Diff line change
Expand Up @@ -44,9 +44,22 @@ class App extends StatelessWidget {
}
}

class HomePage extends StatelessWidget {
class HomePage extends StatefulWidget {
const HomePage({super.key});

@override
State<HomePage> createState() => HomePageState();
}

class HomePageState extends State<HomePage> {
final ScrollController scrollController = ScrollController();

@override
void dispose() {
scrollController.dispose();
super.dispose();
}

Widget _buildUseCaseItem(int index, UseCase useCase) {
return Padding(
padding: const EdgeInsets.all(10),
Expand All @@ -69,6 +82,7 @@ class HomePage extends StatelessWidget {
appBar: AppBar(title: const Text('Accessibility Assessments')),
body: Center(
child: ListView(
controller: scrollController,
children: List<Widget>.generate(
useCases.length,
(int index) => _buildUseCaseItem(index, useCases[index]),
Expand Down
75 changes: 75 additions & 0 deletions dev/a11y_assessments/lib/use_cases/auto_complete.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,75 @@
// 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 AutoCompleteUseCase extends UseCase {

@override
String get name => 'AutoComplete';

@override
String get route => '/auto-complete';

@override
Widget build(BuildContext context) => const _MainWidget();
}

class _MainWidget extends StatefulWidget {
const _MainWidget();

@override
State<_MainWidget> createState() => _MainWidgetState();
}

class _MainWidgetState extends State<_MainWidget> {
static const List<String> _kOptions = <String>[
'apple',
'banana',
'lemon',
];

static Widget _fieldViewBuilder(BuildContext context, TextEditingController textEditingController, FocusNode focusNode, VoidCallback onFieldSubmitted) {
return TextFormField(
focusNode: focusNode,
autofocus: true,
controller: textEditingController,
onFieldSubmitted: (String value) {
onFieldSubmitted();
},
);
}

@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
backgroundColor: Theme.of(context).colorScheme.inversePrimary,
title: const Text('AutoComplete'),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(
'Type below to autocomplete the following possible results: $_kOptions.'),
Autocomplete<String>(
optionsBuilder: (TextEditingValue textEditingValue) {
if (textEditingValue.text == '') {
return const Iterable<String>.empty();
}
return _kOptions.where((String option) {
return option.contains(textEditingValue.text.toLowerCase());
});
},
fieldViewBuilder: _fieldViewBuilder,
),
],
),
),
);
}
}
49 changes: 49 additions & 0 deletions dev/a11y_assessments/lib/use_cases/badge.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,49 @@
// 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 BadgeUseCase extends UseCase {

@override
String get name => 'Badge';

@override
String get route => '/badge';

@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> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
backgroundColor: Theme.of(context).colorScheme.inversePrimary,
title: const Text('Badge'),
),
body: const Center(
child: Badge(
label: Text(
'5',
semanticsLabel: '5 new messages',
style: TextStyle(color: Colors.white),
),
backgroundColor: Colors.green,
child: Icon(Icons.mail, semanticLabel: 'Messages'),
),
),
);
}
}
74 changes: 74 additions & 0 deletions dev/a11y_assessments/lib/use_cases/material_banner.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,74 @@
// 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 MaterialBannerUseCase extends UseCase {

@override
String get name => 'MaterialBanner';

@override
String get route => '/material_banner';

@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;
ScaffoldFeatureController<MaterialBanner, MaterialBannerClosedReason>? controller;

@override
Widget build(BuildContext context) {
VoidCallback? onPress;
if (controller == null) {
onPress = () {
setState(() {
controller = ScaffoldMessenger.of(context).showMaterialBanner(
MaterialBanner(
padding: const EdgeInsets.all(20),
content: const Text('Hello, I am a Material Banner'),
leading: const Icon(Icons.agriculture_outlined),
backgroundColor: Colors.green,
actions: <Widget>[
TextButton(
onPressed: () {
controller!.close();
setState(() {
controller = null;
});
},
child: const Text('DISMISS'),
),
],
),
);
});
};
}
return Scaffold(
appBar: AppBar(
backgroundColor: Theme.of(context).colorScheme.inversePrimary,
title: const Text('MaterialBanner'),
),
body: Center(
child: ElevatedButton(
autofocus: true,
onPressed: onPress,
child: const Text('Show a MaterialBanner'),
),
),
);
}
}
79 changes: 79 additions & 0 deletions dev/a11y_assessments/lib/use_cases/navigation_bar.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,79 @@
// 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 NavigationBarUseCase extends UseCase {

@override
String get name => 'NavigationBar';

@override
String get route => '/navigation-bar';

@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> {
int currentPageIndex = 0;

@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
backgroundColor: Theme.of(context).colorScheme.inversePrimary,
title: const Text('NavigationBar'),
),
bottomNavigationBar: NavigationBar(
onDestinationSelected: (int index) {
setState(() {
currentPageIndex = index;
});
},
indicatorColor: Colors.amber[800],
selectedIndex: currentPageIndex,
destinations: const <Widget>[
NavigationDestination(
selectedIcon: Icon(Icons.home),
icon: Icon(Icons.home_outlined),
label: 'Home',
),
NavigationDestination(
icon: Icon(Icons.business),
label: 'Business',
),
NavigationDestination(
selectedIcon: Icon(Icons.school),
icon: Icon(Icons.school_outlined),
label: 'School',
),
],
),
body: <Widget>[
Container(
alignment: Alignment.center,
child: const Text('Page 1'),
),
Container(
alignment: Alignment.center,
child: const Text('Page 2'),
),
Container(
alignment: Alignment.center,
child: const Text('Page 3'),
),
][currentPageIndex],
);
}
}
55 changes: 55 additions & 0 deletions dev/a11y_assessments/lib/use_cases/text_button.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,55 @@
// 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 TextButtonUseCase extends UseCase {

@override
String get name => 'TextButton';

@override
String get route => '/text-button';

@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;

@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
backgroundColor: Theme.of(context).colorScheme.inversePrimary,
title: const Text('TextButton'),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
TextButton(
onPressed: () { },
child: const Text('Text button'),
),
const TextButton(
onPressed: null,
child: Text('Text button disabled'),
),
],
),
),
);
}
}
10 changes: 10 additions & 0 deletions dev/a11y_assessments/lib/use_cases/use_cases.dart
Original file line number Diff line number Diff line change
Expand Up @@ -4,10 +4,15 @@

import 'package:flutter/widgets.dart';

import 'auto_complete.dart';
import 'badge.dart';
import 'check_box_list_tile.dart';
import 'date_picker.dart';
import 'dialog.dart';
import 'material_banner.dart';
import 'navigation_bar.dart';
import 'slider.dart';
import 'text_button.dart';
import 'text_field.dart';
import 'text_field_password.dart';

Expand All @@ -24,4 +29,9 @@ final List<UseCase> useCases = <UseCase>[
TextFieldUseCase(),
TextFieldPasswordUseCase(),
DatePickerUseCase(),
AutoCompleteUseCase(),
BadgeUseCase(),
MaterialBannerUseCase(),
NavigationBarUseCase(),
TextButtonUseCase(),
];
Loading

0 comments on commit ffc0423

Please sign in to comment.