ステップ2 - Kanzi Studio でデータソースを使用する¶

このチュートリアルのこのステップでは、前のステップで作成したデータソースプラグインを使用して、Kanzi アプリケーションのデータを XML ファイルから取得します。

データソースからデータオブジェクトを作成する¶

このセクションでは、Kanzi Studio プロジェクトを、チュートリアルの前のステップで作成したデータソースプラグインからデータを受け取る準備をします。次に、プラグインを使用してデータソースからデータオブジェクトを作成します。次のセクションでは、これらのデータオブジェクトにアプリケーション内の異なるノードのプロパティをバインドし、そのデータソースからのデータを使用します。

データソースからデータオブジェクトを作成するには：

Kanzi Studio Quick Start ウィンドウで、Examples をクリックします。Data sources チュートリアルの横にある Open をクリックし、Start project を選択します。
Library > Kanzi Engine Plugins で XML_data_source プラグインを選択し、Properties で Is Enabled プロパティが有効になっていることを確認してください。

ヒント

Kanzi Engine プラグインをプロジェクトで有効または無効にするには、Is Enabled プロパティを使用します。
Library > Kanzi Engine Plugins で XML_data_source プラグインを右クリックし、Update Kanzi Engine Plugin を選択します。

プラグインのソースコードを変更し、Visual Studio でプラグインをビルドするたびに、プラグインのメタデータを更新する必要があります。プラグインのメタデータを更新し、Library でプラグインを選択すると、Properties の Metadata Last Read From プロパティが、Kanzi Studio が読み込んでメタデータを読み取ったプラグインの .dll ファイルを示します。
Window のメインメニューで Data Sources を選択します。

Data Sources ウィンドウを使用して、プロジェクト内のデータソースを作成、設定、削除し、データソースからデータオブジェクトをプロジェクト内のノードやリソースに接続します。
Data Sources ウィンドウで Create Data Source をクリックし、このデータソースの名前を入力して、OK をクリックしてデータソースを作成します。

Data Source Type プロパティを使用して、使用したいデータソースのタイプを設定します。このチュートリアルの前のステップでデータソースを1つだけ定義したため（XML_data_source）、そのデータソースのみを選択できます。

たとえば、データソースに Cluster という名前を付けてください。
Cluster データソースの隣にある Data Sources ウィンドウで、をクリックし、XML Data Source File プロパティを Cluster.xml ファイルに設定します。ファイルは Application/bin ディレクトリにあります。

データソースプラグインで XML Data Source File プロパティを作成しました。

このプロパティを使用して、どの XML ファイルからデータを取得するかをデータソースプラグインに指示します。

Cluster.xml は、このチュートリアルで作成するアプリケーションのデータソースです。前のステップで作成したデータソースプラグインは、このファイル内のデータからデータオブジェクトを作成します。
Cluster データソースの隣にあるをクリックして、XML_data_source データソースプラグインを使用し、Cluster.xml ファイルをロードして、そのファイルの内容からデータオブジェクトを作成します。

プラグインがデータオブジェクトを作成すると、それらは Data Sources ウィンドウに表示されます。データソース内のデータが変更されるたびに、Kanzi Studio Preview で変更を確認するには、をクリックしてデータソースプラグインにデータソースをリロードし、データオブジェクトを更新するよう指示します。

アプリケーションでデータソースのデータを使用する¶

このセクションでは、ノードの位置を設定し、Text Block 2D ノードに値を表示するプロパティを、前のセクションで作成した Cluster データソースのデータオブジェクトにバインドします。

アプリケーションでデータソースのデータを使用するには：

Node Tree で RootPage ノードを選択し、Properties で Data Context プロパティを追加し、前のセクションで作成したデータソースに設定します。

Data Context プロパティを設定することで、アプリケーションがどのデータソースからデータを受け取るかを指定します。ノードに Data Context プロパティを設定すると、そのノードのすべての子ノードは Data Context プロパティの値を継承します。子ノードの1つに異なるデータコンテキストを使用したい場合は、そのノードに Data Context プロパティを追加し、使用したいデータコンテキストに設定します。

ヒント

データコンテキストを設定するには、Data Sources ウィンドウからデータオブジェクトをドラッグし、そのデータコンテキストを割り当てたい Node Tree のノードにドロップします。
Node Tree で Gauges > SpeedNeedle ノードを選択し、Properties で + Add Binding をクリックし、Binding Editor で設定します:
- Property から Render Transformation へ
- Property Field から Rotation Z へ
- Expression へ
```
{DataContext.gauges.speed}-140
```
Save をクリックします。

このバインディングを使用すると、Cluster.xml 内の speed 要素によって設定された値に基づいて SpeedNeedle ノードを回転させます。データソースから提供される値から140を引く必要があります。これにより、speed データオブジェクトの値が0のときに、針がゲージの値0に正しく位置します。
FuelNeedle ノードと BatteryNeedle ノードに対して前のステップを繰り返します。
- Binding Editor の FuelNeedle に Expression を設定します。
```
{DataContext.gauges.fuel}-39
```
- Binding Editor の BatteryNeedle に Expression を設定します。
```
-{DataContext.gauges.battery}+39
```
Node Tree で、Gauges > SpeedView > SpeedValue ノードを選択し、Data Sources ウィンドウから Cluster > gauges > speed データオブジェクトをドラッグして、Properties の Text プロパティにドロップします。

単一フィールドを持つプロパティにデータオブジェクトをドラッグアンドドロップすると、Kanzi Studio はそのプロパティの値をドロップしたデータオブジェクトにバインドするバインディングを作成します。SpeedValue ノードの Text プロパティは、現在 Cluster データソースから取得されています。
前のステップを SpeedUnit と Distance に対して繰り返します。
- Data Sources の Gauges > SpeedView > SpeedUnit ノードに対して、Cluster > gauges > speed > unit データオブジェクトを Text プロパティにドラッグアンドドロップします。
- Data Sources の Navigation > Stack Layout 2D > Distance ノードに対して、Cluster > navigation > directions > distance データオブジェクトを Text プロパティにドラッグアンドドロップします。
テキストエディタで Application/bin/Cluster.xml ファイルを開き、speed、fuel、battery、または distance のXML要素の値を変更します。ファイルを保存すると、このチュートリアルの前のステップで作成したデータソースを定義した Kanzi Engine プラグインがデータオブジェクトを更新し、更新された値を Kanzi Studio Preview に表示します。

データソースのデータを手動でリロードしたい場合は、Data Sources ウィンドウでリロードしたいデータソースの隣にあるをクリックします。

Kanzi Studio は、そのデータソースのデータをリロードし、データオブジェクトとその値を更新します。

ヒント

デフォルトで、Preview は Kanzi Studio ウィンドウがフォーカスされているときのみコンテンツを更新します。Kanzi Studio ウィンドウがフォーカスされていないときに Kanzi Studio プロジェクトの変更を確認するには、Kanzi Studio で Edit > User Preferences を選択し、Advanced タブで Update Preview when Kanzi Studio is not focused 設定を有効にします。

データソースのデータを使用してステートを制御する¶

このチュートリアルアプリケーションでは、ステートマネージャーがターンインジケーターとナビゲーション情報を制御します。このステップでは、これらのノード内のステートマネージャーのコントローラープロパティの値をバインドし、データソースからのデータを使用してアプリケーションの状態を変更できるようにします。

データソースのデータを使用してアプリケーションステートを制御するには：

Node Tree で Gauges > TurnIndicatorLeft ノードを選択し、Data Sources ウィンドウから Cluster > turnindicator > left データオブジェクトをドラッグして、Properties の XMLdatasource.TurnIndicator プロパティにドロップします。

XMLdatasource.TurnIndicator コントローラープロパティは、ブール型のデータ型です。Cluster.xml ファイル内の turnindicator > left XML 要素の値を true と false に設定することで、ターンインジケーターをオンおよびオフに切り替えることができます。
前のステップを Gauges > TurnIndicatorRight ノードに対して繰り返します。Cluster > turnindicator > right データオブジェクトを使用します。
Node Tree で、Navigation > Stack Layout 2D > VisualDirections ノードを選択し、Data Sources ウィンドウから Cluster > navigation > directions > visualdirections データオブジェクトをドラッグし、Properties の XMLdatasource.VisualDirections プロパティにドロップします。

XMLdatasource.VisualDirections コントローラープロパティのデータ型は整数で、このノードを制御するステートマネージャーには2つの状態があります。ドライバーに左折を指示するには、XMLdatasource.VisualDirections プロパティの値を 0 に設定して LeftTurn 状態を使用し、右折の場合は 1 の値を設定して RightTurn 状態を使用します。
前のステップを Navigation > Stack Layout 2D > Instructions ノードに対して繰り返します。これにより、運転経路の指示が提供されます。Cluster > navigation > directions > instructions データオブジェクトを XMLdatasource.NavigationInstructions プロパティにドロップします。

XMLdatasource.NavigationInstructions コントローラープロパティのデータ型は整数で、このノードを制御するステートマネージャーには4つの状態があります。各状態には異なる指示が含まれています。

Cluster.xml データソースからクラスターを制御できるようになりました。テキストエディタを使用して Cluster.xml ファイルの値を変更し、Cluster.xml ファイルを保存し、Kanzi Studio Preview と Data Sources ウィンドウに更新されたデータオブジェクトとその値を表示します。

Previous step Next step