アプリケーションのテーマ設定¶
テーマを利用することで、単一の Kanzi Studio プロジェクトを、バリエーションとなる複数の製品に利用することができます。
例えば、単一のプロジェクト内で、異なる車種のための Kanzi アプリケーションや、各車種のための異なるビジュアルテーマを定義することができます。
アプリケーションのテーマを作成するには、テキスト、テクスチャ、ブラシ、マテリアル、スタイルなどのさまざまなリソースを作成および使用し、アプリケーションで使用したいテーマのレイアウトを作成します。
Theme Group は Themes のコレクションを定義します。Theme Group 内の各 Theme は、アプリケーションの外観と操作感を定義します。Kanzi Studio プロジェクトでは、複数の Theme Group を定義でき、それぞれが複数の Themes を含みます。Kanzi アプリケーションでは、各 Theme Group から1つの Theme を一度に適用できます。例えば、1つの Theme Group を使用して、ハッチバック、ミニバン、ピックアップ、セダン、SUVなどの車のモデルを定義し、別の Theme Group を使用して、クラシック、デジタル、モダン、スポーツなど、各車モデルのインターフェースの外観を定義できます。
Kanzi は、各 Theme に対して個別の値を保持するリソースIDを使用して、テーマ付きリソースを間接的に使用します。Library > Themes では、Kanzi Studio プロジェクト内のすべての Theme Group アイテムを確認できます。
アプリケーション用のテーマを作成するには:
Theme Group を作成し、Theme で定義したいプロジェクト内のリソースを追加します。プロジェクトで使用されるリソースを Theme Group に追加する を参照してください。
各 Theme が使用するリソースを作成してインポートします。Theme のリソースを設定する を参照してください。
Preview で Theme を表示します。Preview でテーマを表示する を参照してください。
Theme で使用されるリソースを kzb ファイルにエクスポートします。Themes のエクスポート を参照してください。
Kanzi アプリケーションのテーマ設定方法を学ぶには、チュートリアルを完了してください。チュートリアル: アプリケーションにテーマを適用する を参照してください。
プロジェクトで使用されるリソースを Theme Group に追加する¶
Kanzi アプリケーションのテーマを作成し始めるには、テーマ化したいリソースを Theme Group に追加します。リソースを Theme Group に追加する最も簡単な方法は、Node Tree のノードで Add Resources to a Theme Group コマンドを使用することです。
Node Tree で Add Resources to a Theme Group コマンドを使用すると、Kanzi Studio はノードおよびそのツリー内のノードごとにリソースIDを自動的に作成し、各ノードがそれらのリソースIDを使用するように設定します。
プロジェクトで使用されるリソースを Theme Group に追加するには：
Node Tree で、Screen ノードを右クリックし、コンテキストメニューで Add Resources to a Theme Group を選択します。
Add Resources to a Theme Group コマンドを Screen ノードで使用すると、Kanzi Studio により、プロジェクト内のすべてのリソースを Theme Group に追加し、それぞれの Theme でその外観を変更することができます。選択したノードまたはプレハブとそのツリーからのみリソースを Theme Group に追加するには、そのノードまたはプレハブを右クリックし、Add Resources to a Theme Group を選択します。
Add Resources to a Theme Group ウィンドウセットで:
リソースを追加したい Theme Group に Theme Group を移動します。まだ Theme Group がない場合は、<Create New> を選択してください。
Theme Group は、Themes のコレクションを定義します。
Add Resources to a Theme Group ウィンドウに表示したいリソースタイプを選択します。
例えば、テキストと画像リソースのみを表示するには、
と 
を選択します。
選択したタイプのすべてのリソースを一覧表示するテーブルで、選択した Theme Group に追加したいリソースの横にあるチェックボックスをクリックします。リソースIDを変更するには、リソースIDをダブルクリックして新しい名前を入力します。
Kanzi Studio は、Text プロパティに同じ値を使用する Text Block ノードのための単一のリソースIDを作成します。これらのノードは、Theme Group 内で同じエントリを共有します。
Add をクリックします。
Kanzi Studio は、すべてのリソースからリソースIDを作成し、それらを選択した Theme Group に追加します。Theme Group アイテムは、Library > Themes で見つけることができます。Theme Group では、Themes を作成し、どのリソースをどの Theme に使用するかを設定できます。Theme のリソースを設定する を参照してください。
Theme のリソースを設定する¶
プロジェクトで使用するリソースを Theme Group に追加した後、Theme を作成し、各 Theme で使用するリソースを定義できます。
Theme のリソースを設定するには、
各 Theme で使用したいリソースを作成し、インポートします。例えば：
Library で、アプリケーション内の各テーマの外観を設定するブラシ、スタイル、マテリアルなどのリソースを作成します。
Prefabs で、アプリケーション内の各テーマのUI要素を配置するレイアウトを作成します。
Assets で、Theme で使用したい2Dおよび3Dアセットをインポートします。
Library > Themes で、Theme を定義したい Theme Group をダブルクリックします。
Theme Editor で Create Theme をクリックし、Theme に名前を付けます。
前のステップで作成したテーマの列で、各リソースのセルをダブルクリックし、その行のリソースIDに使用したいリソースを設定します。
Theme のリソースまたは値を選択しない場合、Kanzi はその Theme のデフォルトのリソースまたは値を使用します。デフォルト値は Default Value 列に記載されています。
黒いセルは、デフォルト値を使用しているエントリを示します。
テキストリソースに空の文字列を使用するには、値を入力し、その値を削除してから、Enter キーを押します。
灰色のセルは、空の文字列を使用しているエントリを示します。
ファイルシステムからリソースを使用するには、リソースを設定したいセルで < URL > を選択し、
file://の後にファイルシステム内のリソースへの絶対パスまたは相対パスを入力します。
Theme でリソースのためにkzbファイルURLを使用する¶
プロジェクトで使用するリソースを Theme Group に追加した後、kzbファイルのURLを使用して、別の Kanzi Studio プロジェクト内のリソースを指すことができます。
Theme でリソースとしてkzbファイルのURLを使用するには：
Library > Themes で、Theme を定義したい Theme Group をダブルクリックします。
Theme Editor で Create Theme をクリックし、Theme に名前を付けます。
前のステップで作成した Theme の列で、kzbファイルURLを使用したいリソースのセルをダブルクリックし、ドロップダウンメニューで < URL > を選択します。
セルに、使用したいリソースのkzbファイルURLを入力してください。
例えば、別の Kanzi Studio プロジェクトからフォントを使用するには、そのフォントを指すkzbファイルのURLを入力します。
Preview でテーマを表示する¶
アプリケーションの Theme を定義する際、Preview を設定して、アプリケーションに Themes を切り替えるためのコントロールを追加せずに Theme を表示することができます。
Preview で Theme を表示するには：
Dictionaries で Locales and Themes をクリックして、Localization Table と Theme Group アイテムの表示を有効にし、各 Theme Group について、Preview で見たい Theme を選択します。
Library で、表示したい Theme を含む Theme Group を選択し、Properties でその Theme に Selected Theme プロパティを設定します。
