今回作成したムービープレイヤーは、画面上にアイコンが表示され、クリックしたコンテンツが全面に表示され見ることができるというもの。シンプルなアプリケーションにしてみました。XAML上に配置されているオブジェクトは配置した順番に深度を持っていますので、ロールオーバーするときにアイコンのCANVASが最前面にくるような仕組みにしています。これはFlashでいうswapDepthsのようなものですね。これはBlend上ではコントロールできないので、MouseEnterイベントによりJavaScript側で指定します。
ムービーはYouTubeのようにフルスクリーンで再生することもできるようにしました。このとき
var silverlightPlugin = sender.getHost();
silverlightPlugin.content.fullScreen = !silverlightPlugin.content.fullScreen;
このような2行のJavaScriptで実行するだけでブラウザビューからモニタ画面最大に拡大しますが、これはSilverlightの領域が画面いっぱいになっているだけ。そのままだとムービーはストレッチされずにモニターの左肩に寄ってしまうので、フル画面にあわせたサイズにMediaElementのCANVASを拡大させる必要があります。このあたりはFlashにもできることですが、指定した一部の領域を拡大する手法のFlashとは少し考え方が違います。フル画面にストレッチしても映像の劣化が少なく、高品位なクオリティを保てるSliverlightのムービーで使うメリットは大きいかもしれませんね。
アイテムにマウスがロールオーバーするとマウス直下のオブジェクトが一番上になる仕組み。XAMLのCANVASにはZindexという属性があるので、その数字をJavaScript内で指定することでFlashのswapDepths的な動きを表現した
フル画面で再生ができる
Silverlightで使用するmwvファイルは、Expressionシリーズ中の「Media Encoder」で作成しました。これがまたとても操作が簡単！ しかもテンプレートがたくさん付属しており、ただ再生させるだけの別窓を作成したいというだけならば、いくつかの既製のスキンを使うことで、wmvファイルだけでなくXAMLもJavaScriptも含めたサイトのまるごと生成が可能です。Silverlightの普及率が上がれば、かなりの高品位なムービーをごく簡単に配信することができそうですね。
■ボタンひとつで書き出したVideoサイト（Silverlightが必要です）
Expression Media Encoderは最大180日試用できるバージョンをダウンロードできる（Expressionユーザーは無料）。操作はかなりシンプル。A/B比較モードはエンコード前とエンコード後の画像の違いを見比べることが可能だ
長い間Flashを使ってきた身としては、現在デファクトスタンダードともいえるFlashコンテンツを、わざわざBlendやSilverlightを使って制作するとなれば、どういうメリットが出てくるのかを考えざるを得ませんでした。
最初は「Flashと同じようなソフトウエアをつくってどうするんだろう？」とも思ったりしたのですが、三次元データを扱えるということだけをみても、まったく異なるソフトだといっていいのではないでしょうか。
サンプルを見る限り、自由な細かい演出もできるようなので、使いこなせばFlashに負けないコンテンツを制作することができそうな感じで使いこなしてみたい気がしています。
「obj」データを読み込んで3DデータをライブにコントロールできるのもFlashでは簡単にできない表現なので、今までのインターフェイスの固定概念にないコンテンツ制作ができそうですね。
ビジネス的に使えるかどうかが今後もっとも気になるところであり、プラグインなどがもっと普及してくれば、開発などもしやすそうなので、かなり使えるツールになると期待しています。
Silverlightコンテンツを作成できる新バージョン「Expression Blend 2」は、今春の発売を目指して目下開発中です。現在マイクロソフトのWebサイトでは、自由に使うことのできる「Expression Blend 2 December Preview」（英語版）を無償で配布しています。当記事をみて興味の湧いた人はぜひダウンロードしてご自身でExpression Blendの世界を体験してください。
2008年2月29日発売の弊社発行「web creators2008年4月号 vol.76」に掲載した特別記事「CSSレイアウトでWEBサイトを自由自在につくろう!」の第2回の記事で紹介したサンプルデータとExpression Web評価版は下記よりダウンロードできます。
サンプルデータの使用について
※すべてのデータの著作権はそれぞれの著者・制作者および著作権者に帰属します。※本書のサンプルは記事の内容を理解するための参照用に使用されるものです。そのため、サンプルに含まれているHTMLファイル、CSSファイル、画像ファイルなどすべてのファイルは、商用・非商用にかかわらずほかの用途での使用、配付は一切禁止します。
※データの制作環境の違いにより、開けない、もしくは正しく動作しないことがあります。バージョンをお確かめのうえ、ご利用いただければと思います。
※サンプルデータをダウンロードし、実行した結果については、著者および株式会社エムディエヌコーポレーションは、一切の責任を負いかねます。お客様の責任においてご利用ください。
