画面の文言を用途に合わせて変数に置き換えたい

この記事では、IM-BloomMakerで画面に表示する文言を、用途に合わせて変数・定数・多言語に設定する方法を紹介します。

ボタンやラベルに表示する文言は、画面上に直接設定することもできます。一方、複数の画面で同じ文言を使用する場合や、アプリケーションの規模が大きくなる場合は、文言をまとめて管理すると、変更や修正を行いやすくなります。また、複数の言語に対応する場合は、ユーザのロケールに応じて表示する文言を切り替える必要があります。

ここでは、画面で使用する文言を変数・定数・多言語に設定し、用途に合わせて使い分ける方法について説明します。

画面の文言を整理する

アプリケーションの画面には、ボタンやラベル、メッセージ、説明文など、さまざまな文言が表示されます。

たとえば、以下のように分類できます。

  • UIテキスト:ボタン、メニュー、ラベルなど、画面の操作や内容を示す文言
  • メッセージ:ユーザへの通知、警告、エラーなどを伝える文言
  • 説明文:ツールチップやガイドなど、画面や機能の使い方を説明する文言

アプリケーションの規模が大きくなると、同じ文言を複数の画面で使用したり、後から文言を変更したりするケースが増えてきます。そのため、画面に表示する文言を整理し、どの文言を共通化するか、どの文言を変更可能にするか、多言語に対応するかをあらかじめ考えておくことが重要です。

アプリケーション内での用途を考える

通常、画面の文言は、IM-BloomMakerのデザイナ画面でエレメントのプロパティに固定値として設定します。

固定値として設定した文言は、そのエレメントに直接表示できます。一方、文言を変数・定数・多言語として設定すると、複数の画面で同じ文言を使用したり、ユーザの入力内容を別の画面に表示したり、ロケールに応じて表示する言語を切り替えたりできます。どの設定を使用するかは、文言の用途に応じて判断します。

用途に合わせて変数を使い分ける

IM-BloomMakerでは、画面で使用する値を変数・定数・多言語変数として設定できます。それぞれの特徴を理解し、文言の用途に合わせて使い分けます。

設定項目   説明
変数
アプリケーションの実行中に値を変更できる値です。ユーザが入力した値など、画面の操作に応じて変化する値を扱う場合に使用します。
定数
アプリケーションの実行中に値を変更しない値です。複数の画面で共通して使用する文言など、常に同じ値を使用する場合に適しています。
多言語変数ロケールごとに異なる値を設定できる値です。ユーザのロケールに応じて表示する文言を切り替える場合に使用します。

それでは、設定項目ごとに具体的な例を見ていきましょう。

Case 1 入力した文言を別の画面に表示したい

変数を使用すると、ある画面で入力した文言を、別の画面に表示できます。ユーザが入力した内容など、アプリケーションの実行中に変化する値を扱う場合に適しています。


IM-BloomMakerでは、以下のように変数を設定します。

  1. 変数を定義する(例:input_text
  2. Page #1で、エレメントに変数を設定する(例:$variable.input_text
  3. Page #2で、エレメントに同じ変数を設定する(例:$variable.input_text

Case 2 アプリケーション内で画面の文言を統一したい

定数を使用すると、複数の画面で同じ文言を使用できます。たとえば、複数の画面に同じタイトルや固定のメッセージを表示する場合に適しています。定数はアプリケーションの実行中に値を変更できないため、ユーザの操作によって値が変わらない文言に使用します。


IM-BloomMakerでは、以下のように定数を設定します。

  1. 定数を定義する(例:title
  2. Page #1で、エレメントに定数を設定する(例:$constant.title
  3. Page #2で、エレメントに同じ定数を設定する(例:$constant.title

Case 3 複数のアプリケーションで文言を統一したい

複数のアプリケーションで同じ文言を使用する場合は、Accel Studioの共通定数を利用できます。共通定数を各アプリケーションに取り込むことで、アプリケーション間で共通の文言を利用できます。


IM-BloomMakerでは、以下のように定数を設定します。

  1. Accel Studioから共通定数を定数としてインポートする(例:sample-1
  2. Application #1で、エレメントに定数を設定する(例:$constant.sample-1
  3. Application #2で、エレメントに同じ定数を設定する(例:$constant.sample-1

Case 4 アプリケーション内で複数の言語に切り替えたい

多言語変数を使用すると、ユーザが設定しているロケールに応じて、画面に表示する文言を切り替えることができます。intra-martがサポートしている言語は、日本語(ja)、英語(en)、簡体字中国語(zh-CN)の3言語です。CSVファイルから多言語をインポートすることも可能なので、決められたフォーマットに従って翻訳した文言を準備しておきましょう。


IM-BloomMakerでは、以下のように多言語変数を設定します。

  1. 多言語変数をロケールごとに定義する(例:open_dialog
  2. Application #1で、エレメントに多言語変数を設定する(例:$i18n.open_dialog

Case 5 アプリケーション間で文言を統一し、言語を切り替えたい

複数のアプリケーションで共通の文言を使用し、さらにユーザのロケールに応じて表示する言語を切り替える場合は、Accel Studioの多言語メッセージ定義を利用できます。


IM-BloomMakerでは、以下のように多言語メッセージを設定します。

  1. Accel Studioから取り込みたい多言語メッセージを選択する(例:sample-2
  2. Application #1で、エレメントに多言語変数を設定する(例:$i18n.sample-2
  3. Application #2で、エレメントに同じ多言語変数を設定する(例:$i18n.sample-2

英語や中国語(簡体字)以外にも対応言語を増やしたい

intra-martがサポートしている英語や中国語(簡体字)以外の言語を追加する場合は、必要なデータを準備し、ロケール情報の追加や画面サイズの調整など、別途カスタマイズが必要になる場合があります。

チュートリアル

一つのアプリケーション内で、変数・定数・多言語を設定する方法を、チュートリアルで具体的な操作を行いながら確認できます。

まとめ

画面に表示する文言は、用途に応じて変数・定数・多言語を使い分けることで、複数の画面やアプリケーションで文言を再利用したり、ユーザのロケールに応じて表示する言語を切り替えたりできます。また、IM-RepositoryやAccel Studioを利用すると、複数の画面やアプリケーションで使用する値を共通化できます。

まずは、画面に表示する文言について「実行中に変化するか」「複数の画面やアプリケーションで共通して使用するか」「多言語に対応するか」という観点から整理し、用途に合った設定を選択してみましょう。

intra-martでは、IM-BloomMakerをもっと知っていただくために、マニュアルやコンテンツなどを豊富にご用意しています。IM-BloomMakerの機能を最大限に発揮させるためにも、ぜひご活用ください。