PowerPointプレゼンテーションと同様のことをSilverlightでやってみる

詳細はゆくゆく紹介していこうと思いますが、現在、とあるプロジェクトで、PowerPointのプレゼンテーションと同様なことをSilverlight 1.0で実行するというアプリケーションを作っています。

プレゼンテーションのファイル内容を分析して・・・などと難しいことは考えず、スライドで動きがないところは、Imageで静止画像を利用し、ビデオが必要なところはMediaElementで、スライド切り替わりやアニメーションはStoryboardでというシンプルな構造でやっています。これがやってみると結構面白いもので、ブラウザの全画面表示にすると、もはやSilverlightで実行しているように見えないのも面白いです。

似たようなことにチャレンジする方がいるかもしれないので、次のような作業が可能であることを知っておくと、時間を短縮できるでしょう。

（１）PowerPointプレゼンテーションの再利用

・すべてのスライドは、JPEGあるいはPNG形式でエクスポートできる（PowerPoint 2007だと960x720の解像度になる）
・プレゼンテーション内の日本語をコピーして、Expression Blend 2に貼り付けて、TextBlockをPathに変換することができる
・日本語部分のコピーをする際に、貼り付け直後に半角の文字を入れると消える確率が下がる
・複数の色を用いているリッチテキストは、色別にコピーする方がよい(TextをPathに変えると色情報がなくなるから）
・図の部分は、[図の保存]から静止画にするか、コピーした上で、Expression Designに貼り付けてXAMLをエクスポートする際にできあがる静止画を利用して使う(この際に、出来上がった画像ファイルを使い、XAMLそのものは使わない)

（２）単純なアニメーションの再現

・フェードインするようなものは、Opacityプロパティを0%から100%の間で変化するStoryboardを作ると簡単

（３）クリッカブルエリアの作成

・複数のオブジェクトを含む領域全体としてイベントを拾う場合、Canvasでグループ化し、Canvas内のオブジェクトは、個別にIsHitTestVisible=falseと設定して、event bubblingを避ける
・マウスイベントに反応するエリアは、CanvasのFillプロパティで黒色などを選択しておき、アルファ値を0にして、透明でイベントに反応する場所を作る

・・・

単純に作ると、１つのXAMLファイルと１つのJavaScriptの中で作業を完結できると思います。ゆくゆくサンプルのひとつとして公開したいと思います。