データバインディング

ツールバーからDatasetオブジェクトのアイコンを選択して配置

1

コンポーネントツールバーからDatasetオブジェクトを選択します。コンポーネントのアイコン上にマウスを置くと、コンポーネント名前がツールチップで表示されます。

コンポーネントツールバーでDatasetオブジェクトを選択した状態では、デザイン画面内でマウスポインタがDatasetオブジェクトのアイコンに変更されます。

2

デザイン画面内の任意の場所でマウスをクリックします。Datasetオブジェクトは画面に表示されないため、配置された位置は何の意味もありません。マウスをクリックすると、「Invisible Object」領域にDatasetオブジェクトが追加されます。

「Invisible Object」領域が表示されない場合は、デザイン画面上でマウスの右ボタンをクリックした後に表示されるコンテキストメニューから「Show Invisible Object Area」項目を選択します。

Dataset Editor実行

Datasetオブジェクトで処理するデータカラムの形式とデータを指定できるツールを提供します。Dataset Editorを実行して適切なカラムを作成し、データを追加することができます。

1

「Invisible Object」領域でDatasetオブジェクトをダブルクリックします。

2

プロパティウィンドウの左側に「Dataset Editor」が実行されます。使用しないときは、右の「x」ボタンをクリックしてウィンドウを閉じます。「Dataset Editor」はDatasetオブジェクトをダブルクリックするか、メニューの[View>Dataset Editor]を選択すると、ウィンドウを再表示します。

Datasetオブジェクトにカラムを追加

Datasetオブジェクトにデータを追加には、入れるデータの情報を設定する必要があります。それをカラムと言い、Dataset Editorでカラムを追加することができます。

1

「Invisible Object」の領域でDatasetオブジェクトをダブルクリックします。

2

プロパティウィンドウの左側に「Dataset Editor」が実行されます。「Dataset Editor」の中間にある「Columns」項目から「カラム追加」アイコンをクリックします。

3

「Columns」項目に新しいカラムが追加されます。関連するプロパティ値(id、type、sizeなど)は該当するセルをマウスでクリックした後に変更することができます。

4

2つのカラムを追加して、id値を「code」、「item」に変更します。カラムを追加すると、下にある「Rows」項目に追加したカラムの情報が表記されることを確認することができます。

Datasetオブジェクトにデータを追加

カラム情報が作成されると、データを追加することができます。

1

「Invisible Object」領域でDatasetオブジェクトをダブルクリックします。

2

プロパティウィンドウの左側に「Dataset Editor」が実行されます。「Dataset Editor」の下にある「Rows」項目で「データ追加」アイコンをクリックします。

3

データが追加されると、該当するセルをマウスでクリックして、必要な値を入力します。

GridコンポーネントにDatasetオブジェクトをバインド

コンポーネントとDatasetオブジェクトをバインドすることは、データを共有するように接続することです。バインドされた状態で、Datasetオブジェクトのデータが追加もしくは変更されると、コンポーネントに表示されるデータも変更されます。逆に、コンポーネントでデータを追加、削除、変更すると、Datasetオブジェクトのデータも変更されます。

1

デザイン画面にGridコンポーネントを配置します。

2

「Invisible Object」領域でDatasetオブジェクトをマウスの左ボタンを押して選択し、ドラッグしてデザイン画面上のGridコンポーネント上に取っていきます。

3

Gridコンポーネント上で押していたマウスの左ボタンを離すと自動的にデータバインドが処理されます。何も表示されなかったGridコンポーネントはDatasetオブジェクトに設定したカラムの情報とデータが表示されます。

4

変更された内容を保存して、ツールバーの「QuickView」項目を選択します。nexacroブラウザが実行されて、画面にGridコンポーネントが表示され、バインドされたデータも確認することができます。

EditコンポーネントにDatasetオブジェクトをバインド

Gridコンポーネントの場合には、Datasetオブジェクトのカラム情報とデータを表形式で表示します。Editコンポーネントのように一つのデータのみを表示できる場合には、選択した行から目的のカラム情報を選択して表示します。

1

デザイン画面にEditコンポーネントを配置します。

2

「Invisible Object」領域でDatasetオブジェクトをマウスの左ボタンを押して選択し、ドラッグしてデザイン画面にあるEditコンポーネント上に取っていきます。

3

Editコンポーネント上で押し続けていたマウスの左ボタンを離すと、[Bind Item]設定画面が表示されます。[Bind Item]設定画面では、EditコンポーネントでバインドするプロパティとDatasetオブジェクトでバインドする列を選択します。

Editコンポーネントはnexacro studioのデザイン画面でバインドされた値が表示されません。アプリケーションの実行時に選択された行(Row)の情報に基づいて値を表示します。

4

変更された内容を保存して、ツールバーの[QuickView]項目を選択します。nexacroブラウザが実行されながら画面にEditコンポーネントが表示され、バインドされた値を確認することができます。行(Row)の情報を変更していなかったので、最初の行(Row)のデータである「Toy」が表示されます。

GridコンポーネントとEditコンポーネントにDatasetオブジェクトをバインド

EditコンポーネントにDatasetコンポーネントをバインドする場合には、行(Row)の情報に基づいて表示されるデータが変わります。今回はGridコンポーネントとEditコンポーネントに同じDatasetオブジェクトをバインドしてGridコンポーネントの行(Row)を選択するたびにEditコンポーネントに表示される値が変わる例を説明します。

GridコンポーネントとEditコンポーネントにDatasetオブジェクトをバインドする方法は、前の例を参照してください。

GridコンポーネントにDatasetオブジェクトをバインド

EditコンポーネントにDatasetオブジェクトをバインド

1

デザイン画面にGridコンポーネントとEditコンポーネントを配置します。

2

Datasetオブジェクトを選択して、GridコンポーネントとEditコンポーネントにバインドします。

3

変更された内容を保存して、ツールバーの[QuickView]項目を選択します。nexacroブラウザが実行されて、画面にGridコンポーネントとEditコンポーネントが表示され、バインドされた値を確認することができます。行(Row)の情報を変更していなかったので最初の行(Row)が選択されており、Editコンポーネントには、「Toy」が表示されます。

4

マウスでGridコンポーネントの2番目の行(Row)をクリックします。Editコンポーネントの値が変わることを確認することができます。再び最初の行(Row)を選択すると、Editコンポーネントの値が異なります。