よりユーザフレンドリーなアプリケーションの開発へ

作成した動くボタンをクリックしてみます。するとクリック可能な場合と不可能な場合があることがわかります。これは、前ページで作成したボタンは拡大縮小を繰り返すアニメーションを行っているだけでなく、OnClickの効果範囲も同時に拡大縮小させているためなのです。

従来のWindowsフォームでは、ボタンの見た目が拡大縮小してもOnClickの効果範囲は変化しませんでした。しかし、WPFではクリックして反応が得られる範囲をボタンの見た目と連動させることができます。

これを利用すると、例えば画像にスピーカーの写真を使い、リズムに合わせて拡大縮小する「スピーカーボタン」を作ることができます。これは、ボタンの場所がわかりやすくなるだけでなく、その意味も直感的にユーザが理解できるということなのです。

このようなUIが実装可能な点は、ユーザがアプリケーションをより使いやすくなるだけでなく、開発者にとってもオリジナルのアイデアに近い開発ができるというメリットにつながります。これこそがWPFの魅力の1つといえるでしょう。

さらにWPFはレイアウトの考え方が刷新され、よりスケーラブルな配置ができるようになりました。実はWin32をはじめとする従来のアプリケーションでは、レイアウトという概念がほとんどなく、キャンバスのx、y座標上にコントロールを配置していく必要がありました。つまり開発者はウィンドウのサイズ変更とディスプレイのDPI設定を考慮した上で、コントロールを配置する必要があったのです。

一方、WPFの場合はレイアウトを複数の方法で実装可能で、コンテンツに応じたサイズ調整や位置の管理を行うことができます。そこで重要になってくるのが「パネル」という概念です。

WPFのレイアウトシステムとパネル

例えば新規にWPFアプリケーションを作成した際、XAMLの中には<Grid>タグが含まれています。Gridはその名の通り、コンポーネントやグラフィックス要素などを行と列で構成された「格子状」に設置していくためのパネルです。パネルには、このほかにも「Canvas」や「DockPanel」「StackPanel」「WrapPanel」などがあります。

これらパネルの挙動を把握するには、実際のアプリケーションを開発してしまうのが早道です。新規プロジェクトを作成したら、ツールバーから「StackPanel」コントロールをドラッグし、デザイナの上にドロップします。すると、Gridの中にStackPanel領域が出現します。ここで、 StackPanel領域に対してButtonコントロールを適当な数（今回は6個）置いてみると、その位置が勝手に決められることに気づきます。

さらに、XAML エディタで「<StackPanel>〜</StackPanel>」までの箇所を「<WrapPanel>〜<WrapPanel>」と書き換え、F5キーを押して実行します。実行状態でアプリケーションのウィンドウのサイズを変更すると、Buttonコントロールの配置が、ウィンドウの大きさに合わせて自動的に調整されることがわかるでしょう。

このようにパネルを使うことで、アプリケーションウィンドウの変更によって表示要素の影響を指定できるのです。さらに、パネルそのものを他のパネル要素としてホストすることが可能なことから、パネルのグループ化や要素の階層構造化にも対応できます。

このようなレイアウトの設計や変更が容易になるというメリットを活用するためには、WPFにおける新しいレイアウトの概念の理解が不可欠です。しかし「柔軟なレイアウトを持つアプリケーションが制作できる」という価値は、非常に高いといえるでしょう。 次のページ