Flashゲームプログラミング講座 for ActionScript3.0

 

Video クラスについて

 


■Video クラスについて

 
Video クラスは、Flash に配置して表示できるオブジェクトの1つです。
 
外部にある動画ファイルを読み込んで再生したり、Webカメラの映像を表示することができます。
 
■ハードウェアアクセラレータについて(Flash Player 10.1 以降)
 
実行環境が、ハードウェアアクセラレータに対応している場合、ハードウェアデコード機能を使って動画を再生する事ができます。
 
実行環境が対応していない場合は、ソフトウェアでデコードされます。
 
最終的なレンダリングは、必ずソフトウェアを使って描画されます。
 

■ Video クラスの派生について


Video クラスは、以下の様に派生しています。
 
ここで解説してない分は、リンク先に解説がありますので合わせてご覧下さい。
 
Object
↓派生
EventDispatcher
↓派生
DisplayObject
↓派生
Video
 

■ StageVideo クラスについて

 
再生パフォーマンスが高く、使用方法が特殊な、StageVideo クラスもあります。
 


 

ビデオを作成して配置する

 


■ビデオオブジェクトを作成する


new 演算子を使って、Video クラスをインスタンス化します。
 
new Video ( 幅 , 高さ ) :Video
第01引数(略可)intビデオの幅を指定。デフォルトは 320
第02引数(略可)intビデオの高さを指定。デフォルトは 240
戻り値 VideoVideo オブジェクト
 
ビデオオブジェクトを作成する

import flash.media.Video;

// ビデオオブジェクトを作成する
var video_obj:Video = new Video();
 

■ビデオオブジェクトをステージに配置する


addChild() メソッドを使って、表示リストに登録します。
 
表示リストについては、こちらで解説しています。
 
ビデオオブジェクトを、stage の表示リストに登録する

import flash.media.Video;

// ビデオオブジェクトを作成する
var video_obj:Video = new Video();

// ステージの表示リストに登録する
stage.addChild(video_obj);
 

■ビデオオブジェクトのサイズを変更する

 
ビデオオブジェクトのデフォルトの大きさは、幅 320 、高さ 240 です。
 
ビデオオブジェクトのサイズを変更するには、以下のプロパティを変更します。
 
プロパティ名説明
xNumberx 座標(水平方向)の位置
yNumbery 座標(垂直方向)の位置
widthNumber水平方向の大きさ(ピクセル単位)
heightNumber垂直方向の大きさ(ピクセル単位)
 
ビデオオブジェクトのサイズを変更する

import flash.media.Video;

// ビデオオブジェクトを作成する
var video_obj:Video = new Video();

// ステージの表示リストに登録する
stage.addChild(video_obj);

// ビデオオブジェクトのサイズを変更する
video_obj.x = 10;
video_obj.y = 10;
video_obj.width  = 720;
video_obj.height = 480;
 

■ビデオオブジェクトの基本的な制御について

 
ビデオオブジェクトの基本的な制御の方法は、こちらで解説しています。
 
このページでは、Video クラスの機能について解説していきます。
 


 

動画ファイルを再生する

 


■外部にある動画ファイルを読み込んで、再生する

 
NetStream クラスを使用します。
 
こちらで解説しています。
 
■ビデオと NetStream オブジェクトを関連付ける
 
attachNetStream() メソッドを使用します。
 
Video.attachNetStream ( source ) :Void
第01引数 ObjectNetStream オブジェクトを指定。
戻り値 Voidなし
 
■使用例
 
外部にある動画ファイルを読み込んで、再生する

import flash.media.Video;
import flash.net.NetConnection;
import flash.net.NetStream;

// ------------------------------------------------------------
// Video オブジェクトを作成
// ------------------------------------------------------------
var video_obj:Video = new Video();

// 位置とサイズ
video_obj.x = 10;
video_obj.y = 10;
video_obj.width  = stage.stageWidth  - 20;
video_obj.height = stage.stageHeight - 20;

// ステージに配置
stage.addChild(video_obj);

// ------------------------------------------------------------
// NetConnection オブジェクトを作成
// ------------------------------------------------------------
var net_connection:NetConnection = new NetConnection();

// 動画ファイル再生用の設定
net_connection.connect( null );

// ------------------------------------------------------------
// NetStream オブジェクトを作成
// ------------------------------------------------------------
var net_stream:NetStream = new NetStream(net_connection);

// ------------------------------------------------------------
// ビデオと NetStream を関連付け
// ------------------------------------------------------------
video_obj.attachNetStream(net_stream);

// ------------------------------------------------------------
// リスナー用オブジェクトを渡して、リッスンを開始(ここではエラー回避用のダミー)
// ------------------------------------------------------------
net_stream.client = { onMetaData:function ():void{} };

// ------------------------------------------------------------
// URL を指定して、ストリーム再生を開始する
// ------------------------------------------------------------
net_stream.play ( "http://example.com/video/test.flv" );
 


 

Webカメラの映像を表示する

 


■Webカメラの映像を表示する

 
Webカメラの映像を、ビデオオブジェクトに表示することができます。
 
ビデオと、カメラを関連付けるには、attachCamera() メソッドを使用します。
 
詳しい使用方法は、こちらで解説しています。
 
Webカメラの映像を表示する

import flash.media.Camera;
import flash.media.Video;

// ビデオオブジェクトを作成
var video_obj:Video = new Video(320,240);

// ステージに配置
stage.addChild(video_obj);

// デフォルトのカメラオブジェクトを取得
var camera_obj:Camera = Camera.getCamera();

// カメラが利用可能
if(camera_obj){

	// ビデオとカメラを関連付け
	video_obj.attachCamera(camera_obj);

}
 


 

映像ソースの解像度を取得する

 


■映像ソースの解像度を取得する

 
映像ソースの解像度を取得するには、以下のプロパティを使用します。
 
videoWidth プロパティで 水平方向の大きさをピクセル単位で取得します。
 
videoHeight プロパティで 垂直方向の大きさをピクセル単位で取得します。
 
これらのプロパティは、読み取り専用です。
 
■動画ファイルの解像度を取得する場合
 
Video オブジェクトのレンダリングが開始されるまでは、解像度の取得を試みても失敗します。
 
Flash Player 10.2 以降、AIR 3.0 以降であれば、VideoEvent.RENDER_STATE イベント内で取得する事ができます。
 
VideoEvent.RENDER_STATE イベントが利用できない場合は、Event.ENTER_FRAME イベントなどを使用して、0 以外の数値が得られるまで監視し続けるといいでしょう。
 
VideoEvent.RENDER_STATE イベントを使って、動画ファイルの解像度を取得する (Flash 10.2 以降)

import flash.media.Video;
import flash.net.NetConnection;
import flash.net.NetStream;
import flash.events.Event;

// ビデオオブジェクトを作成する
var video_obj:Video = new Video();

// ステージの表示リストに登録する
stage.addChild(video_obj);

// ネットコネクションオブジェクトを作成
var net_connection:NetConnection = new NetConnection();
net_connection.connect( null );

// ネットストリームオブジェクトを作成
var net_stream:NetStream = new NetStream (net_connection);

// ビデオとネットストリームを関連付け
video_obj.attachNetStream(net_stream);

// Video のレンダリング状況に変化があると呼び出されるイベント
video_obj.addEventListener(VideoEvent.RENDER_STATE,function (e:Event):void{

	// 解像度を取得する
	var video_width:int  = video_obj.videoWidth;
	var video_height:int = video_obj.videoHeight;

	// ビデオオブジェクトのサイズを変更
	video_obj.width  = video_width;
	video_obj.height = video_height;

	// 出力テスト
	trace("w:" + video_width);
	trace("h:" + video_height);
});

// URL を指定して、ストリーム再生を開始する
net_stream.play ("http://hakuhin.jp/test.flv");
 
動画ファイルの解像度を取得する

import flash.media.Video;
import flash.net.NetConnection;
import flash.net.NetStream;
import flash.events.Event;

// ビデオオブジェクトを作成する
var video_obj:Video = new Video();

// ステージの表示リストに登録する
stage.addChild(video_obj);

// ネットコネクションオブジェクトを作成
var net_connection:NetConnection = new NetConnection();
net_connection.connect( null );

// ネットストリームオブジェクトを作成
var net_stream:NetStream = new NetStream (net_connection);

// ビデオとネットストリームを関連付け
video_obj.attachNetStream(net_stream);

// 毎フレーム実行されるイベント
addEventListener(Event.ENTER_FRAME,function (e:Event):void{

	// 解像度の取得を試みる
	var video_width:int  = video_obj.videoWidth;
	var video_height:int = video_obj.videoHeight;

	// 解像度の取得に成功した
	if(video_width && video_height){

		// ビデオオブジェクトのサイズを変更
		video_obj.width  = video_width;
		video_obj.height = video_height;

		// 出力テスト
		trace("w:" + video_width);
		trace("h:" + video_height);

		// イベントのリッスンを終了
		e.currentTarget.removeEventListener(e.type,arguments.callee);
	}
});

// URL を指定して、ストリーム再生を開始する
net_stream.play ("http://hakuhin.jp/test.flv");
 
■Webカメラの解像度を取得する場合
 
Webカメラの解像度を取得する場合、Camera オブジェクト側のプロパティを使用します。
 
Video オブジェクトからアクセスすると、取得に失敗したり、変更前の古い結果が得られる事があります。
 
Webカメラの解像度を取得する

import flash.media.Camera;
import flash.media.Video;

// ビデオオブジェクトを作成
var video_obj:Video = new Video(320,240);

// ステージに配置
stage.addChild(video_obj);

// デフォルトのカメラオブジェクトを取得
var camera_obj:Camera = Camera.getCamera();

// カメラが利用可能
if(camera_obj){

	// ビデオとカメラを関連付け
	video_obj.attachCamera(camera_obj);

	// Camera クラスから解像度を取得
	var camera_width:int  = camera_obj.width;
	var camera_height:int = camera_obj.height;

	// ビデオオブジェクトのサイズを変更
	video_obj.width  = camera_width;
	video_obj.height = camera_height;

	// 出力テスト
	trace("w:" + camera_width);
	trace("h:" + camera_height);

}
 


 

スムージングを設定する

 


■スムージングを設定する

 
スムージングを設定するには、smoothing プロパティを使用します。
 
true をセットすると、スムージング表示が有効になります。(画質が低以外の場合)
 
デフォルトは、false です。
 
ビデオにスムージングを設定する

import flash.media.Camera;
import flash.media.Video;

// ビデオオブジェクトを作成
var video_obj:Video = new Video(320,240);

// ステージに配置
stage.addChild(video_obj);

// デフォルトのカメラオブジェクトを取得
var camera_obj:Camera = Camera.getCamera();

// カメラが利用可能
if(camera_obj){

	// ビデオとカメラを関連付け
	video_obj.attachCamera(camera_obj);

	// ビデオのスムージング表示を有効
	video_obj.smoothing = true;

	// 低解像度に設定(テスト確認用)
	camera_obj.setMode(100,75,30);

	// ビデオのサイズを、実際の解像度の10倍に変更(テスト確認用)
	video_obj.width  = camera_obj.width  * 10;
	video_obj.height = camera_obj.height * 10;
}
 


 

非ブロッキングフィルタを設定する

 


■非ブロッキングフィルタを設定する

 
非ブロッキングフィルタを設定するには、deblocking プロパティを使用します。
 
低ビットレートの動画再生時に効果的です
 
非ブロックフィルタ未使用
 
非ブロックフィルタ使用
 
Sorenson コーデックの場合
 
Sorenson コーデック使用時は、以下の数値を指定します。
 
2 より大きい数値を指定した場合、2 が適用されます。
 
数値 説明
0 自動的に非ブロックフィルタの使用を切り替えます。(通常)
1 非ブロックフィルタを使用しません。
2 非ブロックフィルタを使用します。
 
On2 VP6 コーデックの場合
 
On2 VP6 コーデック使用時は、以下の数値を指定します。
 
数値 説明
0 自動的に非ブロックフィルタの使用を切り替えます。(通常)
1 非ブロックフィルタを使用しません。
3 非ブロックフィルタを使用します。リンギング除去フィルタを使用しません。
4 非ブロックフィルタを使用します。リンギング除去フィルタを使用します。(低品質、低負荷)
5 非ブロックフィルタを使用します。リンギング除去フィルタを使用します。(高品質、高負荷)
 
非ブロッキングフィルタを設定する

import flash.media.Video;
import flash.net.NetConnection;
import flash.net.NetStream;

// ビデオオブジェクトを作成する
var video_obj:Video = new Video();

// ステージの表示リストに登録する
stage.addChild(video_obj);

// ネットコネクションオブジェクトを作成
var net_connection:NetConnection = new NetConnection();
net_connection.connect( null );

// ネットストリームオブジェクトを作成
var net_stream:NetStream = new NetStream (net_connection);

// ビデオとネットストリームを関連付け
video_obj.attachNetStream(net_stream);

// URL を指定して、ストリーム再生を開始する
net_stream.play ("http://hakuhin.jp/test.flv");

// 非ブロッキングフィルタを設定する
video_obj.deblocking = 5;
 


 

レンダリング状況を調べる(Flash 10.2 以降)

 


■レンダリング状況を調べる(Flash 10.2 以降)

 
レンダリング状況を調べるには、VideoEvent.RENDER_STATE イベントを使用します。
 
登録した関数の引数から、VideoEvent オブジェクトが得られます。
 
ビデオが、カメラやネットストリームと関連付けられている必要があります。
 
■ステータスについて
 
ステータスを取得するには、status プロパティを使用します。
 
以下のような、VideoStatus 定数が得られます。
 
定数文字列説明
VideoStatus.ACCELERATED"accelerated"ハードウェアデコード機能を使用して動作しています。
VideoStatus.SOFTWARE"software"ソフトウェアデコード機能を使用して動作しています。
 
■取得例
 
Video オブジェクトのレンダリング状況を監視する

import flash.text.TextField;
import flash.media.Video;
import flash.net.NetConnection;
import flash.net.NetStream;
import flash.events.VideoEvent;
import flash.media.VideoStatus;

// ------------------------------------------------------------
// テキストフィールド
// ------------------------------------------------------------
// テキストフィールドを作成
var text_field:TextField = new TextField();
text_field.x = 10;
text_field.y = 120;
text_field.width = stage.stageWidth - 20;
text_field.height = stage.stageHeight - 130;
text_field.border = true;
text_field.multiline = true;
stage.addChild(text_field);


// ------------------------------------------------------------
// ビデオ
// ------------------------------------------------------------
// ビデオオブジェクトを作成する
var video_obj:Video = new Video();

// ステージの表示リストに登録する
stage.addChild(video_obj);

// ビデオのサイズを設定
video_obj.x = 10;
video_obj.y = 10;
video_obj.width  = stage.stageWidth - 20;
video_obj.height = 100;


// ------------------------------------------------------------
// Video のレンダリング状況に変化があると呼び出されるイベント
// ------------------------------------------------------------
video_obj.addEventListener(VideoEvent.RENDER_STATE,function (e:VideoEvent):void{

	switch(e.status){
	case VideoStatus.ACCELERATED:
		text_field.text = "ハードウェアデコード機能を使用して動作している\n" + text_field.text;
		break;
	case VideoStatus.SOFTWARE:
		text_field.text = "ソフトウェアデコード機能を使用して動作している\n" + text_field.text;
		break;
	}

});


// ------------------------------------------------------------
// ネットストリーム
// ------------------------------------------------------------
// ネットコネクションオブジェクトを作成
var net_connection:NetConnection = new NetConnection();
net_connection.connect( null );

// ネットストリームオブジェクトを作成
var net_stream:NetStream = new NetStream (net_connection);

// ビデオとネットストリームを関連付け
video_obj.attachNetStream(net_stream);

// URL を指定して、ストリーム再生を開始する
net_stream.play ("http://hakuhin.jp/test.mp4");