グリッドを使ってWindowsフォームにコントロールをレイアウトする

ComponentOne Studio2010のC1Sizerコントロールを使った.NETアプリケーションの作成

フォームの作成

　では、さっそくフォームをデザインしてみます。今回は、このC1Sizerコントロールを使って、治療費の領収証のようなものを作ってみました。

GUIのデザイン

　フォームにC1Sizerコントロールを配置し、グリッドエディタで15行8列のグリッドを作成し、その中にテキストボックスとラベルをたくさん組み込んでいます。

　また、フォームの右下部分にはグループボックスを配置し、その中に、さらにラベルとテキストボックスを配置していますが、この配置はグループボックス内のレイアウトなので、通常のフォームのコントロール配置と同じ方法を使っています。実際にコントロールを配置してみると一目瞭然なのですが、C1Sizerコントロールのグリッドに配置した方がぐっとレイアウトしやすいことが分かります。

　なお、試しにコードからコントロールを作成してグリッドに配置する機能を使い「Form2」を作ってみました。「Form2の表示」ボタンは、そのフォームを呼び出すのに使用します。

フォームデザイン

グリッドのデザイン

　C1Sizerコントロールを配置し、グリッドを設定してテキストボックスやラベルコントロールを配置していきます。

1. 最初に、フォームへC1Sizerコントロールを配置し、Dockプロパティを「Fill」にします。
2. スマートタグから［グリッドの編集］を選び、グリッドエディタを表示します。
3. 「行」のページで［挿入］ボタンをクリックし16行（「行15」まで）に、「列」のページでは9列（「列8」まで）にします。フォームに細かいグリッドが作成されます。
   フォームにグリッドを設定する

   
4. 列の境界線をドラッグして、サイズを調節します。
5. ツールボックスからLabelコントロールをセルにドラッグ＆ドロップします。
   Labelコントロールをセルにドラッグ＆ドロップ

   
6. Labelコントロールの「AutoSize」プロパティを「False」にすると、Labelコントロールのサイズが自動的にセルにスナップされ、セル内に収まります。この状態で、グリッドの「行」の高さを変えると、自動的にLabelコントロールの高さも変化します。
   Labelコントロールがセル内に収まる

   
   行の高さに応じてLabelコントロールの高さも揃えられる

   
7. TextBoxコントロールの場合は、MultiLineプロパティを「True」にした複数行編集モードにすると、コントロールの高さを自由に設定できます。
   複数行編集モードのテキストボックスは高さを変えられる

   

　このように、レイアウトしたい位置にコントロールをツールボックスからセルにドラッグ＆ドロップすれば、自動的に近傍のセルにスナップして配置されていきます。コントロールの場所を移動させたければ、そのままコントロールをドラッグするだけです。グリッドを使ったレイアウトは、とても素早くフォームをデザインできます。

作成した帳票形式のフォームと実行画面