Condividi tramite


Uso della localizzazione watchOS in Xamarin

Adattamento delle app watchOS per più lingue

Apple Watch che visualizza contenuto localizzato

Le app watchOS vengono localizzate usando i metodi iOS standard:

  • Uso dell'ID di localizzazione sugli elementi dello storyboard,
  • File con estensione strings associati allo storyboard e
  • File Localizable.strings per il testo usato nel codice.

Gli storyboard e le risorse predefiniti si trovano in una directory di base e le traduzioni specifiche della lingua e altre risorse vengono archiviate nelle directory lproj . Il sistema operativo iOS e Watch userà automaticamente la selezione della lingua dell'utente per caricare le stringhe e le risorse corrette.

Poiché un'app Apple Watch ha due parti: Watch App and Watch Extension - le risorse stringa localizzate sono necessarie in due posizioni, a seconda del modo in cui vengono usate.

Il testo localizzato e le risorse saranno diversi nell'app watch e nell'estensione watch.

Guarda l'app

L'app watch contiene lo storyboard che descrive l'interfaccia utente dell'app. Tutti i controlli (ad esempio Label e Image) che supportano la localizzazione hanno un ID di localizzazione.

Ogni directory con estensione lproj specifica della lingua deve contenere file con estensione strings con le traduzioni per ogni elemento (usando l'ID di localizzazione), nonché le immagini a cui fa riferimento lo storyboard.

Estensione espressioni di controllo

L'estensione watch è la posizione in cui viene eseguito il codice dell'app. Qualsiasi testo visualizzato all'utente dal codice deve essere localizzato nell'estensione e non nell'app watch.

L'estensione deve contenere anche directory con estensione lproj specifiche della lingua, ma i file con estensione strings richiedono solo traduzioni per il testo usato nel codice.

Globalizzazione della soluzione Espressioni di controllo

La globalizzazione è il processo di localizzazione di un'applicazione. Per le app watch questo significa progettare lo storyboard con lunghezze di testo diverse, assicurando che ogni layout dello schermo venga regolato in modo appropriato a seconda del testo visualizzato. È anche necessario assicurarsi che tutte le stringhe a cui si fa riferimento nel codice di estensione espressioni di controllo possano essere convertite usando il LocalizedString metodo .

Guarda l'app

Per impostazione predefinita, l'app watch non è configurata per la localizzazione. È necessario spostare il file storyboard predefinito e creare altre directory per le traduzioni:

  1. Creare la directory Base.lproj e spostarvi interface.storyboard.

  2. Creare <directory language.lproj> per ogni lingua che si desidera supportare.

  3. Le directory con estensione lproj devono contenere un file di testo Interface.strings (il nome del file deve corrispondere al nome dello storboard). Facoltativamente, è possibile inserire tutte le immagini che richiedono la localizzazione in queste directory.

Il progetto dell'app watch è simile al seguente dopo aver apportato queste modifiche (sono stati aggiunti solo file in lingua inglese e spagnola):

Il progetto dell'app watch con file di lingua inglese e spagnolo

Testo storyboard

Quando si modifica lo storyboard, selezionare ogni elemento e notare l'ID di localizzazione visualizzato nel riquadro Proprietà:

ID di localizzazione visualizzato nel riquadro Proprietà

Nella cartella Base.lproj creare coppie chiave-valore, come illustrato di seguito, in cui la chiave è formata dall'IDlocalizzazione e da un nome di proprietà nel controllo, unito da un punto (.).

"AgC-eL-Hgc.title" = "WatchL10nEN"; // interface controller title
"0.text" = "Welcome to WatchL10n"; // Welcome
"1.text" = "Language settings are in Apple Watch App"; // How to change language
"2.title" = "Greetings"; // Greeting
"6.title" = "Detail";
"39.text" = "Second screen";

Si noti che in questo esempio un ID di localizzazione può essere una stringa numerica semplice, ad esempio "0", "1" e così via) o una stringa più complessa (ad esempio "AgC-eL-Hgc"). Label I controlli dispongono di una Text proprietà e Buttondi una Title proprietà, che si riflette nel modo in cui vengono impostati i valori localizzati, assicurarsi di usare il nome della proprietà minuscola, come illustrato nell'esempio precedente.

Quando il rendering dello storyboard viene eseguito sull'orologio, i valori corretti verranno estratti e visualizzati automaticamente in base alla lingua selezionata dall'utente.

Immagini storyboard

La soluzione di esempio include anche un'immagine gradient@2x.png in ogni cartella del linguaggio. Questa immagine può essere diversa per ogni lingua, ad esempio il testo incorporato che richiede la traduzione o l'uso di iconografia localizzata.

È sufficiente impostare la proprietà Image dell'immagine nello storyboard e il rendering dell'immagine corretta sull'orologio in base alla lingua selezionata dall'utente.

Impostare la proprietà Image images nello storyboard

Nota: poiché tutti gli Apple Watch hanno display Retina, è necessaria solo la versione @2x dell'immagine. Non è necessario specificare @2x nello storyboard.

Estensione espressioni di controllo

L'estensione watch richiede una struttura di directory simile per supportare la localizzazione, ma non esiste alcun storyboard. Le stringhe localizzate nell'estensione sono solo quelle a cui fa riferimento il codice C#.

Struttura della directory dell'estensione espressioni di controllo per supportare la localizzazione

Stringhe nel codice

Il file Localizable.strings ha una struttura leggermente diversa rispetto a quella associata a uno storyboard. In questo caso è possibile scegliere qualsiasi stringa "key" ; È consigliabile usare una chiave che rifletta il testo effettivo visualizzato nella lingua predefinita:

"Breakfast time" = "Breakfast time!"; // morning
"Lunch time" = "Lunch time!"; // midday
"Dinner time" = "Dinner time!"; // evening
"Bed time" = "Bed time!"; // night

Il NSBundle.MainBundle.LocalizedString metodo viene usato per risolvere le stringhe nelle controparti tradotte, come illustrato nel codice seguente.

var display = "Breakfast time";
var localizedDisplay =
  NSBundle.MainBundle.LocalizedString (display, comment:"greeting");
displayText.SetText (localizedDisplay);

Immagini nel codice

Le immagini popolate dal codice possono essere impostate in due modi.

  1. È possibile modificare un Image controllo impostandone il valore sul nome stringa di un'immagine già esistente nell'app Espressioni di controllo, ad esempio

    displayImage.SetImage("gradient"); // image in Watch App (as shown above)
    
  2. È possibile spostare un'immagine dall'estensione all'orologio usando FromBundle e l'app sceglierà automaticamente l'immagine corretta per la selezione della lingua dell'utente. Nella soluzione di esempio è presente un'immagine language@2x.png in ogni cartella del linguaggio e viene visualizzata DetailController usando il codice seguente:

    using (var image = UIImage.FromBundle ("language")) {
        displayImage.SetImage (image);
    }
    

    Si noti che non è necessario specificare il @2x quando si fa riferimento al nome file dell'immagine.

Il secondo metodo è applicabile anche se si scarica un'immagine da un server remoto per il rendering sull'orologio; Tuttavia, in questo caso, è necessario assicurarsi che l'immagine scaricata sia localizzata correttamente in base alle preferenze dell'utente.

Localizzazione

Dopo aver configurato la soluzione, i traduttori dovranno elaborare i file e le immagini con estensione strings per ogni lingua che si vuole supportare.

È possibile creare tutte le directory lproj necessarie (una per ogni lingua supportata). Sono denominati usando codici linguistici, ad esempio en, es, de, ja, pt-BR e così via (rispettivamente per inglese, spagnolo, tedesco, giapponese e portoghese (brasiliano).

L'esempio allegato usa traduzioni (generate dal computer) per illustrare come localizzare un'app watchOS.

Guarda l'app

Questi valori vengono usati per tradurre l'interfaccia utente definita nello storyboard dell'app watch. Il valore della chiave è una combinazione dell'ID localizzazione di ogni controllo storyboard e della proprietà da tradurre.

È consigliabile aggiungere commenti contenenti il testo originale al file in modo che i traduttori sappiano cosa deve essere la traduzione.

es.lproj/Interface.strings

Di seguito sono riportate le stringhe di lingua spagnola (tradotta automaticamente) per lo storyboard. È utile aggiungere commenti a ogni riga, perché è difficile sapere a cosa fa riferimento l'ID di localizzazione in caso contrario:

"AgC-eL-Hgc.title" = "Spanish"; // app screen heading
"0.text" = "Bienvenido a WatchL10n"; // Welcome to WatchL10n
"1.text" = "Ajustes de idioma están en Apple Watch App"; // Change the language in the Apple Watch App
"2.title" = "Saludos"; // Greetings
"6.title" = "2nd"; // second screen heading
"39.text" = "Segunda pantalla"; // second screen

Estensione espressioni di controllo

Questi valori vengono usati nel codice per tradurre le informazioni prima di essere visualizzate all'utente. La chiave viene selezionata dallo sviluppatore durante la scrittura del codice e in genere contiene la stringa effettiva da tradurre.

file es.lproj/Localizable.strings

Stringhe di lingua spansish (tradotte automaticamente):

"Breakfast time" = "la hora del desayuno"; // morning
"Lunch time" = "hora de comer"; // midday
"Dinner time" = "hora de la cena"; // evening
"Bed time" = "la hora de dormir"; // night

Test in corso

Il metodo per modificare le preferenze di lingua differisce tra il simulatore e i dispositivi fisici.

Simulatore

Nel simulatore selezionare la lingua da testare usando l'app iOS Impostazioni (icona a forma di ingranaggi grigi nella schermata iniziale del simulatore).

Impostazioni di localizzazione delle app Impostazioni iOS

Guardare il dispositivo

Quando si esegue il test con un orologio, modificare la lingua dell'orologio nell'app Apple Watch nell'i Telefono associato.

Modificare la lingua dell'orologio nell'app Apple Watch nell'i associato Telefono