> For the complete documentation index, see [llms.txt](https://flutteruniversity.gitbook.io/docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://flutteruniversity.gitbook.io/docs/learn-flutter/professional/accessibility-and-localization.md).

# Accessibility and Localization

Accessibility and localization are vital for creating inclusive and globally friendly applications. Here’s a deeper dive into these topics in Flutter.

## 1. Accessibility ♿

Accessibility ensures your app can be used by as many people as possible, including those with disabilities. Flutter has built-in widgets and services to help make your app accessible.

### Semantics:

The `Semantics` widget annotates your widgets with a description used by screen readers.

```dart
Semantics(
  label: 'Tap to increment',
  child: FloatingActionButton(
    onPressed: _incrementCounter,
    tooltip: 'Increment',
    child: Icon(Icons.add),
  ),
);
```

### Testing Accessibility:

You can use the `flutter_semantics_testing` package to test the accessibility of your app.

```bash
flutter pub add flutter_semantics_testing
```

```dart
import 'package:flutter_test/flutter_test.dart';
import 'package:flutter_semantics_testing/flutter_semantics_testing.dart';

void main() {
  testWidgets('Semantics test', (WidgetTester tester) async {
    await tester.pumpWidget(MyApp());

    expect(tester, meetsGuideline(labeledTapTargetGuideline));
  });
}
```

## 2. Localizations 🌐

Localizations allow your app to provide a localized user experience.

### Adding Localizations:

Add the `flutter_localizations` package to your `pubspec.yaml` file.

```yaml
dependencies:
  flutter:
    sdk: flutter
  flutter_localizations:
    sdk: flutter
```

### Implementing Localizations:

Create a class for your app's localizations and use the `Localizations` widget.

```dart
class MyAppLocalizations {
  MyAppLocalizations(this.locale);

  final Locale locale;

  static MyAppLocalizations of(BuildContext context) {
    return Localizations.of<MyAppLocalizations>(context, MyAppLocalizations);
  }

  String get title {
    return Intl.message(
      'Hello World',
      name: 'title',
      locale: locale.toString(),
    );
  }
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      localizationsDelegates: [
        const LocalizationsDelegateOFLC(),
        GlobalMaterialLocalizations.delegate,
        GlobalWidgetsLocalizations.delegate,
      ],
      supportedLocales: [const Locale('en', ''), const Locale('es', '')],
      home: MyHomePage(),
    );
  }
}
```

## Complete Example Code 📜

Let’s look at a simple localized Flutter app:

```dart
import 'package:flutter/material.dart';
import 'package:flutter_localizations/flutter_localizations.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      localizationsDelegates: [
        GlobalMaterialLocalizations.delegate,
        GlobalWidgetsLocalizations.delegate,
      ],
      supportedLocales: [const Locale('en', ''), const Locale('es', '')],
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(MaterialLocalizations.of(context).backButtonTooltip),
      ),
      body: Center(
        child: Text(MaterialLocalizations.of(context).okButtonLabel),
      ),
    );
  }
}
```

In this example:

* We include the necessary localizations delegates and specify the supported locales.
* In `MyHomePage`, we use the `MaterialLocalizations` class to access localized strings.
* This way, the app will display text in the user's preferred language when run.

## Assignments 📝

* [ ] Annotate your widgets with the `Semantics` widget to improve accessibility.
* [ ] Test your app’s accessibility using the `flutter_semantics_testing` package.
* [ ] Implement localizations in your app for at least two languages.