DrawingSurface：Silverlight 5 Beta

  • Article

MIX11 で Silverlight 5 Beta がアナウンスされました。Silverlight 5 の新機能に「GPU-accelerated XNA-compatible 3D 」があります。Silverlight 5 のコントロールに DrawingSurface が追加され、そこに XNA 互換の API で 3D が描画できるのです。

WPF の Viewport3D と違って直接モードで描画するので、その中の 3D オブジェクトをコントロールのように使うことはできません。そういう用途には 3D 効果を使うべきです。GPU のサーフェイスを直接描画するという意味ではWPF の D3DImage に似ています。しかし D3DImage では他のプロセスで描画された結果を表示することしかできませんでしたが、 DrawingSurface には Silverlight 内で XNA を使って描画できるのです。

とはいえ、非常にプリミティブな機能しかサポートされていないので、頂点バッファ、頂点シェーダー、ピクセル シェーダーを実装しなければなりません。Model のような便利なクラスはありません。

①まず、開くページの<object>タグに以下の行を追加します。

<param name="EnableGPUAcceleration" value="true" />

②次に、XAML で DrawingSurface を宣言します。

<DrawingSurface Draw="DrawingSurface_Draw" Width="500" Height="500" />

③そして、背後コードの DrawingSurface_Draw メソッドで XNA で描画します。

void DrawingSurface_Draw(object sender, DrawEventArgs e)
{
    // 頂点バッファは GraphicsDevice に設定済み
    // コンパイルした頂点シェーダーとピクセルシェーダーから座標変換行列を作成済み   
    e.GraphicsDevice.Clear(ClearOptions.Target | ClearOptions.DepthBuffer, Color.Transparent, 1.0f, 0);
    e.GraphicsDevice.DrawPrimitives(PrimitiveType.TriangleList, 0, 1);
    e.InvalidateSurface();  
}

【4/27追記】 詳しくは、MSDN Library の 3-D Graphics Overview と Walkthrough: Creating and Animating a 3D Textured Cube in Silverlight 参照してください。