独自の入力グリッドを持ったWPFアプリケーションの作成

ComponentOne Studio Enterprise 2011JのC1FlexGridコンポーネントを使ったWPFアプリケーションの作成

アプリケーションの作成

　では、さっそくアプリケーションを作成しましょう。作成するのは、非連結データの入力インターフェイスを持った簡単な入門用アプリケーションです。

　C1FlexGridコンポーネントは、8列10行のセルを持った表形式で、列ヘッダを2行持たせます。また、2行目のヘッダは同じテキストのセルを連結していますが、この処理はコードから行います。ボタンを1つ持ち、このボタンを押すとセルに入力されたデータをテキストファイルに保存します。

GUIのデザイン

　今回使用するのは、C1FlexGridコンポーネントとButtonコントロールのみです（C1FlexGridコンポーネントの設定は後述）。

GUIのデザイン

C1FlexGridコンポーネントの設定

　まずは、C1FlexGridコンポーネントを配置し、セルを設定します。C1FlexGridコンポーネントはデフォルトではセルが設定されていないので、プロパティを使って設定します。

　ツールボックスからC1FlexGridコンポーネントのアイコンをクリックし、ドラッグ＆ドロップします。配置したら、Window、Grid、C1FlexGridを適当なサイズにします。

　プロパティウィンドウで「Columns」プロパティを表示し、値欄の［...］ボタンを押します。コレクションエディタが起動するので［追加］ボタンをクリックし、列を追加します。

［追加］ボタンをクリック

　コレクションエディタの右ペインで「データ」をクリックして展開し、「Header」プロパティに「種類」と入力します。また、「レイアウト」をクリックして展開し、「HeaderHorizontalAlignment」プロパティに「"Center"」と入力します。これで、この列ヘッダに文字列を設定し、水平方向の文字位置をセンターに設定できました。

列ヘッダに文字列を設定し水平方向の文字位置をセンターに設定

　同じように「Column」オブジェクトを追加し、以下の「Header」「HeaderHorizontalAlignment」プロパティを設定します。

「Column」オブジェクトに「Header」「HeaderHorizontalAlignment」プロパティを設定

Headerプロパティ	HeaderHorizontalAlignmentプロパティ
"食品名"	"Center"
"エネルギー"	"Center"
"たんぱく質"	"Center"
"脂質"	"Center"
"炭水化物"	"Center"
"ナトリウム"	"Center"
"カルシウム"	"Center"

　コレクションエディタを閉じ、プロパティウィンドウに戻ったら、次は「Rows」プロパティを表示します。そして値欄の［...］ボタンを押すと、行を追加するコレクションエディタが表示されるので、［追加］ボタンを10回クリックして行を10行追加します。

［追加］ボタンで行を10行追加する

　非連結データの場合は、この時点でアプリケーションを実行するとセルにデータを入力できます。C1FlexGridコンポーネントは、それぐらい簡単に表形式の入力インターフェイスを構築できます。

アプリケーションを実行するとセルにデータを入力できる