Git Product home page Git Product logo

i18next's Introduction

i18next

build codecov

This is an adaptation of i18next standard for Dart with support for Flutter localization techniques. This package is still a work in progress. Mind that this is still a pre-1.0.0 so breaking changes may occur frequently.

  • Support for variables
  • Support for namespaces
  • Support for context
  • Support for simple plural forms (one or plural)
  • Support for multiple plural forms (one, few, many, plural, ...)
  • Plural and context fallbacks
  • Locale and namespace fallbacks
  • Get string or object tree
  • Support for nesting
  • Flutter's LocalizationsDelegate support
  • Asset bundle localizations data source (retrieves from pubspec.yaml). See the example for more details.
  • Sprintf support
  • Resource caching
  • Retrieve resource files from server
  • Custom post-processing

Usage

Simply declare the package in your pubspec.yaml

dependencies:
  i18next: ^0.5.0

To use it with flutter's LocalizationsDelegate you first create I18NextLocalizationDelegate and register it in your WidgetsApp (MaterialApp or CupertinoApp).

I18NextLocalizationDelegate(
  locales: widget.locales,
  // this data source is from where the delegate will retrieve the localizations from (namespaces Map)
  dataSource: ...,
  // optional extra options can be added here
  options: I18NextOptions(...),
),

Then to access and use it, simply call

Widget build(BuildContext context) {
  // It finds the i18next instance on the widgets tree via `Localizations.of`
  I18Next.of(context).t(...);
  ...
}

But if you want to handle it yourself, then simply instantiate it:

I18Next(
  locale,
  // This store is from where i18next will attempt to retrieve the localizations from.
  resourceStore: ...,
  // Optional extra options can be added here
  options: I18NextOptions(...)
);

Syntax

For the simple and straightforward usages:

{
  "key": "Hello World!",
  "nested": {
    "key": "My nested key"
  }
}
i18next.t('key'); // 'Hello World!'
i18next.t('nested.key'); // 'My nested key'

// unmapped keys usually return themselves (when graceful fallback fails)
i18next.t('unspecifiedKey'); // 'unspecifiedKey'
{
  "key": "Hello {{name}}!",
  "grouped_key": "Hello {{grouped.name}}"
}
i18next.t('key', arguments: {'name': 'World'}); // 'Hello World!'
i18next.t('grouped_key', arguments: {'grouped': {'name': 'Grouped World'}}); // 'Hello Grouped World!'
{
  "nesting1": "1 $t(nesting2)",
  "nesting2": "2 $t(nesting3)",
  "nesting3": "3"
}
i18next.t('nesting1'); // "1 2 3"
{
  "key": "item",
  "key_plural": "items",
  "keyWithCount": "{{count}} item",
  "keyWithCount_plural": "{{count}} items"
}
i18next.t('key', count: 0); // 'items'
i18next.t('key', count: 1); // 'item'
i18next.t('key', count: 5); // 'items'
i18next.t('keyWithCount', count: 0); // '0 items'
i18next.t('keyWithCount', count: 1); // '1 item'
i18next.t('keyWithCount', count: 5); // '5 items'

There are also ways of dealing with locales with multiple plural: zero, one, few, many, others (key identifier) (Unsupported)

  • Contexts like gender, are marked via underscores
{
    "genderMessage": "They",
    "genderMessage_male": "Him",
    "genderMessage_female": "Her"
}
i18next.t('genderMessage'); // 'They'
i18next.t('genderMessage', context: 'male'); // 'Him'
i18next.t('genderMessage', context: 'female'); // 'Her'

And can be used with plurals

{
  "friend": "A friend",
  "friend_plural": "{{count}} friends",
  "friend_male": "A boyfriend",
  "friend_female": "A girlfriend",
  "friend_male_plural": "{{count}} boyfriends",
  "friend_female_plural": "{{count}} girlfriends"
}
i18next.t('friend'); // 'A friend'
i18next.t('friend', count: 1); // 'A friend'
i18next.t('friend', count: 100); // '100 friends'

i18next.t('friend', context: 'male', count: 1); // 'A boyfriend'
i18next.t('friend', context: 'female', count: 1); // 'A girlfriend'
i18next.t('friend', context: 'male', count: 100); // '100 boyfriends'
i18next.t('friend', context: 'female', count: 100); // '100 girlfriends'
{
  "key1": "{{text, uppercase}} just uppercased",
  "key2": "The current date is {{now, datetime(format:dd/MM/yyyy)}}",
  "key3": "Right now we are in {{now, datetime(format:MMM), uppercase}}."
}
i18next.t('key1', arguments: { 'text': 'my text' }); // 'MY TEXT just uppercased'
i18next.t('key2', arguments: { 'now': DateTime.now() }); // 'The current date is 21/01/2020'
i18next.t('key3', arguments: { 'now': DateTime.now() }); // 'Right now we are in JAN.'

There are other usages and possibilities as well, this is just an example of what is defined by this format.

  • Namespaces: A namespace can be thought of as logical groupings of different sets of translations. In a given namespace you could have a set of languages, each with their own set of keys. They can also be understood as separate files. For example:

    • common.json: Things that are reused everywhere, eg. Button labels 'save', 'cancel'
    • validation.json: All validation texts
    • glossary.json: Words we want to be reused consistently inside texts
// common.json
{
  "myKey": "This key is in common"
}

// feature.json
{
  "myKey": "This key is in my feature"
}
i18next.t('common:myKey'); // 'This key is in common'
i18next.t('feature:myKey'); // 'This key is in my feature'
  • Context/plural fallback mechanism:
{
  "friend": "A friend",
  "friend_female": "A girlfriend"
}
i18next.t('friend'); // 'A friend'

i18next.t('friend', count: 1); // 'A friend'
// It fallbacks to `friend` since `friend_plural` is not present
i18next.t('friend', count: 2); // 'A friend'

i18next.t('friend', context: 'female'); // 'A girlfriend'
// It fallbacks to `friend` since `friend_male` is not present
i18next.t('friend', context: 'male'); // 'A friend'

There is a way to also set the default namespace or a order of namespaces so a key knows where to start looking for the translation.

i18next's People

Contributors

ahmadre avatar jonasbeyer avatar luluferraco avatar lynn avatar miguelslemos avatar rebarah avatar wferem1 avatar williamhjcho avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.