98 lines
3.4 KiB
Plaintext
98 lines
3.4 KiB
Plaintext
---
|
|
id: adding_localization
|
|
sidebar_position: 2
|
|
title: Adding Localization
|
|
---
|
|
|
|
Adding Localization To UI Widgets
|
|
|
|
### Introduction
|
|
|
|
We have a dedicated package for adding localization to our UI widgets. It's called `stream_chat_localizations` and you can find it [here](https://pub.dev/packages/stream_chat_localizations).
|
|
|
|
### Supported languages
|
|
|
|
At the moment we support the following languages:
|
|
- [English](https://pub.dev/documentation/stream_chat_localizations/latest/stream_chat_localization/StreamChatLocalizationsEn-class.html)
|
|
- [Hindi](https://pub.dev/documentation/stream_chat_localizations/latest/stream_chat_localization/StreamChatLocalizationsHi-class.html)
|
|
- [Italian](https://pub.dev/documentation/stream_chat_localizations/latest/stream_chat_localization/StreamChatLocalizationsIt-class.html)
|
|
- [French](https://pub.dev/documentation/stream_chat_localizations/latest/stream_chat_localization/StreamChatLocalizationsFr-class.html)
|
|
|
|
More languages will be added in the future. Feel free to [contribute](https://github.com/GetStream/stream-chat-flutter/blob/master/CONTRIBUTING.md) to add more languages.
|
|
|
|
### Add dependency
|
|
|
|
Add this to your package's pubspec.yaml file, use the latest version [](https://pub.dartlang.org/packages/stream_chat_localizations)
|
|
```yaml
|
|
dependencies:
|
|
stream_chat_localizations: ^latest_version
|
|
```
|
|
|
|
You should then run `flutter packages get`
|
|
|
|
### Usage
|
|
|
|
```dart
|
|
import 'package:flutter/material.dart';
|
|
import 'package:stream_chat_localizations/stream_chat_localizations.dart';
|
|
|
|
void main() {
|
|
WidgetsFlutterBinding.ensureInitialized();
|
|
runApp(MyApp());
|
|
}
|
|
|
|
class MyApp extends StatelessWidget {
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return MaterialApp(
|
|
// Add all the supported locales
|
|
supportedLocales: const [
|
|
Locale('en'),
|
|
Locale('hi'),
|
|
Locale('fr'),
|
|
Locale('it'),
|
|
],
|
|
// Add GlobalStreamChatLocalizations.delegates
|
|
localizationsDelegates: GlobalStreamChatLocalizations.delegates,
|
|
builder: (context, widget) => StreamChat(
|
|
client: client,
|
|
child: widget,
|
|
),
|
|
home: StreamChannel(
|
|
channel: channel,
|
|
child: const ChannelPage(),
|
|
),
|
|
);
|
|
}
|
|
}
|
|
```
|
|
|
|
### Adding a new language
|
|
|
|
To add a new language, create a new class extending `GlobalStreamChatLocalizations` and create a delegate for it, adding it to the `delegates` array.
|
|
|
|
Checkout [this example](https://github.com/GetStream/stream-chat-flutter/blob/master/packages/stream_chat_localizations/example/lib/add_new_lang.dart) to see how to add a new language.
|
|
|
|
### Override exisiting languages
|
|
|
|
To override an existing language, create a new class extending that particular language class and create a delegate for it, adding it to the `delegates` array.
|
|
|
|
Checkout [this example](https://github.com/GetStream/stream-chat-flutter/blob/master/packages/stream_chat_localizations/example/lib/override_lang.dart) to see how to override an existing language.
|
|
|
|
### ⚠️ Note on **iOS**
|
|
|
|
For translation to work on **iOS** you need to add supported locales to
|
|
`ios/Runner/Info.plist` as described [here](https://flutter.dev/docs/development/accessibility-and-localization/internationalization#specifying-supportedlocales).
|
|
|
|
Example:
|
|
|
|
```xml
|
|
<key>CFBundleLocalizations</key>
|
|
<array>
|
|
<string>en</string>
|
|
<string>nb</string>
|
|
<string>fr</string>
|
|
<string>it</string>
|
|
</array>
|
|
```
|