忍者ブログ
 >admin |  >entry |  yukku++Blog 
×

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。

気が付けばもう11月。何気に早い卒業制作〆切なのにいまさらビデオ再生関係。

まずは、AS3でFLV形式のビデオを再生するまでの道のり。

  1. NetConnectionオブジェクトがサーバーまたはローカルへの接続を開く。
  2. NetStreamオブジェクトが接続を利用してビデオデータを流す。
  3. Videoオブジェクトがビデオデータを表示する。
大雑把にするとこの3ステップを踏んで、FLVビデオを再生ってことになる。
あと、ビデオ周りついでに、メタデータの取得もやっておこう。
詳細な流れはソースで確認していく。

// それぞれ必要なクラスをインポート
import flash.media.Video
import flash.net.NetStream;
import flash.net.NetConnection;

// それぞれを定義。
var nc:NetConnection = new NetConnection();
var ns:NetStream;
var video:Video = new Video(320,240);

// メタデータ用に適当なオブジェクトを用意しておく。
var client:Object = new Object();
var totalTime:String;

function Main():void 
{
	// ローカルぼ場合は null を指定。
	nc.connect(null);

	// NetStream に NetConnection を渡す。
	ns = new NetStream(nc);

	// Video に attachNetStream で NetConnection を渡す。
	video.attachNetStream(ns);
	
	// Video を addChild で表示。
	stage.addChild(video)
	
	// NetStream の play() で再生開始。
	ns.play("maji.flv")	
	
	// メタデータの処理
	client.onMetaData = function(meta:Object):void
	{
		// 取得されるデータは String型
		totalTime = meta.duration;
	}
	ns.client = client;
}

最小限だとこんな感じになるかな?
Video オブジェクトは単に表示するためのオブジェクトってのが自分的に意外。
ストリーミングを考慮しての設計らしいのでこのような手順を踏むのだとか。
play() や pause() の再生関係のメソッドは NetStream にある。
実はメタデータの処理の仕方がイマイチ理解できてない…。拾ったサンプルまるパクリ。
メタデータに総再生時間とかコーデックの種類とかが入ってるらしいけど、
参照名が決められてないからコーデック次第で参照名が変わるとの記述も…。
コールバック関数とか、functionの代入がいまだに分かってない。
早急に勉強・理解せねばねば。
Flex なら VideoDisplay のコンポーネントを設置するだけでいけるって便利だなぁ。
NetStream 関係で揉め事があるようだけど簡単なのには変わりない。

んで、フレーム単位でビデオを行ったりきたり、映像をスクラッチっぽく操作したいんだけど
調べて見ると、どうやらそれに関しては一筋縄ではいかないようだ…。
でも避けては通れないから何とか解決しなくては、てわ。

PR

いままであまり使っていなかったけどサンプルのプログラムなんかで見かけるようになったから、ここいらで勉強しておこう。
主に配列から中身やインデックスなんかを取り出すときに使うらしい。


for ...in ...

var List:Array = [a, b, c, d, e, f, g];
// No に List のインデックス番号が入る。String型であることに注意する。
var No:String;
var Index:uint;

// 今回は List の長さが 7 なので 0-6 までが No に入るのを繰り返す。
for (No in List)
{
    // No に入った番号は String型 なので int型 に変換して Index に入れる。
    Index = int(No);

    // Index に代入された番号を使って抽出。
    trace(No, List[index])
}
0 a
1 b
...
5 f
6 g
// No に代入されるのは String型 のインデックス番号


for ...each ...in ...

var List:Array = [a, b, c, d, e, f, g];
for each ( var v:String in List)
{
    trace(v)
}
a
b
...
f
g
// v に代入されるのは String型 の配列オブジェクト

インデックス番号か配列オブジェクトを取り出すかの違いで使い分けるって感じ?

GAINERをいじる前に行うグローバルセキュリティ設定を設定パネルなしで行う方法。
今までいちいち設定パネルでやってたけど、違うパソコンで動かそうと思ったら
インターネットに繋がってないと設定できなくて困ったことが何度かあった。
調べて見ると設定ファイルを作ることで、手動で設定できる方法があった。

Windowsの場合:
windowssystem32macromed lash に FlashPlayerTrust という名前のフォルダをつくり、
その中に任意のファイル名で hoge.cfg というファイルをつくり、
テキストエディタで開いて、セキュリティを解除したいパスを書けばよい。
SWFごとにcfgファイルを作ってもいいし、ディレクトリを指定してもいいみたい。
Panel とか Canvas に Sprite をaddChild() したら、
「TypeError: Error #1034: 強制型変換に失敗しました。」って怒られた。
ちゃんとリファレンスを読んでみても、どっちも DisplayObjectContainer を継承してる。
んで、調べて見たら、UIComponent のインスタンスを作って、それに addChild()しろとのこと。

Panel -- UIComponent -- Sprite みたいな感じで UIComponent を間に挟む。こんな感じ。

これってその都度 UIComponent のインスタンスを作らなきゃいけないのか?
だとしたらちょっと面倒だなぁ。
SWFのコンパイル時に埋め込みたいファイルを指定する。
// 埋め込み開始
[Embed(source = 'hoge.jpg')] 
var myImg:Class;

// bitmapに入れて使う
var bmp:Bitmap = new myImg();
:Class ってのが良く分からんが、コレで myImg というクラスを作っていると考えればよいそうだ。
で、それを bitmap に new してる、と。
画像以外にもいろいろ埋め込めるらしい。そういえばフォントも同じやり方だったな。
もちろん埋め込む分、SWFのサイズは埋め込んだファイル分大きくなる。
[ Flex ] Adobe - Flex クイックスタート基礎: アセットの埋め込み
・二階調化(二値化) bitmapData.threshold() をつかって閾値により、塗りつぶしを行う。 ------------------------------------------------------------------------------------------
threshold(sourceBitmap: BitmapData , sourceRect: Rectangle , destPoint: Point , operation: String , threshold: Number , [color: Number ], [mask: Number ], [copySource: Boolean ]) : Number
しきい値に照らしてイメージのピクセル値をテストし、テストに合格したピクセルに新しいカラー値を設定します。
threshold() メソッドを使用するとイメージ内のカラー範囲を分離して置換し、イメージピクセルに対しその他の論理演算を実行することができます。
パラメータ:
sourceBitmap:BitmapData - 使用する入力ビットマップイメージ。
sourceRect:Rectangle - 入力として使用するソースの領域を定義する矩形。
destPoint:Point - 現在の BitmapData (インスタンス)内のポイント。
operation:String - 比較演算子をストリングとして渡す。
threshold:Number - 閾値の基準となる値。
color:Number - 閾値条件を満たした場合にピクセルを塗りつぶすカラー値。
mask:Number - カラーコンポーネントを分離するときに使用するマスク。(論理積)
copySource:Boolean - true でしきい値テスト失敗時に、ソースイメージのピクセル値がターゲットイメージにコピーされます。
戻り値:Number - 変更されたピクセル数。
------------------------------------------------------------------------------------------

var dist:bitmapData = new bitmmapData(100, 100);
var rect:Rectangle = new Rectangle(0, 0, dist.width, dist.height);
var pt:Point = new Point(0, 0);
dist.threshold(dist, rect, pt, "<=",0xAARRGGBB ,0xAARRGGBB , 0xAARRGGBB , false);
スケールモードの変更
定数 文字 効果
StageQuality.LOW "low" 画質低
StageQuality.MEDIUM "medium" 画質中
StageQuality.HIGH "high" 画質高
StageQuality.BEST "best" 画質最高
なし "autolow" 画質低→高
なし "autohigh" 画質高→低

定数か文字を stage.quality に代入する。
ex) 画質を最高に設定する。
stage.quality = StageQuality.BEST;
stage.quality = "best";
スケールモードの変更
定数 文字 効果
StageScaleMode.EXACT_FIT "exactFit" 縦横比を変えてフィット
StageScaleMode.NO_BORDER "noBorder" 縦横比を変えずにフィット
StageScaleMode.NO_SCALE "noScale" 100% 表示
StageScaleMode.SHOW_ALL "showAll" すべて表示

ex) noScale に設定する。
stage.scaleMode = StageScaleMode.NO_SCALE;
ステージ表示モードの変更
プロパティ 効果
StageDisplayState.FULL_SCREEN フルスクリーンモード
StageDisplayState.NORMAL 通常(ウィンドウ)モード

ex) FULL_SCREEN/NORMAL に設定する。
stage.displayState = StageDisplayState.FULL_SCREEN
stage.displayState = StageDisplayState.NORMAL
[AS3 Ref] Stage
// 埋込み記述
[Embed(source = "/assets/Arial.ttf", fontName = "Arial", mimeType = 'application/x-font', flashType = 'true' )]

var Font_Arial:Class;
var myText:TextField = new TextField();

// 埋め込みフォントを有効にする。
myText.text = "test"
myText.embedFonts = true;
addChild(myText);

// 書式のインスタンスを作って、myTextにセットする。
var format:TextFormat = new TextFormat;
format.font = "Arial";
myText.setTextFormat(format);
[1]  [2]  [3]  [4
プロフィール
Name :
yukku
カレンダー
08 2024/09 10
S M T W T F S
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30
ブログ内検索
Twitter
Ads
アクセス解析
忍者ブログ [PR]