flashコンテンツのフルスクリーン表示と、ハードウェアアクセラレーション

今更な感がありますが、AS3.0から、簡単にフルスクリーン機能を実装できるようになりました。

その方法は

  1. FlvPlaybackコンポーネントから、フルスクリーンボタンが配置されたコンポーネントを選択する。
  2. FLV Playback カスタム UI コンポーネントのFullScreenButtonを配置する。
  3. enterFullScreenDisplayState () メソッドを実行する
  4. スクリプトで実装する。

の4パターンが考えられるでしょう。

しかし、この4パターンのうち、1~3は、Flvムービーにしか適用できず。
さらに、FlvPlaybackコンポーネントを利用し、かつ、ディスプレイカードによるハードウェアアクセラレーションを利用する場合、コンポーネントの矩形範囲で拡大されてしまい、ビデオソースの解像度は無視されます。

例えば

  1. 実際のビデオのソースは、1920×1080のフルHDサイズだが、初期起動時は480×270で表示する。
  2. 画面に配置されたひとつのFlvPlaybackコンポーネントで、480×270画面内表示と、1920×1080フルスクリーンを切り替える。

上記のケースだと、フルHDの映像を480×270に縮小表示している場合、フルスクリーンにした際に
480×270で表示している画面をスケーリングしてしまうため(小さい動画をハードウェア側でスムージングを掛けて表示される)ソースがフルHDの映像だとしても、表示上480×270などに縮小している場合は、縮小された画面を引き伸ばしてしまい、小さい動画をただ引き伸ばしただけになってしまいます。

どうやらコレは、上記1~3のフルスクリーン実装方法だと、FlvPlaybackコンポーネントのメソッドを呼び出すかたちになるみたいなのですが(FlvPlaybackのenterFullScreenDisplayState () メソッド)どうやらこのメソッドを実行すると、FlvPlaybackコンポーネントの矩形範囲をハードウェアアクセラレーションでスケーリング表示するようです。(予想ですが!!)

結果、小さいサイズの動画をただ引き伸ばしたような映像になってしまいます。

そこで、FlvPlaybackコンポーネントの機能を使わずに、4の「スクリプトで実装する」ことにしましょう。
スクリプトで実装すると、Flvコンテンツだけでなく、実際のFlashコンテンツもFullScreenで表示することが出来るので、こちらで実装するほうが汎用性がありそうですしね。

さて、その方法ですが

stage.displayState = StageDisplayState.FULL_SCREEN;

と、stageのdisplayStateプロパティを、フルスクリーンなパラメータに設定するだけで、とりあえずFullScreenに出来ます。簡単です。プロパティにパラメータが入ったと同時にフルスクリーンが実行されます。
しかし問題が、コレだけではハードウェアアクセラレーションがかかりません。

なので、上記のコードを実行する前に、

stage.fullScreenSourceRect = new Rectangle(0, 0, 1920, 1080);

上記のコードを実行し、フルスクリーンで拡大する矩形エリアを設定します。

fullScreenSourceRectプロパティを設定すると
可能な場合、拡大 / 縮小は、ユーザーのコンピュータ上でグラフィックカードやビデオカードを使用してハードウェアで行われます。

てことで、こういうコードになります。

stage.fullScreenSourceRect = new Rectangle(0, 0, 1920, 1080);
stage.displayState = StageDisplayState.FULL_SCREEN;

FlvPlaybackコンポーネントのfullScreenTakeOverプロパティがtrueの場合(通常デフォルトでture)フルスクリーンに移行すると、自動的にFlvPlaybackコンポーネントは前面に表示され、フルHDのビデオのエリア「Rectangle(0, 0, 1920, 1080);」に対して、フルスクリーンのディスプレイアクセラレーションが実行されます。

この方法を利用すれば、Flvではなく、通常のFlashコンテンツに対してフルスクリーン機能を実装できますし、fullScreenTakeOverプロパティにfalseを設定した場合は、FlvPlaybackを含んだFlashコンテンツのデザインを、そのままフルスクリーンに出来ます。
その際は、Rectangleに対してRectangle(0, 0, Flashコンテンツの横幅, Flashコンテンツの高さ)を渡してやればOK!

ただし、フルスクリーンを実装する再は、スクリプトで実装する再もFlvPlaybackのメソッドを利用する場合も
必ずマウスクリックまたはキー操作をトリガにする必要がありあますので、ご注意を。

そして、貼り付けるHTML側の、allowFullScreenをtrueに設定してあげるのを忘れないように。

コメントする

トラックバック(1)

このブログ記事を参照しているブログ一覧: flashコンテンツのフルスクリーン表示と、ハードウェアアクセラレーション

このブログ記事に対するトラックバックURL: http://studio-ensyu.sakura.ne.jp/mt/mt-tb.cgi/21

フルスクリーンボタンを作った。 しかしいざ、IE6で... 続きを読む