ビデオについて
・ | Video クラスについて |
・ | ビデオを作成して配置する |
・ | 動画ファイルを再生する |
・ | Webカメラの映像を表示する |
・ | 映像ソースの解像度を取得する |
・ | スムージングを設定する |
・ | 非ブロッキングフィルタを設定する |
・ | レンダリング状況を調べる(Flash 10.2 以降) |
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 |
戻り値 | Video | Video オブジェクト |
ビデオオブジェクトを作成する
import flash.media.Video;
// ビデオオブジェクトを作成する
var video_obj:Video = new Video();
■ビデオオブジェクトをステージに配置する
ビデオオブジェクトを、stage の表示リストに登録する
import flash.media.Video;
// ビデオオブジェクトを作成する
var video_obj:Video = new Video();
// ステージの表示リストに登録する
stage.addChild(video_obj);
■ビデオオブジェクトのサイズを変更する
ビデオオブジェクトのデフォルトの大きさは、幅 320 、高さ 240 です。
ビデオオブジェクトのサイズを変更するには、以下のプロパティを変更します。
プロパティ名 | 型 | 説明 |
x | Number | x 座標(水平方向)の位置 |
y | Number | y 座標(垂直方向)の位置 |
width | Number | 水平方向の大きさ(ピクセル単位) |
height | Number | 垂直方向の大きさ(ピクセル単位) |
ビデオオブジェクトのサイズを変更する
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 オブジェクトを関連付ける
attachNetStream() メソッドを使用します。
Video.attachNetStream ( source ) :Void
第01引数 | Object | NetStream オブジェクトを指定。 |
戻り値 | 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" | ハードウェアデコード機能を使用して動作しています。 |
VideoStatus. | "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");