Windowsアプリケーションの画面レイアウト方法

Windowsアプリケーション，特にそれが業務アプリケーションであった場合，ウィンドウの最大化／最小化ボタンが非表示に設定されていることは決して珍しいことではありません。ウィンドウが固定サイズであっても，数年前であればディスプレイの解像度はほとんどが1024×768であったため，さほど気にする必要はありませんでした。しかしながら，現在ではさまざまな解像度のディスプレイが存在しています。

Windowsアプリケーションではなぜウィンドウサイズを固定化してしまうのか。それは，画面のレイアウト方式として絶対配置が基本であるためです。X座標とY座標を指定して配置する絶対座標方式でさまざまなウィンドウサイズに対応するためには，ウィンドウサイズの変更に合わせてすべての配置を計算しなおす必要があります。このような処理はとても面倒であるため，絶対配置の場合にはウィンドウサイズを変更できないようにするという手法が多く使われるようになりました。

Silverlightアプリケーションの画面レイアウト方法

Silverlightアプリケーションでは，絶対配置と相対配置のいずれもサポートされていますが，よほどの理由がない限り相対配置を採用することをお勧めします。

Silverlightアプリケーションでプログラム上からWebブラウザのウィンドウサイズを変更することは不可能ではありませんが，すべきではありません。タブブラウザが一般化した現在では，WebブラウザのウィンドウはそのWebブラウザ上に表示されているWebページやWebアプリケーションで共有しているものです。ウィンドウは借り物であるということを忘れないようにしましょう。

Silverlightでは，相対配置のためのパネルとして以下の2つが用意されており，これらをうまく活用することでウィンドウサイズに依存しない画面レイアウトが可能です。

具体例から学ぶSilverlightの画面レイアウト

各パネルの使い方についてはSilverlightのドキュメントをご覧いただくとして，ここでは具体的な画面レイアウトの例を用いて，どのようなレイアウトがSilverlightで実現できるかをご紹介します。

画面の各領域を図4のように番号付けし，説明の際はその番号を用いることとします。

相対配置を上手に活用して画面リサイズに対応

ベクター描画を採用しているSilverlightでは，画面全体をそのまま拡縮するといった画面リサイズの方法も簡単に実現できます。しかしながら，画面の特定領域を広げる方法のほうが画面をより有効に活用できるため，一般的にはこちらの方法が多く用いられているようです。

具体例の場合，（⁠1）の高さと（2）の幅を固定サイズとし，（⁠3⁠）⁠，（⁠4⁠）⁠，（⁠5）を広げるという対応になります。Gridは行と列を定義してそこに要素を配置するパネルですが，その行と列の大きさの指定方法は以下の3つが存在します。

• （A）ピクセル数を指定して固定サイズとする
• （B）その行や列に配置された要素に必要な最小限の大きさとなるように指定する
• （C）Grid全体の何%の大きさと指定する

（1）と（2）を（A）か（B）の指定方法で固定サイズとし，（⁠3⁠）⁠，（⁠4⁠）⁠，（⁠5）の領域を（C）の指定方法で可変とすることで，先に説明したようなレイアウトを実現することができます。実際の画面のリサイズ結果は，図5のようになります。

折り返し表示でさらに領域を有効活用

図5を見ると，（⁠5）は画面のリサイズによって幅が広がったことで，リサイズ前はスクロールして確認する必要のあった部分がそのまま確認できるようになっています。しかし，（⁠3）については幅が広がった部分がそのまま空白となっており，相変わらず縦にスクロールしなければ確認できない項目が存在します。また，（⁠4）はリサイズ前の幅では項目の右側が切れてしまい，表示しきれない項目が存在します。

ComponentOne StudioにはC1WrapPanelというコントロールが収録されており，これを使用してレイアウトすることでリサイズによりできた余白を有効に活用することが可能です。C1WrapPanelは基本的には要素を垂直／水平方向に積み重ねて配置するStackPanelと同じレイアウト動作をしますが，右側や下側にその項目を表示できるだけの領域が存在する場合に限り，下端，あるいは右端に来た際に項目を折り返して表示するという動作をします。

C1WrapPanelを使って（3）と（4）の領域内の項目を配置した場合，リサイズによるレイアウト動作は図6のように変化します。