【AIR & Flex3】 超シンプル flv プレーヤー

  AIR 専用のビルド環境と、エクスプローラからのドラッグ・ドロップサンプル




ブラウザでダウンロード

※ ウインドウに、エクスプローラから他の flv をドラッグドロップできます
※ コンテキストメニューで、動画のサイズ変更ができます
※ プログレスバーをクリックすると、動画をシークできます
※ 音量を10段階で変更できます

Simple_flv_player


先に、http://opensource.adobe.com/wiki/display/flexsdk/Download+Flex+3 から
Stable Builds( 安定バージョン ) より最新のものをダウンロードして解凍し、
その中の bin ディレクトリのフルパスを __buildPath.txtの中に記述します。

1) copy_buildline.wsf を実行して初回コマンドラインをクリツプボードにコピー
2) FCSH_BUILD.wsf をエクスプローラから起動
3) クリップボードから貼り付けると実行が開始されます
4) 2回目以降は 上矢印で compile 1 を表示させて実行
5) air_start.wsf をエクスプローラから起動して実行


__buildPath.txt
  
C:\flex_sdk_3.4.0.6955\bin

;C:\flex_sdk_3.3.0.4589\bin
;C:\flex_sdk_3.2.0.3958\bin
;C:\flex_sdk_3.1.0.2710\bin
;C:\flex_sdk_3.0.3.2490\bin

; 行先頭にセミコロンはコメントです。
; また、一つでも有効な行を発見したら、それを使用して次の行以降は読み込みません
; なにも無い行は無視します
;
; ※ いろいろなバージョンをこれで切り替えて処理します
  

__air_start.txt
  
;UTF-8 をコマンドラインに表示する為の処理
;但し、コマンドプロンプトのプロパティで日本語フォントに変更しておく必要があります
;( 同じパスのコマンドプロンプトの設定が常に有効である必要があります )
;chcp 65001

;コマンドラインを終了する
adl Mainw.xml
; エラーの場合、メッセージを見る為の処理です
; invocation forwarded to primary instance だと、adl の二重起動
;
; invalid application descriptor: descriptor version does not match runtime version だと、
; ビルドしたのと違うバージョンで起動しようとした
;
; error while loading initial content だと、AIR1.5用でビルドしたのに、以前のバージョンで起動しようとした
; adl のバージョンは関係無く、swf がどのバージョン用にビルドされたかが問題です
;
; バージョン違いの場合は、Mainw.xml の
; <application xmlns="http://ns.adobe.com/air/application/1.0"> の1.0 をバージョンにあわせます
IF ERRORLEVEL 1 (echo エラーが発生しています & pause & exit) else echo
exit
  


readme.txt
  
********************************************************
* ●● 重要 ●●
* 同梱の swf は、3.4.0.6955 でビルドされています。
*
* デバッグ実行に、AIR のランタイムは必要ありません( Flex3 の SDK のみ必要 )
*
* lightbox_flvPlayer.air をアプリケーションとしてインストールするには、
* AIR の ランタイムが必要です
*
* Adobe AIR のバージョンは、
* C:\Program Files\Common Files\Adobe AIR\Versions\1.0\Adobe AIR.dll
* のバージョンで確認できます
* 
* lightbox.p12 は、ビルドコマンドラインを quit で終了し、以下のコマンドで作成できます
* adt -certificate -cn lightbox 1024-RSA lightbox.p12 password
********************************************************

--------------------------------------------------------------------------------
【まず最初に】
__buildPath.txt に flex3 の正しいパスを書いて下さい

【ビルド方法】
1) FCSH_BUILD.wsf を実行して、コマンドプロントを表示させます
2) コマンドプロンプトは、オプションから「簡易編集モード」に設定しておきます
3) copy_buildline.wsf を実行して、コマンドラインをクリップボードに貼り付けます
( コマンドラインの内容は、__clipCommand.txt にあります )
4) コマンドプロンプト上で、右クリックでビルドコマンドを貼り付けます
5) 次回からは、コマンドプロンプトの上矢印キーで compile 1 を表示させて実行します

【実行方法】
air_start.wsf をエクスプローラから実行します。

--------------------------------------------------------------------------------
【ログ】
open_mmcfg.wsf を実行すると、メモ帳が開くので、
何も無いか、TraceOutputFileEnable=0 とすると、画面に trace の結果が表示されます
TraceOutputFileEnable=1 とすると、結果はファイルに書き込まれます
open_mmcfglog.wsf を実行すると、そのファイルを開きます

--------------------------------------------------------------------------------
【実行中の trace の日本語処理について】
デフォルトでは、Flex 内が UTF8 なので化けます。
ファイルに書き込めば、正しく表示されますが、

どうしてもコマンドプロンプト上で日本語トレースしたい場合は以下のようにします。

1) ファイル名を指定して実行から、cmd.exe を実行してコマンドプロンプトを表示
2) プロパティのフォントで MS ゴシックを選択して、「同じタイトルのウインドウに適用する」を選ぶ
3) コマンドプロンプトを閉じる
4) __air_start.txt を開いて、chcp 65001 を実行させるように ; を削除する
5) air_start.wsf を実行する
※ mode con: cp select=65001 でもコードページは変更できます

このオプションは、バグってるようなので、日本語は表示されますが欠けたりします。
コンソールの再描画が正しくされていないようなので、ウインドウのサイズを変更したり
最小化して戻したりすると正しく表示されます。

「同じタイトルのウインドウに適用する」を解除したい場合は、
HKEY_CURRENT_USER\Console\%SystemRoot%_system32_cmd.exe のレジストリキーを削除します。
( 環境毎に違うと思いますが、HKEY_CURRENT_USER\Console の下に作成されます )


--------------------------------------------------------------------------------
※ 初期状態では、sample.flv が表示されていますが、
※ エクスプローラから新しい flv をドラッグドロップできます
※ ( ファイルのチェックは行っていません )

************************************************************
* 定義ファイル
************************************************************
■ __buildPath.txt( SDK の場所 )

	flex の sdk のパスを設定する

■ __air_start.txt( 実行コマンド( 複数行可 ) )

	air のデバッグ実行を起動するコマンドラインリスト

■ __log_editorPath.txt( ログを開くエディタ )

	デバッグログを開く為のエディタへのパスを定義するファイル

■ __air_build.txt( バッチビルド用コマンド )

	バッチビルドのコマンドラインリスト
	※ 通常は、対話でビルドを行ないます

■ __clipCommand.txt( クリップボードコピー用コマンド )

	copy_buildline.wsf によって、この内容が
	クリップボードにコピーされます

■ Mainw.xml( 実行ウィンドウ )

	AIR の 実行時のウインドウの定義です


************************************************************
* ソースコード
************************************************************
■ Mainw.mxml

	air 用メインソース


************************************************************
* ビルド、その他実行用
************************************************************
■ FCSH_BUILD.wsf( 対話ビルド用コマンドライン )

	開発中のビルドコマンドを入力する為のコマンドプロンプトを開く
	※ copy_buildline.wsf を実行して、コマンドラインをクリップボートにコピー
	※ 貼り付けて実行
	※ 2回目以降は Compile 1 を実行

■ air_build.wsf ( バッチビルド )

	__air_build.txt を実行するスクリプト

■ air_start.wsf( 実行(デバッグ) )

	__air_start.txt を実行するスクリプト

■ open_mmcfglog.wsf( ログファイルを開く )

	デバッグログを開くスクリプト

■ open_mmcfg.wsf( ログ設定 )

	デバッグ時の書き込み先を定義するファイルを開くスクリプト
	※ 存在しない場合は、新規に作成してログはファイル出力になります

■ copy_buildline.wsf( クリップボードにコピーします )

	クリップボードにビルド用コマンドラインをコピーする


************************************************************
* その他
************************************************************
■ readme.txt	このファイル


-------------------------------------------------------------
添付している mp4 はご自由に使って下さい。
MikuMikuDance で作成したものです
  

↓_FLEX3_AIR_BUILD.mkp より MKEditor を起動した状態



  Mainw.mxml ( ソースコード )



  
<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication
	xmlns:mx="http://www.adobe.com/2006/mxml"
	initialize="initData();"
	nativeDragEnter="Check_DragEnter(event)"
	nativeDragDrop="Check_DropFile(event)"

	usePreloader="true"

	titleIcon="{imgSmile}"
	title="エクスプローラから flv をドラッグ・ドロップできます"
	headerHeight="80"
	cornerRadius="20"
	titleTextStyleName="titleStyle"
>

<mx:Style>
WindowedApplication {
	backgroundGradientColors: 0,9044009;
}
.titleStyle {
	fontSize: 12;
}
Alert {
	backgroundColor: #FFFFFF;
	backgroundAlpha: 1;
	color: #000000;
	borderColor: #000000;
	borderStyle: solid;
	borderThickness: 1;
	headerColors: #A0A0A0,#A0A0A0;
}
</mx:Style>

<mx:Script>
<![CDATA[

	import mx.controls.*;
	import mx.events.*;
	import flash.filesystem.*;
	import flash.events.Event;

	[Bindable]
	[Embed("smile.png")]
	private static var imgSmile:Class;
	private var nSize:int = 1;
	private var rootObject:WindowedApplication;
	private	var nativeMenu:ContextMenu;

	// *********************************************************
	// アプリケーションの初期化
	// *********************************************************
	public function initData():void {

		// メッセージ
		trace( "initData() が実行されました" );

		// 再生イベントの発生間隔
		myVid.playheadUpdateInterval = 1;

		// プログレスバーの初期化
		progressBar.setProgress(0, 100);

		// Mainw.xml の値を変更
		this.height = 600;

		// 初期ボリューム
		myVid.volume = 0.7;

		// *************************************************
		// コンテキストメニュー定義
		// *************************************************
		rootObject = WindowedApplication(mx.core.Application.application)
		nativeMenu = new ContextMenu();
		nativeMenu.hideBuiltInItems();

		addContextMenu(
			"x 1",
			function():void {
				changeSize(1);
			}
		);
		addContextMenu(
			"x 2",
			function():void {
				changeSize(2);
			}
		);
		addContextMenu(
			"x 0.5",
			function():void {
				changeSize(3);
			}
		);
		addContextMenu(
			"ベースを最大化",
			function():void {
				myVid.stage.displayState = 'fullScreen';
			}
		);
		addContextMenu(
			"ベースを標準",
			function():void {
				myVid.stage.displayState = 'normal';
			}
		);
		rootObject.contextMenu = nativeMenu;

	}

	// *********************************************************
	// コンテキストメニュー追加
	// *********************************************************
	public function addContextMenu(
		label:String,
		listener:Function
	):void {

		var menuItem:ContextMenuItem;
		menuItem = new ContextMenuItem(label);
		menuItem.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT,listener);
		nativeMenu.customItems.push(menuItem);

	}

	// *********************************************************
	// 外部からドラッグ開始
	// *********************************************************
	private function Check_DragEnter(e:NativeDragEvent):void {

		var clip:Clipboard = e.clipboard;
		if ( clip.hasFormat( ClipboardFormats.FILE_LIST_FORMAT ) ) {
			NativeDragManager.acceptDragDrop(this);
		}
	}

	// *********************************************************
	// 外部からドロップ
	// *********************************************************
	private function Check_DropFile(e:NativeDragEvent):void {

		var clip:Clipboard = e.clipboard;
		var file_list:Array;
		file_list = clip.getData(ClipboardFormats.FILE_LIST_FORMAT) as Array;

		var str:String = file_list[0].nativePath;
		var part:Array = str.split(".");
		var len:int = part.length;
		var ext:String = (part[len-1]).toUpperCase();

		if ( ext == "MP4" || ext == "FLV" ) {
			myVid.source = file_list[0].nativePath;
			myVid.load();
			progressBar.setProgress(0, 100);
		}
		else {
			Alert.show( "flv か mp4 を使用して下さい" );
		}
	}

	// *********************************************************
	// 再生ヘッド位置の表示
	// *********************************************************
	public function playhead_Update(e:mx.events.VideoEvent):void {

		progressBar.setProgress(
			e.playheadTime,
			e.currentTarget.totalTime
		);
	}

	// *********************************************************
	// ストップ( リセット )処理
	// *********************************************************
	public function play_Reset():void {

		// STOP ボタンを使用した場合は巻き戻すが、
		// 最後まで表示した場合は巻き戻さない
		myVid.autoRewind = true;
		myVid.stop();
		myVid.autoRewind = false;
	}


	// *********************************************************
	// シーク
	// *********************************************************
	private function setTime( e:MouseEvent ):void {

		myVid.playheadTime = ( e.localX * myVid.totalTime )/ progressBar.width;

	}

	// *********************************************************
	// サイズ変更
	// *********************************************************
	private function changeSize( nSize:int ):void {

		switch( nSize ) {
			case 1:
				myVid.width = myVid.videoWidth;
				myVid.height = myVid.videoHeight;
				break;
			case 2:
				myVid.width = myVid.videoWidth * 2;
				myVid.height = myVid.videoHeight * 2;
				break;
			case 3:
				myVid.width = myVid.videoWidth / 2;
				myVid.height = myVid.videoHeight / 2;
				break;
		}

	}

	// *********************************************************
	// スライダー変更イベント
	// *********************************************************
	private function changeVolume( ):void {

		myVid.volume = hSlider.value;

	}


]]>
</mx:Script>

<mx:Panel
	title="超シンプル flv プレーヤー"
	horizontalAlign="center"
	paddingLeft="10"
	paddingRight="10"
>
	<mx:VideoDisplay
		id="myVid"
		autoPlay="false"
		autoRewind="false"
		playheadUpdate="playhead_Update(event)"
		complete="progressBar.setProgress(100,100)"
		source="sample.mp4"
		ready="changeSize(1);"
	/>

	<mx:VBox width="100%">
		<mx:HBox>
			<mx:Button
				label="Play"
				click="myVid.play();"
				width="60"
			/>
			<mx:Button
				label="Pause"
				click="myVid.pause();"
				width="60"
			/>
			<mx:Button
				label="Stop"
				click="play_Reset();"
				width="60"
			/>
			<mx:HSlider
				 id="hSlider"  
				 minimum="0"  
				 maximum="1"  
				 value="0.7"  
				 snapInterval="0.1"  
				change="changeVolume();"
			/>

		</mx:HBox>
		<mx:ProgressBar
			id="progressBar"
			mode="manual"
			label=""
			width="100%"
			click="setTime(event)"
		/>
	</mx:VBox>

</mx:Panel>

</mx:WindowedApplication>
  










  infoboard   管理者用   
このエントリーをはてなブックマークに追加





フリーフォントWEBサービス
SQLの窓WEBサービス

SQLの窓フリーソフト

素材

一般WEBツールリンク

SQLの窓

フリーソフト

JSライブラリ