ロジックとデザインの分離

Silverlightアプリケーションの開発モデルは、XAMLと呼ばれるアプリケーションの外観を作成するXMLベースの言語と、アプリケーションの動作を記述するC#やVisual Basicなどのプログラミング言語の2つの言語を使う手法が標準とされています。もちろん、すべてをプログラミング言語だけで記述することもできますが、複雑なデザインの初期化処理をプログラミング言語で記述すると、可読性が低くメンテナンスが困難になります。

例えば、従来のWindowsフォームでボタンを作成するC#コードは、次のようになるでしょう。インスタンスの生成、各種プロパティの設定を手続き的に行うため、複雑なデザインになるほどコードが長く汚くなってしまいます。さらに、デザイン用のコードとロジック用のコードが混在してしまうため、適切に管理しなければ混乱を招きます。

Windowsフォームのボタンを作成するプログラム

this.button1 = new System.Windows.Forms.Button();
this.button1.Location = new System.Drawing.Point(12, 12);
this.button1.Name = "button1";
this.button1.Size = new System.Drawing.Size(75, 23);
this.button1.TabIndex = 0;
this.button1.Text = "button1";
athis.button1.UseVisualStyleBackColor = true;

一方、XAMLではXMLの1要素が生成する1インスタンスに相当し、各種プロパティを属性で記述できるためUI構造の宣言が容易であると同時に、プログラムからコードを管理することも容易です。

Silverlightのボタンを宣言するXAMLコード

<Button x:Name="button1" Height="60" Width="120" Margin="8,8,0,0" Content="Button"/>

XAMLを利用することで、Silverlightアプリケーションのロジックとデザインを分離できます。これによって、デザインの変更があってもプログラムを修正する必要がなくなるため、誤ったプログラムの修正による新しいバグの発生などのリスクを避けられます。また、XAMLはXMLベースの言語なので、HTMLなどの経験がある一般的なWebデザイナーであればプログラミング言語よりも習得が容易です。

実質的に、XAMLは特別な言語ではなく、単にXMLでインスタンスの構造を表しただけです。Silverlightアプリケーションは、実行時にXAMLデータを読み込んで、宣言されている内容に従ってインスタンスを生成します。よって、XAMLの利用方法はUIのデザインだけに限られたものではなく、アプリケーションで利用するデータを事前に宣言するなど、より高度な利用方法も考えられます。

また、コンテンツ開発者であればXAMLをベクタグラフィックスで描画された図形の保存形式として利用することもできるでしょう。XAMLでは、曲線や長方形、楕円形、多角形などの図形を組み合わせることができ、これを専用のツールで読み書きすることができます。もちろん、XAMLで出力された図形はSilverlightでも再現できます。XAMLに対応しているデザインツールにはMicrosoftのExpression Designなどがあります。

ロジックとデザインの結合

マネージコードからXAMLによって宣言されたデザインを操作するには、XAMLの宣言に基づいてアプリケーション実行時にインスタンス化して取得する必要があります。アプリケーションは、配布時にXAMLファイルを一緒にパッケージ化することもでき、アプリケーションとは別にXAMLを配置することもできます。例えば、アプリケーション実行時にデザイン情報をサーバーに問い合わせ、サーバーがXAMLを返す仕組みを作れば、動的にUIを組み替えられます。

XAMLの読み込みは、指定したURIから対象のインスタンスに適用するApplicationクラスのLoadComponent()メソッドを使う方法と、XAMLの文字列表現からインスタンスを生成するXamlReaderクラスのLoad()メソッドを使う2通りの方法があります。前者のLoadComponent()メソッドは、Silverlightアプリケーションのパッケージやアセンブリに組み込まれたXAMLファイルの読み込みに用いられます。一方、XamlReaderを使えばプログラムなどから動的に生成したXAML文字列からでもインスタンスを生成できます。

XAMLによって生成されたインスタンスをプログラムから識別するにはName属性に指定された名前を使います。XAMLを記述するデザイナがロジックを記述する開発者と異なる場合、オブジェクトに設定する名前の命名規則を事前に定めておく必要があるでしょう。

プログラムとXAMLによって書かれたデザインが適切に結合できるように、開発者とデザイナのコミュニケーションを補佐する管理役が必要になります。次回は、開発組織がSilverlightの新しい開発モデルに適応するにはどうすればよいのか、Silverlightアプリケーション開発における開発者とデザイナの適切な役割分担について考えてみましょう。

著者プロフィール:赤坂玲音

フリーランスのテクニカルライタ兼アプリケーション開発者。主にクライアント技術、プレゼンテーション技術が専門。2005年から現在まで「Microsoft MVP Visual C++」受賞。技術解説書を中心に著書多数。近著に『Silverlight入門』(翔泳社)などがある。