こんにちは。今回はFlutterFlow(フラッターフロー)で多言語対応行う方法を変えていきたいと思います。なかなか多言語対応ってめんどくさいイメージがありますよね。スクラッチで作っても外のノーコードツールで作ってもなかなか時間がかかりますし、うまくいかないことが多いと思います。ただFlutterFlowであれば非常に簡単にあっという間に多言語対応ができます。素晴らしいですよね。今日はそのノーコードツール・FlutterFlow(フラッターフロー)による多言語対応の方法について説明していきたいと思います。SettingのLanuageでPrimary言語とそれ以外の言語を登録する。まずFlutterFlowの管理画面のSettingページからPrimaryの言語とそれ以外の言語を追加してきます。以下のスクショをご覧ください。翻訳データを設定する(自動翻訳も簡単に可能)このように プライマリー 言語とそれ以外の言語を設定すると画面の下の方に以下のスクショのように全ての画面名が一覧で表示されます それぞれの画面を開くと画面の中に設定されているテキスト 項目が表示されます。これすごいですよね!この例で言うと今testという画面を開いています。testの画面の中にはEnglish の項目だけが設定されています。で、そこにプライマリー以外の言語としてJapaneseとChineseを入れているので、それぞれが空欄で出てきます。ここでTranslate Pageページというボタンを押すと自動的に翻訳してくれてJapaneseとChineseのところを埋めてくれるんです。すごくないですか!?そしてそこはもちろんGoogle 翻訳がやっているので 精度が確実とは 言えないので自分で好みの日本語 中国語に手入力で変えることができる、というような仕組みになってます。これめちゃめちゃ便利ですよね!languageSelectorエレメントを設定するあとは エディターの方に戻りまして、エレメントの中からlanguageSelectorというエレメントを選んで貼り付けるだけです。そうすると以下のスクショのように実際の画面でクリックするとEnglishからJapanese に変えられたり...と、簡単に翻訳が可能です。素晴らしいですよね!多言語対応がこんなに簡単だなんて!実際にアプリを動かしてみると以下のような感じです。さくさく動いて英語から日本語に変わりました!素敵ですね!ぜひ試してみて、日本だけじゃなくグローバルマーケットにリーチできるサービスを作ってみてください。Youtube動画でFlutterFlowの多言語対応について詳しくみたい方はこちらFlutterFlowは複雑なため、動画で見た方が早いことも多いため、動画にもまとめてみました。%3Ciframe%20width%3D%22560%22%20height%3D%22315%22%20src%3D%22https%3A%2F%2Fwww.youtube.com%2Fembed%2FbfZbCJs008Y%22%20title%3D%22YouTube%20video%20player%22%20frameborder%3D%220%22%20allow%3D%22accelerometer%3B%20autoplay%3B%20clipboard-write%3B%20encrypted-media%3B%20gyroscope%3B%20picture-in-picture%3B%20web-share%22%20allowfullscreen%3D%22%22%3E%3C%2Fiframe%3Eこの記事の内容は上記の動画で詳しく解説しています。興味のある方はどうぞ。アプリ・Webサービスの開発の無料相談はこちらAdalo、bubble、FlutterFlow、STUDIOなどのノーコードツールを使うことで、リスクを抑えて低コストでスピーディにビジネスアイデアを形にすることができます。この機会に、温めていたビジネスアイデアを今すぐ形にしてみませんか?弊社はスタートアップ・新規事業向けにコストを抑えた最速のアプリ・Webサービスの開発、さらにはサービス立ち上げのコンサルティングから提案を行なっております。また、法人向けにノーコードのスクール事業を通して内製化のサポートも行っています。アプリ/Webサービスの開発、LPなどの構築に興味のある方は、こちらからご気軽にご相談ください。