【Flutter】【大失敗】全言語に力技で対応した話【多言語対応】

Flutter基礎

こんにちは,海岸 蒼です。

日々、アプリ作成をコツコツとしています。
最近Flutterでの制作を始め、Flutter を学び始めてから約1ヶ月半で2つのアプリをリリースしました。
作ったアプリ紹介はこちら

今回はそんな私の失敗談です。
みなさまの反面教師となるべく記事を書きますので、ご覧いただければ幸いです。

失敗 : 英語以外の言語設定時、英語化されない

アプリのローカライゼーション(多言語対応)は、アプリ作成者なら誰しもが考えるところだと思います。

少なくとも英語に対応できていればいいだろう、という考えのもと、
日本語以外の地域で英語になるよう多言語化を進め、一つ目のアプリをリリースをしました。

そんなある日、Reddit(海外版2ちゃんねるのような掲示板サイト)にアプリの紹介を掲載したところ、
ロシアの方からリプライが飛んできました。

「どうやって日本語から英語化するんだい?」

多言語化は、使っているデバイスの言語設定によって、日本語なら日本語が、それ以外なら英語が表示されると思っていたので、???でした。

試しに自分の端末でロシア語設定してみると、日本語で表示される。

端末を英語設定すると、英語化されるので安心してリリースしたのですが、
他の言語はチェック漏れしていました。甘すぎますね。

原因とやったこと

原因を調べると、どうやらMaterialApp 内のsupportedLocalesに書かれている言語のみにしか
英語化対応されない、ということがわかりました。

なぜかはわかりませんが、書かれていない言語は日本語扱いになってしまうようです。

ここで、自分が思いついた対策は、

「書かれていない言語には対応しないなら、全ての言語を書き並べればいいじゃん!」

でした。

というわけで、書き並べたのが下になります。

supportedLocales: [
        Locale('af', ''),
        Locale('am', ''),
        Locale('ar', ''),
        Locale('as', ''),
        Locale('az', ''),
        Locale('be', ''),
        Locale('bg', ''),
        Locale('bn', ''),
        Locale('bs', ''),
        Locale('ca', ''),
        Locale('cs', ''),
        Locale('da', ''),
        Locale('de', ''),
        Locale('el', ''),
        Locale('en', ''),
        Locale('es', ''),
        Locale('et', ''),
        Locale('eu', ''),
        Locale('fa', ''),
        Locale('fi', ''),
        Locale('fil', ''),
        Locale('fr', ''),
        Locale('gl', ''),
        Locale('gsw', ''),
        Locale('gu', ''),
        Locale('he', ''),
        Locale('hi', ''),
        Locale('hr', ''),
        Locale('hu', ''),
        Locale('hy', ''),
        Locale('id', ''),
        Locale('is', ''),
        Locale('it', ''),
        Locale('ja', ''),
        Locale('ka', ''),
        Locale('kk', ''),
        Locale('km', ''),
        Locale('kn', ''),
        Locale('ko', ''),
        Locale('ky', ''),
        Locale('lo', ''),
        Locale('lt', ''),
        Locale('lv', ''),
        Locale('mk', ''),
        Locale('ml', ''),
        Locale('mn', ''),
        Locale('mr', ''),
        Locale('ms', ''),
        Locale('my', ''),
        Locale('nb', ''),
        Locale('ne', ''),
        Locale('nl', ''),
        Locale('no', ''),
        Locale('or', ''),
        Locale('pa', ''),
        Locale('pl', ''),
        Locale('ps', ''),
        Locale('pt', ''),
        Locale('ro', ''),
        Locale('ru', ''),
        Locale('si', ''),
        Locale('sk', ''),
        Locale('sl', ''),
        Locale('sq', ''),
        Locale('sr', ''),
        Locale('sv', ''),
        Locale('sw', ''),
        Locale('ta', ''),
        Locale('te', ''),
        Locale('th', ''),
        Locale('tl', ''),
        Locale('tr', ''),
        Locale('uk', ''),
        Locale('ur', ''),
        Locale('uz', ''),
        Locale('vi', ''),
        Locale('zh', ''),
        Locale('zu', ''),
      ],

長いですよね。でもやりました。
対策の結果は上々で、ちゃんと英語以外の言語を選択すると英語表示になりました。

同じように悩んでいて、これをコピペしようとしている方はちょっとお待ちください!
この記事を書いていて、こんなことをしなくて良いことに気がつきました。

対策

公式ドキュメントのsupportedLocalesの書き方です。

supportedLocales: AppLocalizations.supportedLocales,

全言語対応するなら、正直この1行でよかったです。
(これで表示されることは確認済みです)

なんだそりゃ、って感じですよね。
自分もこれを発見した時呆然としました。

公式ドキュメントはちゃんと読むべきですね。

もし、全言語対応したい方がいらっしゃったら、こちらをお試しください。

まとめ

今回は、Flutterアプリの多言語化対応で自分が失敗した点について記載しました。

まとめると、

  • ちゃんとチェックしよう
  • 公式ドキュメントをちゃんと読もう

ですね。同じようなミスを犯さないよう、猛省します。

本記事が誰かの反面教師となれば幸いです。

コメント