Mobiilikehitys Flutterilla · Oppitunti

ARB-tiedostot ja gen_l10n-paikallistamisen työnkulku

Määritä flutter_localizations- ja gen_l10n-putki tyypitettyjen käännösten tuottamista varten.

Oppitunti 1/413 vaihetta

ARB-tiedostot ja gen_l10n-paikallistamisen työnkulku on ilmainen Mobiilikehitys Flutterilla-oppitunti CoddyKitissä. Tämä on oppitunti 1/4. Voit lukea tästä oppimispolusta kokonaan mitkä tahansa 3 oppituntia ilmaiseksi — sen jälkeen CoddyKit PRO avaa kaikki oppitunnit sekä käytännön harjoittelun sisäänrakennetulla koodieditorilla ja ympäri vuorokauden toimivalla tekoälytuutorilla. Oppitunti kuuluu Mobiilikehitys Flutterilla-oppimispolkuun, ja edistymisesi synkronoituu verkon ja CoddyKit-sovelluksen välillä. Mobiilikehitys Flutterilla-kurssilla on yhteensä 4 oppituntia.

Vaihe 1: Miksi gen_l10n ja riippuvuudet

Merkkijonojen, kuten Text('Welcome'), kovakoodaus tekee sovelluksen kääntämisestä mahdotonta. Flutterin virallinen ratkaisu on gen_l10n: kirjoitat käännökset ARB-tiedostoihin (Application Resource Bundle, JSON-muoto), ja rakennustyökalu luo tyypitetyn Dart-luokan, jolloin kirjoitusvirheistä tulee käännösaikaisia virheitä.

Tiedostossa pubspec.yaml tarvitaan kaksi asiaa. flutter_localizations-SDK-paketti tarjoaa Material-, Cupertino- ja Widgets-käännökset, ja lippu generate: true ottaa gen_l10n-rakennusvaiheen käyttöön.

intl otetaan mukaan, koska luotu koodi käyttää sitä monikkoihin ja päivämääriin.
Suorittakaa muokkaamisen jälkeen flutter pub get.

dependencies:
  flutter:
    sdk: flutter
  flutter_localizations:
    sdk: flutter
  intl: any

flutter:
  generate: true

Vaihe 2: l10n.yaml-määritykset

Luo projektin juureen l10n.yaml-tiedosto. Se kertoo gen_l10nille, missä ARB-tiedostot sijaitsevat ja minkä nimen luodulle luokalle annetaan.

arb-dir — .arb-tiedostot sisältävä kansio.
template-arb-file — lähdekäyttöliittymä, joka määrittää avaimet ja metatiedot.
output-localization-file — luotavan Dart-tiedoston nimi.
output-class — luokan nimi, jonka tuot koodissa.

# l10n.yaml
arb-dir: lib/l10n
template-arb-file: app_en.arb
output-localization-file: app_localizations.dart
output-class: AppLocalizations

Vaihe 3: Malli-ARB-tiedosto

Mallikäyttöliittymä (tässä app_en.arb) määrittää kaikki avaimet. Jokainen avain yhdistyy käännettyyn arvoon. @-merkillä alkavat avaimet ovat metatietoja: ne kuvailevat merkintää, mutta eivät tuota merkkijonoa.

@@locale ilmoittaa, mitä käyttöliittymää tiedosto edustaa.
@welcome voi sisältää description-kuvauksen kääntäjien avuksi.

Tiedostonimen malli on app_<localeCode>.arb.

{
  "@@locale": "en",
  "welcome": "Welcome",
  "@welcome": {
    "description": "Greeting shown on the home screen"
  },
  "settings": "Settings"
}

Vaihe 4: Käännetty ARB-tiedosto

Lisää jokaista muuta kieltä varten sisartiedosto, jossa on samat avaimet mutta käännetyt arvot. Metatiedot (@-avaimet) vaaditaan vain mallissa, joten käännöstiedostoista ne voi jättää pois.

Tässä app_tr.arb tarjoaa turkinkieliset merkkijonot.
Puuttuvat avaimet käyttävät mallikäyttöliittymää, joten pidä malli täydellisenä.

{
  "@@locale": "tr",
  "welcome": "Hoş geldiniz",
  "settings": "Ayarlar"
}

Vaihe 5: Luo koodi

Koodin luonti suoritetaan automaattisesti komennon flutter run tai flutter build aikana, kun generate: true on asetettu. Voit käynnistää sen myös erikseen komennolla flutter gen-l10n.

Tulostiedostot sijoitetaan oletusarvoisesti kansioon .dart_tool/flutter_gen/gen_l10n/.
Luotu AppLocalizations-luokka tarjoaa yhden getterin kutakin avainta kohti.
Lisää luotu polku IDE:n tuontiehdotuksiin; älä vie luotuja tiedostoja versionhallintaan.

Vaihe 6: Liitä MaterialAppiin

Rekisteröi luodut delegaatit ja tuetut käyttöliittymät MaterialApp-widgetille. AppLocalizations.localizationsDelegates sisältää oman delegaattisi sekä Material-, Widgets- ja Cupertino-delegaatit, ja supportedLocales luettelee toimitettavat käyttöliittymät.

Flutter valitsee parhaiten vastaavan vaihtoehdon laitteen käyttöliittymän ja supportedLocales-luettelon välillä.
Jos vastaavaa vaihtoehtoa ei ole, käytetään supportedLocales-luettelon ensimmäistä alkiota.

import 'package:flutter/material.dart';
import 'package:flutter_gen/gen_l10n/app_localizations.dart';

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      localizationsDelegates: AppLocalizations.localizationsDelegates,
      supportedLocales: AppLocalizations.supportedLocales,
      home: const HomeScreen(),
    );
  }
}

Vaihe 7: Lue merkkijono

Widgetin sisällä haet lokalisoidun instanssin komennolla AppLocalizations.of(context) ja luet getterin arvon. Kutsu palauttaa arvon null vain, jos delegaatit puuttuvat, joten tavallisessa käytössä käytetään !-operaattoria.

Jokaisesta ARB-tiedoston avaimesta tulee vahvasti tyypitetty getter.
Kun nimeät avaimen uudelleen ARB-tiedostossa, jokainen virheellinen käyttö aiheuttaa käännösvirheen.

import 'package:flutter/material.dart';
import 'package:flutter_gen/gen_l10n/app_localizations.dart';

class HomeScreen extends StatelessWidget {
  const HomeScreen({super.key});

  @override
  Widget build(BuildContext context) {
    final l10n = AppLocalizations.of(context)!;
    return Scaffold(
      appBar: AppBar(title: Text(l10n.settings)),
      body: Center(child: Text(l10n.welcome)),
    );
  }
}

Vaihe 8: Paikanhaltijat

Arvojen lisäämistä varten määritä mallin metatietoihin paikanhaltijat. Arvossa käytetään syntaksia {name}, ja gen_l10n muuttaa getterin metodiksi.

Jokainen paikanhaltija tarvitsee type-tyypin (esimerkiksi String, int tai DateTime).
Luodun metodin allekirjoitus noudattaa paikanhaltijoiden järjestystä.

{
  "@@locale": "en",
  "greeting": "Hello, {name}!",
  "@greeting": {
    "description": "Personalized greeting",
    "placeholders": {
      "name": { "type": "String" }
    }
  }
}

Vaihe 9: Kutsu paikanhaltijametodia

Koska greeting ottaa argumentin, luotu jäsen on metodi eikä getter. Välität arvon kutsukohdassa.

l10n.greeting('Ada') palauttaa arvon "Hello, Ada!".
Tyypit tarkistetaan: int-arvon välittäminen kohtaan, jossa odotetaan String-arvoa, aiheuttaa käännösvirheen.

Widget buildGreeting(BuildContext context, String userName) {
  final l10n = AppLocalizations.of(context)!;
  return Text(l10n.greeting(userName));
}

Vaihe 10: Monikot ICU:lla

ARB tukee ICU-viestisyntaksia monikoille. Rakenne {count, plural, ...} valitsee kullekin kielelle sopivan sanamuodon. Määritä paikanhaltijan tyypiksi num (tai int).

=0, one ja other ovat yleisiä luokkia.
# korvataan muotoillulla luvulla.
Eri käyttöliittymillä on erilaiset monikkosäännöt — ICU käsittelee ne automaattisesti.

{
  "itemCount": "{count, plural, =0{No items} one{1 item} other{{count} items}}",
  "@itemCount": {
    "placeholders": {
      "count": { "type": "int" }
    }
  }
}

Vaihe 11: Pelkkä Dart-muotoilija

ICU:n suorittama valintalogiikka koostuu yksinkertaisesti lukuun sovellettavista säännöistä. Tässä on pieni itsenäinen Dart-ohjelma, joka jäljittelee englannin monikon valintaa — se auttaa ymmärtämään, mitä gen_l10n luo taustalla.

Oikeissa sovelluksissa käytetään luotua metodia; tämä on tarkoitettu vain havainnollistamiseen.

String itemCount(int count) {
  if (count == 0) return 'No items';
  if (count == 1) return '1 item';
  return '$count items';
}

void main() {
  for (final n in [0, 1, 5]) {
    print(itemCount(n));
  }
}

Pikatarkistus

Lisäsit uuden avaimen logout vain tiedostoon app_en.arb, mutta unohdit lisätä sen tiedostoon app_tr.arb. Turkinkielistä käyttöliittymää käyttävä avaa näytön. Mitä tapahtuu?

Vastaa interaktiivisessa oppitunnissa

Kertaus

Rakensit Flutterin koko lokalisointiputken:

Lisäsit flutter_localizations- ja intl-paketit sekä määritit generate: true.
Määritit l10n.yaml-tiedoston (arb-dir, malli ja tulostusluokka).
Kirjoitit ARB-mallin ja kielikohtaiset käännökset.
Annoit gen_l10nin luoda tyypitetyn AppLocalizations-luokan.
Rekisteröit localizationsDelegates- ja supportedLocales-asetukset ja luit merkkijonoja komennolla AppLocalizations.of(context)!.
Käytit paikanhaltijoita dynaamisille arvoille ja ICU-monikkoja lukumäärästä riippuville teksteille.

Hyötynä ovat tyyppitarkistetut käännökset, varhain havaitut puuttuvat mallin avaimet ja kääntäjille selkeä JSON-muoto.

Aloita maksutta

Opi Dart tekoälytuutorin avulla — ilmaiseksi

Kirjoita ja suorita oikeaa koodia selaimessa, saa välitöntä apua tekoälytuutorilta ympäri vuorokauden ja jatka siitä, mihin jäit, verkossa tai sovelluksessa.

Kurssit: 22
Oppitunnit: 88

Aloita opiskelu maksutta Näytä koko kurssi

Usein kysytyt kysymykset

Onko oppitunti ”ARB-tiedostot ja gen_l10n-paikallistamisen työnkulku” ilmainen?

Kyllä — voit lukea täällä verkossa kokonaan ilmaiseksi mitkä tahansa Mobiilikehitys Flutterilla-oppimispolun 3 oppituntia, myös oppitunnin “ARB-tiedostot ja gen_l10n-paikallistamisen työnkulku”. Sen jälkeen CoddyKit PRO avaa kaikki oppitunnit sekä interaktiiviset harjoitukset sisäänrakennetulla koodieditorilla ja ympäri vuorokauden toimivalla tekoälytuutorilla. Mobiilikehitys Flutterilla-kurssilla on yhteensä 4 oppituntia.

Mitä opin oppitunnilla ”ARB-tiedostot ja gen_l10n-paikallistamisen työnkulku”?

Määritä flutter_localizations- ja gen_l10n-putki tyypitettyjen käännösten tuottamista varten. Harjoittelet Mobiilikehitys Flutterilla-aihetta koodilla, jonka suoritat suoraan selaimessa. Ympäri vuorokauden käytettävissä oleva tekoälytuutori vastaa kysymyksiisi oppitunnin aikana.

Tarvitsenko kokemusta aloittaakseni Mobiilikehitys Flutterilla-opiskelun?

Aiempi kokemus ei ole tarpeen. CoddyKitin Mobiilikehitys Flutterilla-oppimispolku sopii vasta-alkajista edistyneisiin, joten voit aloittaa tästä tai alusta ja edetä omaan tahtiisi. Tämä on oppitunti 1/4.

Kuinka kauan ”ARB-tiedostot ja gen_l10n-paikallistamisen työnkulku”-oppitunnin suorittaminen kestää?

Useimmat CoddyKitin oppitunnit kestävät noin 5–10 minuuttia. Jokainen oppitunti on lyhyt ja interaktiivinen, joten edistyt tasaisesti ja voit jatkaa siitä, mihin jäit – sekä verkossa että sovelluksessa.

Voinko kirjoittaa ja suorittaa koodia tällä Mobiilikehitys Flutterilla-oppitunnilla?

Kyllä. Jokainen Mobiilikehitys Flutterilla-oppitunti sisältää sisäänrakennetun koodieditorin, joten voit kirjoittaa ja suorittaa oikeaa koodia suoraan selaimessa ja saada välitöntä palautetta tekoälyltä – paikallista asennusta ei tarvita.

Kaikki tämän kurssin oppitunnit

ARB-tiedostot ja gen_l10n-paikallistamisen työnkulku
Monikkomuodot, sukupuoli ja ICU-viestien muotoilu
RTL-asettelut ja suuntauksen käsittely
Semantiikka, ruudunlukijat ja saavutettavat widgetit

← Takaisin: Mobiilikehitys Flutterilla