Skip to main content

l10n

Function l10n 

Source
pub fn l10n(label_key: impl Into<String>) -> L10n
Expand description

Construct localized label with the message key.

§Example

// Simple label:
let simple = l10n("greet");
// With arg (variables):
let user = RwSignal::new("John");
let with_args = l10n("greet").arg("user", move || user.get());
// With fallback label:
let with_fallback = l10n("greet").fallback(|| "Hello user!");

// Full localization example:
let locales = LocaleMap::from_resources([
    ("en-US", include_str!("../../examples/localization/locales/en-US/app.ftl")),
    ("pl-PL", include_str!("../../examples/localization/locales/pl-PL/app.ftl"))
]).unwrap();
let active_language = RwSignal::new(None);
let mut counter = RwSignal::new(0);

let language_selectors = h_stack((
 // Static string slice implement [IntoView].
 "System Default"
    .class(TabSelectorClass)
    .style(move |s| s.apply_if(active_language.get().is_none(), |s| s.set_selected(true)))
    .action(move || active_language.set(None)),
    "pl-PL"
        .class(TabSelectorClass)
        .style(move |s| {
            s.apply_opt(active_language.get(), |s, l| {
                s.apply_if(l == "pl-PL", |s| s.set_selected(true))
            })
        })
        .action(move || active_language.set(Some("pl-PL"))),
    "en-US"
        .class(TabSelectorClass)
        .style(move |s| {
            s.apply_opt(active_language.get(), |s, l| {
                s.apply_if(l == "en-US", |s| s.set_selected(true))
            })
        })
        .action(move || active_language.set(Some("en-US"))),
));

let value_controls = h_stack((
    // Construct localized label
    l10n("inc")
        // Add fllback string
        .fallback(|| "increment")
        // Make it a button
        .button()
        // Add action on click
        .action(move || counter += 1),
    l10n("val")
        // Fallback label will be dependent on a variable value
        .fallback(move || format!("{counter}"))
        // Add variable `counter` as an argument to `val` label
        .arg("counter", move || counter.get()),
    l10n("dec")
        .fallback(|| "decrement")
        .button()
        .action(move || counter -= 1),
));
let view = (language_selectors, value_controls)
        .v_stack()
        .style(move |s| s
            .size_full()
            .items_center()
            .justify_center()
            // Set up locales for the app providing it in the root view styles
            .custom(|ls: L10nCustomStyle| {
                // Add language bundle(s)
                ls.bundle(locales.clone())
                    // Apply language provided from the reactive signal and fallback to
                    // default on `None`
                    .apply_opt(active_language.get(), |ls, locale| {
                        ls.locale(locale.parse::<LanguageIdentifier>().unwrap())
                    })
            })
        );

§Info

Label is not reactive, to make it behave on signal change, use arguments as described in fluent specification.