Skip to main content

Internationalization

If your application is internationalized (or localized), Monarch can render your stories using the locales you have declared in code. To do so, Monarch needs to know about your locales via the MonarchLocalizations annotation.

  1. Add the package:monarch_annotations to your dependencies:
dependencies:
monarch_annotations: ^1.0.0
  1. Annotate a const value or getter of your LocalizationsDelegate using the MonarchLocalizations annotation.
import 'package:monarch_annotations/monarch_annotations.dart';
...

class MyLocalizationsDelegate extends LocalizationsDelegate<MyLocalizations> {...}

@MonarchLocalizations([MonarchLocale('en', 'US'), MonarchLocale('es')])
const myLocalizationsDelegate = MyLocalizationsDelegate();

The MonarchLocalizations annotation takes a list of MonarchLocale items. Declare a MonarchLocale for each locale your application supports.

info

If your project uses the Dart intl tools, then your LocalizationsDelegate is automatically generated by the intl tools. To annotate it, you will have to create a new dart library in your lib directory, then import the generated source file so you can annotate an instance of your LocalizationsDelegate. For an example see this sample project which uses Monarch and the intl package and tools.

  1. Save your changes. The Monarch app will display your locales in the Locale dropdown. When you select a locale, the selected story will render using the selected locale.
Locales in Monarch