多言語対応アプリの構築

使用する言語に関わらず、ユーザーがアプリを適切かつ効果的に利用できるようにしましょう。このセッションでは、テキストの入力、表示、検索、フォーマットに関するベストプラクティスをご紹介します。別のキーボードに切り替えることなく、複数の言語でテキストを入力できるようにする方法を詳しく説明します。また、String Catalogの最新機能を使用して、ローカリゼーションをさらに簡単に行う方法も取り上げます。

リソース

関連ビデオ

WWDC24

SF Symbols 6の新機能

WWDC23

WWDC21

WWDC20

Formatters：データをヒューマンフレンドリーに

ダウンロード

こんにちは آداب（ādāb） नमस्ते（namaste）大家好（dàjiāhǎo） Karanです今回皆さんにお話しするのは多言語に対応するアプリの構築についてです今日の世界ではほとんどの人が複数の言語を話して育つか複数の言語に触れながら生活していますバンクーバーで読みたい本を探している時でも台北でかき氷を食べている時でもデリーで地下鉄に乗っている時でも誰もが多言語社会にいて周りの人は色々な言語で話したり読んだり聞いたりメッセージをやり取りしています私たちは毎日アプリを使って人と話したり日記をつけたり映画を観たり本を読んだりしていて私たちが使うすべての言語でアプリがうまく動作することを求めています

そこで今日は多言語のユーザーにとって魅力的なアプリを実現するためのヒントを紹介したいと思いますその話に進む前に Appleで力を入れている取り組みの一部をご紹介します今年は多言語の体験を向上させる新機能を数多く導入すると同時に既存の機能を拡張してさらに多くの言語をサポートしますこれらの新機能をいくつか見てみましょう

まず新しい多言語キーボードでは言語を手動で切り替えることなく複数の言語を入力できます

例えば韓国語と英語を話す人のために iOS 18では独自のマルチスクリプト文字入力体験を導入しています

既存の様々な機能がより多くの言語で利用できるようになります例えばテキスト認識表示がアラビア語に対応しますまた壁紙や文字盤の数字をカスタマイズできるようにインド文字が10種類追加されました最後に新しいM4 iPad Proの Magic Keyboardではアラビア語用のファンクションキーが再設計されて音量や明るさのキーがハードウェアとソフトウェアの間で正確に対応するようになりました

これを始めとして Appleでは様々な形でソフトウェアとハードウェアを 1つのシームレスな体験に融合させていますこうした素晴らしい新機能をぜひお試しくださいでは多言語に対応する優れたアプリの構築についてお話しします今日の内容は3部構成になっています入力表示ローカリゼーションです多言語への取り組みとしてまず入力を取り上げます今回の取り組みを手伝ってくれるのは様々な言語を話す世界各国の3人の友人ですこの3人の力を借りて東から西へ移動しながら一般的な多言語のシナリオを確認していきます入力についてお話しするために Aprilの一日を見てみましょう Aprilはシンガポールに住んでいて英語と中国語を話します親友のFarahとは英語で会話し

そしてパートナーとは中国語で会話します

Aprilがこうした会話をする時それぞれの会話でAprilが使う言語をキーボードが記憶していますアプリでこれを行う方法をお見せしましょうとても簡単です UIResponderのメソッドである textInputContextIdentifierをオーバーライドし一意の文字列識別子を返すだけです Aprilは手書きキーボードを使って中国語で文字を書く時書きやすいようにキーボードをよく縦に広げますこの時にメッセージアプリは UIを上に移動してスペースを確保します

これには2つの方法があります 1つ目にキーボードの真上にビューを配置する必要がある場合は inputAccessoryViewを使えばキーボードの上にビューを固定できます画面の下部にビューを固定することでハードウェアキーボードを入力に使う場合にも対応できます 2つ目の方法は keyboardLayoutGuideを使うことですこれによりキーボードを基準にしてビューの配置をカスタマイズできますまた中国語や日本語などの言語で入力する場合はマークされたテキストをキーボードで使用しますマークされたテキストとは何かお見せしましょうマークされたテキストは候補を選択する前の一時的なテキストで下線が引かれています候補が確定されるとマークされたテキストは消えます

悪い例を見てみましょうキーを押すたびにテキストが変更されて入力の邪魔になっていますアプリがこのように動作するのは入力中に自動補完を提供するためですでは便利なインラインの補完を表示しながら中国語で入力する方法を見てみましょうここで重要となるのはマークされたテキストがないのをテキストの変更前に確認することです markedTextRangeから空の結果が返された時はテキストを変更して自動補完をインラインで表示しても問題ありませんただしマークされたテキストがある時でもそのテキストに基づいて検索を行いテーブルビューなどの他の場所に候補を表示することはできます Spotlightでは実際にこれを実現していますご覧のように入力に応じて上の候補が更新され候補が確定された時にだけインラインのテキストが変更されますありがとう April 次はRajの例を通して優れた検索体験を実現する方法を見ていきましょう

Rajはインドに住んでいてヒンディー語と英語を話しますヒンディー語で検索していると目的のものが見つからない場合がありますこうしたことが起こる原因と解決方法を見てみましょう

各言語にはまったく異なる綴りと関連する綴りを判別するためのルールがあります

英語では小文字のaでappleを検索した時に大文字のAのAppleに一致すると期待されますドイツ語などの言語にも同様のルールがあります Rajの場合検索で入力した綴りの形式は連絡先に登録された名前の形式とまったく違うものでしたこの問題はコードを 1行変更するだけで修正できます localizedStandardRange を使うのです localizedStandardRange はご想像の通りロケール固有の規則を優先して検索を行う標準的な方法です今年はこのAPIの機能も大幅にアップグレードされて多種多様な文字の様々な綴りの規則にわたるマッチングや様々な文字にわたる数字のマッチングがサポートされるようになりました localizedStandardRangeと iOS 18の新しい機能強化により Rajは好きな方法で入力して探している連絡先を簡単に見つけられます

最後に Rajが検索フィールドに入力する時に時々遭遇する問題がひとつあります見てみましょう

一部のアプリでは Rajがヒンディー語で入力するとテキストが崩れて見えます

この問題は入力されたテキストの部分をアプリでハイライトする方法に起因します

ヒンディー語や他の多くの言語では文字に母音やその他の記号が付随します例として地平線を意味する単語の क्षितिज（kshitij）をキーごとに分けて入力してみましょうその際にどう変化するかに注目してください

ご覧のようにヒンディー語ではキーを押すと文字が右側に挿入されるとは限らず既存の文字が変化することもあります

通常の文字と太字は技術的に異なるフォントでありあるフォントの文字を別のフォントの記号とつなぐことはできませんこれがテキストが崩れて見える原因ですしかしいい方法として代わりに色を使用してテキストの一部をハイライトできますこちらが色の属性を属性付き文字列に追加する方法ですこれに関連して斜体化にも触れておきたいと思いますこちらは「こんにちは」を 10の言語で表していますではすべて斜体にしてみましょう 10個のうち3つしか変化していません残り7つの言語には斜体の概念がなく斜体化を適用しても見た目が変わらないからですしたがって斜体を使う時には翻訳で区別が失われる可能性があるため注意が必要です

さて太字の代わりに色を使うようにしたので Rajは検索結果を読める上に表示されているテキストのどの部分が入力した文字と一致するか区別することもできます入力については以上ですありがとう Raj April 次にテキストの表示方法について説明します表示に関しては Ismatの目線で世界を見てみましょう

Ismatは米国に住んでいて英語とウルドゥー語を話します

Ismatはウルドゥー語のテキストがほとんどのアプリでは完璧に表示されるものの一部のアプリではテキストが崩れて判読できなくなる場合があることに気づきましたこちらはنستعلیق（Nastālīq）というウルドゥー文字の名前で左側は正しく表示されていますが右側は誤って表示されていますこの場合の解決策は簡単で TextKit 2を使うだけですこの次世代テキストエンジンによりすべての文字が正しくレンダリングされますちなみに SwiftUI AppKit UIKitでラベルやテキストビューを使う時はこのエンジンが自動的に使用されます

今Ismatは日記を読み返して過去の出来事を思い出しています

素晴らしいことにジャーナルアプリを英語で実行していても TextKit 2のおかげでウルドゥー語の文章が美しく表示されますしかしジャーナルやほとんどのアプリではウルドゥー語の文章がうまく処理される一方一部のアプリではウルドゥー語の文章の行が極端に詰まって読みにくい場合がありますジャーナルではウルドゥー語固有のコードなしにウルドゥー語の文章を適切に処理できますこれは多くのアプリと同様にアプリの言語だけでなく Ismatの場合のようにあらゆるユーザーの言語も考慮したテキストスタイルを使用しているからですこの方法によりあらゆる言語のテキストをどのアプリでも正しくレンダリングできますテキストスタイルの使い方はとても簡単ですこちらはSwiftUI UIKit AppKitでテキストスタイルを初期化する方法を示していますまたデフォルトでオフになっている clipsToBoundsをラベルやテキストビューではfalseのままにしておく必要があることに注意してください多くの言語のテキストはビューの境界外でレンダリングする必要があるからですオフにしないと判読できなくなります

さて特定の言語でコンテンツを表示していてその言語に最適な印字動作が必要になる場合もあるでしょうこのような場合は typesettingLanguageを指定できます

左側の例は優先する言語をすべて考慮したデフォルトの印字で Ismatが使うウルドゥー語も含まれます右側の例では typesettingLanguageを英語に設定して同じテキストでも行の間隔を狭くしています最後に April Raj Ismatは名前が正しく表示されることがとても重要だと考えています formatted APIを使用するとアプリの言語に関係なくあらゆる言語と文字で名前を正しく表示できるようになります例えば中国語や日本語などの言語では下の名だけを表示するのは適切ではありません代わりにフォーマッタの短い形式を使って適切な場合にのみ下の名を使用するようにしますモノグラムでは省略形式を使用します

April Raj Ismatにはここでお別れをしてアプリのローカライズに毎日使うツールの注目すべき機能強化について見ていきましょう

まずはString Catalogsです String Catalogsは Xcodeでのローカライズの基盤であり文字列とコードの同期を維持し強力な編集ツールを提供することでプロジェクトの翻訳管理プロセスを簡素化します String Catalogsの新機能を見てみましょう

String Catalogsでは書式指定子の不一致など検証でよくある問題が検出されワンクリックで修正できるようになりました

次に特定の文字列を「Don’t Translate」としてマークできるのでコンテンツの最終調整がまだ進行中であるのを翻訳者に簡単に知らせることができます

そして最後に特定の文字列についてコードとカタログ間を簡単に行き来できるようになりました String Catalogsのこうした機能強化すべてによって開発とローカリゼーションのワークフローが加速すれば幸いです次にアプリ内の1つ1つの文字列を魅力的にするためによりインクルーシブでパーソナライズされたものにする方法について説明します

文法的な一致を自動で確保する強力なエンジンによりアプリで「言語と地域」設定の呼称を使ってユーザーに話しかけ親近感を高めることができます

アプリで代名詞を使って人を表すこともできます最後に文法エンジンによりアプリ内のテキストがすべて文法的に正しいことを確保できるだけでなく 1つのテキストに対して何十もの文字列のバリエーションを作成する必要もなくなりますそして今年は文法エンジンが新たに2つの言語に対応します 1つ目はヒンディー語ですヒンディー語でデバイスを使う場合「言語と地域」設定で呼びかけ語を指定してどう呼びかけてもらうかをユーザーが選べるようになりました

また文法エンジンは韓国語にも対応するので後続の単語に応じて助詞を変化させることが可能になりますドイツ語英語スペイン語フランス語イタリア語ポルトガル語ヒンディー語韓国語をアプリでサポートする場合は自動文法一致機能を利用できます

次に数字についてお話ししましょう英語ではアラビア数字が使われていてこれらの数字は他の多くの言語でも使われていますただしアラビア数字は世界中で使われている様々な数体系の1つです複数の数体系をサポートする言語ではユーザーは「言語と地域」設定で好きな数字を選択できます便利なことにフォーマッタを使うと数字が自動的にロケール固有のすべてのルールに従いますフォーマッタを使用していない数字をフォーマットする簡単な方法を紹介します天気アプリのこのテキストは「10日間の予報」を意味していて通常はこれを表すローカライズ可能な文字列があります

これをローカライズする方法は2つあります 1つ目は補間を使用してコードで数字をフォーマットすることです Text内にあるため NumberOfDaysは現在のロケールに合わせ自動的にフォーマットされますこの機能が役立つのは実行時に数字が決まる場合やどの言語でもこの文字列で数字を使う場合です

今年は2つ目の方法として文字列内で直接数字をフォーマットする機能も導入しますこの方法はコードでフォーマットする場合とまったく同じ状況で使用できますただし最大の利点としてこの機能を使うとローカライズされた文字列内の数字をコードなしで簡単にフォーマットできます

この最初の例では 10日間の予報という文字列をこの方法でローカライズできますこの例ではソース文字列は英語でヒンディー語に翻訳された文字列では formatNumberを使いますこれにより「言語と地域」の数字設定に従って実行時に正しい数体系が使用されます

数体系に加えて小数点の区切り文字など数字フォーマットの別の面にも対応できます例えばスペイン語の場合 1つの文字列をスペインと米国の両方で使用できます

複数のローカリゼーションをサポートするアプリでは「言語と地域」設定で複数の言語が指定されている場合ユーザーがアプリを使う時に言語設定が自動的に表示されるのでデバイス全体の言語とは関係なくアプリ固有の言語を選択できますこの機能は様々な言語で様々なアプリを使う多言語のユーザーから高い支持を得ています複数の優先する言語をユーザーが指定している場合だけでなく常にアプリの設定に言語オプションを表示したい場合は InfoPlistで UIPrefersShowingLanguageSettingsを YESに指定します

必要に応じてアプリの設定に直接移動するボタンなどの機能も追加できます最後にご紹介するSF Symbolsはローカリゼーションで大いに役立つ重要なツールでありこれらのシンボルは多種多様な言語や文字に対応しています Appleのアプリでよく使われるシンボルでは SF Symbolsを使用していますフォーマットコントロールを表示するボタンで使われるtextformatなどです署名のような決まった形のない要素を含むシンボルも各言語で自然に見えるよう調整されていて SF Symbolsは様々な数体系だけでなく右から左に書く言語もサポートしていますしたがってアプリで使うシンボルを探している時は最初にSF Symbolsの豊富なライブラリをチェックしてみてください

まとめると現在の多言語の世界ではユーザーはアプリで色々な言語を使うのでキーボード入力や表示をどの言語でも適切に機能させて優れた体験をユーザーに提供する必要がありますまた String Catalogsなどのツールを活用することで開発とローカリゼーションのワークフローを大幅に加速できます皆さんの多言語対応のアプリを楽しみにしていますありがとうございました شکریہ（shukriyā） धन्यवाद（dhanyavād）謝謝（xièxiè）

3:18 - Specify textInputContextIdentifier

override var textInputContextIdentifier: String? {
    uniqueID
}

3:41 - Place a view directly above the keyboard
```
textView.inputAccessoryView = viewAboveKeyboard
```

4:00 - Use keyboardLayoutGuide to adapt to keyboard

view.keyboardLayoutGuide.topAnchor.constraint(equalToSystemSpacingBelow: textView.bottomAnchor, multiplier: 1.0).isActive = true

4:42 - Check for marked text before modifying

if textView.markedTextRange.empty {
    // Perform actions involving editing text
}

5:58 - Use localizedStandardRange when searching
```
let range = text.localizedStandardRange(of: search)
```
7:24 - Use color differences to highlight text
```
attributedString[range].foregroundColor = highlightColor
```

9:39 - Text Styles

// Text Styles

// SwiftUI
Text("Hello, world!") // uses .body Text Style by default
Text("Hello, world!").font(.title)

// UIKit
let label = UILabel()
label.text = "Hello, world!"
label.font = UIFont.preferredFont(forTextStyle: .body)

// AppKit
let textField = NSTextField(labelWithString: "Hello, world!")
textField.font = NSFont.preferredFont(forTextStyle: .body)

// Keep clipsToBounds off
clipsToBounds = false

10:03 - Typesetting language

// Typesetting language

// SwiftUI
Text(verbatim: "Hello, world!").typesettingLanguage(.init(languageCode: .english))

// UIKit
let label = UILabel()
label.text = "Hello, world!"
label.traitOverrides.typesettingLanguage = Locale.Language(languageCode: .english)

10:29 - Formatting names

// Formatting names

let nameComponents = PersonNameComponents
  (givenName: "瑗珺", familyName: "汪", nickname: "珺珺")

// Short Name (respects settings like “Prefer Nicknames”)
let shortName =   nameComponents.formatted(.name(style: .short)) // 珺珺

// Abbreviated Name (can be used for monograms)
let monogram =   nameComponents.formatted(.name(style: .abbreviated)) // 汪

12:20 - Examples of personalizing text

"^[Nuestro %@](inflect: true) está ^[hecho](agreeWithArgument: 1) de %@."
"अगर आप पहुँच नहीं ^[पाते हैं](inflect: true)"
"예: ‘^[%@을](inflect: true) 켤 때’"

13:43 - Format numbers using Text
```
Text("\(numberOfDays)-day forecast")
```

14:21 - Format numbers using AttributedString

AttributedString(localized: "10-day forecast")
AttributedString(localized: "0.5× zoom")

15:23 - Launch to your app’s settings

// Launch to your app’s settings
if let url =
URL(string: UIApplication.openSettingsURLString) {
   await UIApplication.shared.open(url)
}

特定のトピックをお探しの場合は、上にトピックを入力すると、関連するトピックにすばやく移動できます。

多言語対応アプリの構築

関連する章

リソース

関連ビデオ

WWDC24

WWDC23

WWDC21

WWDC20