Help us understand the problem. What is going on with this article?

[OutSystems]Reactive Web Appの多言語機能(Technical Preview)を試す

ついに、Reactive Web App (Mobileにも)多言語機能が追加されたので、早速試してみました。
2020/11/19時点ではまだTechnical Previewである点に注意して下さい。実運用環境で使うのはもう少し待ったほうがいいですね。

ドキュメント

Technical Preview - Multilingual Reactive Web and Mobile Apps

環境

Personal Environment(Version 11.10.0 (Build 22910))
Service Studio (Version 11.9.1)

前提条件

ソフトウェアバージョンの条件があります

  • Platform Server:11.10.0以上
  • LifeTime:11.6.0以上
  • Service Studio:最新

機能を有効にする(Technical Preview)

  1. LifeTimeにログイン
  2. Environmentsタブをクリック
  3. 右上の「Options▼」ドロップダウンリストからTechnical Previewリンクをクリック
  4. Multilingual for Mobile and Reactiveのスイッチをオンに
  5. 画面を下にスクロールしてSaveボタンをクリック

image.png

保存が終わると、こんなMessageがポップアップ表示されます。
image.png

Service Studioの表示を確認

メッセージに従ってService Studioを一旦環境から切断してつなぎ直します。
Service Studioを起動し直して確認したら、フォルダが表示されました。
image.png

フォルダを右クリックしたところ
image.png

TraditionalでおなじみのUIですね。

翻訳機能をテストしてみる

ロケールを追加

デフォルトはen-US(アメリカの英語)です。
ja-JP(日本語)を追加してみます。

Service StudioでDataタブのMultilingual Localesフォルダを右クリックし、Add Locale...を選択。
表示されたダイアログで、ja-JPを選択してOKボタンをクリック。
image.png

Translationsダイアログで翻訳テキストを設定

Traditionalのときと同じ操作方法ですね。

  1. Translations in のドロップダウンリストで、翻訳先言語に対応するロケールを選択しておく
  2. Locationで翻訳対象Textの配置場所を探す(Filterで絞り込み可能)
  3. Text列で元々のテキストを確認し、ふさわしい翻訳テキストをTranslations in列の該当行セルに設定
  4. BehaviorがTranslateでなければ、Translateにしておく

という手順で翻訳テキストを設定します。業務で行うときはExcelへのエクスポート・インポート機能を使うことになると思います。
image.png

テスト用にロケール変更処理を追加

(System)モジュールに、SetCurrentLocaleのClient Action版が増えているのでこの参照を追加。
image.png

テスト対象モジュール内にButtonを配置し、そのScreen Actionを以下のようにロケールをテスト対象のもの(この場合はja-JP)に切り替える。
image.png

動作確認

初期表示
image.png

ボタンをクリックしてロケール切替え
image.png

jyunji_watanabe
Low-Code開発プラットフォームのOutSystems専門技術者。 プロジェクトへの技術支援、アーキテクト、教育など担当。 それ以前は、.NET/JavaScriptで業務アプリケーション開発をやっていました。 Expert Web Developer/Associate Tech Lead/Associate Mobile Developer 新技術、調査/検証結果を記録しています。
https://blog.house-soft.info/
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away