メイン

2008年10月09日

ちょっと驚いた・・・かな

ActionScript 3.0のエバンジェリストかと(勝手に)思っていたコリンムック氏がこんな考えを持っていたとはちょっと驚きました。

■ ActionScript 3.0に関する議論は終わりか?(infoQ)

・・・ Moock氏は投稿でActionScriptに対する9つの苦情を並べた。

1. Flash CS3からon()/onClipEvent()を削除したことで簡単なインタラクティブ作用を作るのが難しくなった。
2. ロードされた.swfファイルを(メモリ上から)除去するのが難しくなった。
3. DisplayObject.parentへのキャストが必要になったことで親ムービー・クリップの制御が難しくなった。
4. getURL()メソッドを削除したことでリンクを生成するのが難しくなった。
5. loadMovie()メソッドを削除したことで.swfファイルや画像などをロードするのが難しくなった。
6. ActionScript 3.0で追加されたエラー通知によってコーディングが面倒になった。
7. ライブラリにあるシンボルに対する動的な参照の方法が直観的でない。
8. 自作のテキスト・フィールドやムービー・クリップ、ボタンに対して独自の機能を追加するのが面倒になった。
9. duplicateMovieClip()メソッドを削除したことでMovieClipインスタンスのクローンを生成するのが(とても)難しくなった。

Moock氏は合わせてそれぞれの苦情に対する徹底した説明と提案も示している。
・・・

記事の内容は、InsideRIAでのコリンムック氏の発言を受けてのコミュニティ内の議論についてだが日常の仕事にActionScript 3.0を(まだ)使っていない私としてはいまいち論点が???だ。(笑)

他の人の反論も、”あたり前過ぎて”・・・この記事自体どう読み取ったら良いんだろうか???

  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2008年10月03日

SampleDataEventの最終形?!

Flash Player 10 の(ベータ)バージョンが変わるたびに実装が変更されていた「SampleDataEvent」ですが、CS4発売が間近なこともあってこれで最終形のようです。

■ サイン波生成サンプルコード


var mySound:Sound = new Sound();
function sineWaveGenerator(event:SampleDataEvent):void {
for ( var c:int=0; c < 8192; c++ ) {
event.data.writeFloat(Math.sin((Number(c+event.position)/Math.PI/2))*0.25);
event.data.writeFloat(Math.sin((Number(c+event.position)/Math.PI/2))*0.25);
}
}
mySound.addEventListener(SampleDataEvent.SAMPLE_DATA,sineWaveGenerator);
mySound.play();

Flash Player 10 beta 2 以降は、「Event.SAMPLE_DATA」を使うことになっていましたが実際は動作しなかったので以下のように文字列"sampleData"を渡すことで使用できてました。


mySound.addEventListener("sampleData",sineWaveGenerator);

もしかして、(発表されなかっただけで)その時点ですでにイベントの実装が変更されていたのかもしれませんが・・・

とりあえずは、やっとすっきりしたと言うところでしょうか・・・

  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2008年09月02日

ちょっと気になるHydroTweenとGoASAP

最近、気になっているのがHydroTweenと言う新手のトゥイーンライブラリです。

と言ってもHydroTweenは単独のライブラリではなくGoフレームワーク(GoASAP)と呼ばれるベースシステムを利用したトウィーニング・パーサーです。

つまり、GoASAPを利用するとオリジナルのトゥイーンライブラリが簡単(?)に作れてしまうと言うことです。

下記リンク先の動作サンプルを見るとかなり使えそうだと言うことが分かります。
シーケンスが簡単に組めるのも便利です。



また、Papervision3Dの組み合わせでは、これまでの単体の組み合わせとは違ってGoASAP上に乗ることによってより親和性の高いものになっています。

3Dをもっとシンプルに使いたい人には結構良いかも・・・です。

下記のサンプルは、「Papervision3D 2.0 + Go Tweening - Flipping Banner (Part 1)」のプレゼンテーションサンプルをこのブログ用に書き換えてみました。(ので、コードは元エントリをご覧ください)









HydroTweenの呼び出しはこんな感じ・・・


private function flip(id:int):void {
 HydroTween.go(_planeArray[_next], {rotationY:180, Blur_blurX:128}, 1, 0, Quintic.easeInOut, onOldFlipDone);
//省略
 HydroTween.go(_planeArray[_next], {rotationY:0, Blur_blurX:0}, 1, 0, Quintic.easeInOut, onFlipDone);
 HydroTween.go(camera, {z:-700}, .5, 0, Quintic.easeIn, onCameraHalf);
}
private function onCameraHalf(event:Event = null):void {
 viewport.alpha = 1;
 HydroTween.go(camera, {z:-100}, .5, 0, Quintic.easeOut);
}


GoASAPとPapervision3Dを組み合わせたものとしてはJohn Grden氏のGo3Dと言うのもあります。

  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2008年08月18日

ActionScript 3.0 は、ECMAScript完全準拠じゃないの?!

本日のakihiro kamijo氏のブログエントリ「ECMAScript Harmony/ES3.1 と ActionScript」によると、これまでActionScript 3.0 が元としてきたECMAScript 標準第 4 版(ECMA-262 Edition 4 )がボツになって今後はECMA-262 Edition 3.1(ECMAScript Harmonyプロジェクト)が正式なものとなるようです。

つまり、どういうことになるかと言うとEdition ナンバーの違いを見ても分かるように現在のActionScript 3.0 は標準から大幅に拡張しすぎてしまって標準と互換性が無くなってしまったと言うことです。

そもそも ActionScript 3.0 がECMAScript 完全互換でないといけないのかと言う単純な疑問もありますが、これをFirefoxの「タマリン・プロジェクト(Tamarin Project)」の観点から見るとかなり大きな影響を及ぼしそうですね。

ECMAScriptは、JavaScriptでもあるので・・・

この問題に関してアドビがどう対応するのかは今後の正式アナウンスを待つ必要がありますが要注意です。

  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2008年07月11日

FP10beta2でオーディオ新機能の実装が変更されたようだ。

「FP10beta2でsamplesCallbackDataを認識しない?」エントリでオーディオ新機能の実装変更でサンプルが動かなくなったことを書きましたが、その後、アドビのFlash PlayerプログラマであるTinic Uro氏のブログエントリを見てみると、FP10 beta2(build 10.0.1.525)リリース後にサンプルコードがアップデートされたようです。

Part 2(サイン波生成) の以前のコード(一部省略)


var sound:Sound = new Sound();
function sineWavGenerator(event:SamplesCallbackEvent):void {
//省略
sound.samplesCallbackData.writeFloat(sample);
sound.samplesCallbackData.writeFloat(sample);
}
sound.addEventListener("samplesCallback",sineWavGenerator);
sound.play();

Part 2(サイン波生成) の新しいコード(変更点のみ)


function sineWavGenerator(event:SampleDataEvent):void {
event.data.writeFloat(sample);
event.data.writeFloat(sample);
}
sound.addEventListener("sampleData",sineWavGenerator);

Part 3(MP3の再生) の以前のコード(一部省略)


var mp3sound:Sound = new Sound();
var dynamicSound:Sound = new Sound();
var samples:ByteArray = new ByteArray();

function samplesCallback(event:SamplesCallbackEvent):void {
//省略
dynamicSound.samplesCallbackData.writeFloat(left);
dynamicSound.samplesCallbackData.writeFloat(right);
//省略
}
private function loadComplete(event:Event):void {
dynamicSound.addEventListener("samplesCallback",samplesCallback);
dynamicSound.play();
}
mp3sound.addEventListener(Event.COMPLETE, loadCompleteMP3);
mp3sound.load(new URLRequest("sound.mp3"));

Part 3(MP3の再生) の新しいコード(変更点のみ)


function sampleData(event:SampleDataEvent):void {
event.data.writeFloat(left);
event.data.writeFloat(right);
}
private function loadComplete(event:Event):void {
dynamicSound.addEventListener("sampleData",sampleData);
}

変更点は、上記サンプルコードの違いから見てみると大きくは3点です。

(1)リスナーに登録するイベント名が変更された。
"samplesCallback" → "sampleData" または Event.SAMPLE_DATA

(2)コールバックで渡されるイベント名が変更された。(1)の変更に伴う
event:SamplesCallbackEvent → event:SampleDataEvent

(3)書き込み先がコールバックイベントのdataプロパティに変更された。
sound.samplesCallbackData → event.data (SampleDataEvent)

SoundクラスからsamplesCallbackDataプロパティは削除された。

何となく今後の展開が心配になるような・・・感じがする。

※追記情報
SampleDataEventオブジェクトで利用できるサンプルの設定範囲が変更された。
512~8192 → 2048~8192

  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2008年07月08日

FP10beta2でsamplesCallbackDataを認識しない?

エラー

FP10の新機能であるSound.Extract()メソッドやSound.samplesCallbackDataプロパティを利用して作成したサンプルが「FP10 beta 2」(ブラウザプラグイン&スタンドアローンともに)ではエラーが発生して動作しないようです。

試しに「FP10 beta 1」に戻してみると問題なく動作するのでプログラム自体には問題なさそう・・・

とりあえず、「FP10 beta 2」をインストールした状態でソースを開いてみると「samplesCallbackData」の部分にエラーが出ていてカーソルオーバーでエラー内容を表示させてみると「未定義である可能性が高いプロパティsamplesCallbackData・・・アクセスしています」と言うことらしい。

エラー

master_sound.samplesCallbackData.writeFloat(left);
master_sound.samplesCallbackData.writeFloat(right);

実際問題として、「samplesCallbackData」が原因とは断定できないけど少なくとも「FP10 beta1」と「FP10 beta2」では動作に影響する実装上の何か大きな違いがありそうです。

  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2008年06月12日

Vector型は50%速い・・・?

Audio Mixer

FP10の新機能をメインにマルチトラックのオーディオミキサーを作ってみました。
(昨日買った本は今のところ何の役にも立ってませんが・・・)

メイン部分がsamplesCallbackイベントでのバイナリ操作になるので従来のSoundクラス、SoundChannelクラス、SoundTransformクラスを使ったオーソドックスなスタイルとは頭の切り替えが必要ですね。

まあ、これはこれとして(笑)、今回は新しい配列型であるVectorを多用してみました。
なぜかというとどこかのブログで従来のArrayと比較して50%程度、速くなると書いてあったからです。
AS2と比べてかなり高速になったはずのAS3ですが、速くなったがゆえに逆に早さを意識してコーディングすると言う変な感じになってます・・・

ところで最新のコードガイドラインでは、if/else 文の命令が1つしかない場合、ブロックで囲わないことが推奨らしく、サンプルなんかで囲みがなくて綺麗にインデントされていないとコードを勘違いするので要注意です。
(囲みが無くなったことでネスト状態も分かりにくい)


if (flag)
doThing1();
//とか
if (flag)
doThing1();
else
doThing2():
//とか
//ネスト状態が分かりにくい
if (!condition1)
return false;
...
if (!condition2)
return false;
...
if (!condition2)
return false;
...
return true;

  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2008年06月11日

遅ればせながらAS3に足を踏み入れた・・・

これまで仕事としてのニーズがまったく無かったので巷のActionScripterの盛り上がりとは一歩引いたところで予習程度(又はブログ掲載用の遊び程度)にActionScript 3.0 をやってたんですが、今月に入ってからの仕事でクライアント側から「Flex3での開発/納品指定」だったり、またその内容がByteArrayをバリバリ使うような仕事だったりとちょっと大変なことになってます(笑)

仕事としては、いつものようにオーディオ・音楽系なので例の「popforge」だったり、FP10の新機能だったりと仕事に使えるかどうかも含めていろいろと検証しているところです。

それにしても「popforge」の方はAPIドキュメントすら無いようなのでsvnに同梱されているサンプルとライブラリ自体を読んだりとちょっと面倒くさかったですね。

まあ、現時点の「popforge」は、例の”SOUND_COMPLETE”問題で根本が揺らいでいるので選択肢から外す可能性が大です・・・「popforge」の動作原理は、かなりハック的要素が強いので今後、核となる部分をFP10の新機能に置き換えてパワーアップしたものが登場するんじゃないでしょうか。

なにせ、AdobeのFlash Player担当プログラマーが”SOUND_COMPLETE”は今後も改善しないかもっと悪くなると明言しているので・・・これは、「popforge」を使う、使わない、にかかわらずシビアなレベルではこのイベントに期待するのは厳しいと言うことです。(特にFP9以降+Windows Vista)

FP10が正式リリースされて以降は、FP10のサウンド機能を拡張するためのフレームワークが数多く登場して、これまでになく音楽ジャンルが盛り上がるんじゃないかと密かに期待してます。

そう言えば、Adobe Labs.にCS4のベータ版がいくつか登場してますが、Flash CS4のベター版もまもなくじゃないでしょうか・・・YoutubeにはFlash CS4 スニークプレビュー版のビデオがいくつもアップされてるので・・・

  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2008年06月05日

ビート(タイム)テーブルを作ってみる

前回は、ピッチテーブルを作りましたが今回は音楽ソフトウエアに欠かせないテンポ値から計算するビート(1拍)テーブルです。つまり一拍ごとの時間値の配列(タイムテーブル)です。

■ 引数に必要な要素は:(下記サンプルコードの場合)


  • tempo(テンポ)テンポ120なら、120.0

  • beat(一小節の拍数)4拍子では、4

  • bars(小節数)例えば8小節なら、8

  • _offset(オフセット)音楽的な1小節1拍目が「0」のときは、0.0


offset値は、オーディオデータとシンク(同期)する場合などの時に音楽的な曲頭とオーディオデータの時間軸の頭が一致しない場合にオフセット値を設定します。

下記サンプルの場合、Math.round()で整数に丸めていますが小数点以下も欲しい場合は外してください。

function create_beat_array(tempo:Number, beat:int, bars:int, _offset:Number):Array {
	var interval_time:Number = Math.round (60 * 1000 / tempo);
	var total_beats:int = beat * bars;
	var beat_array:Array = [];
	for (var i:int= 0; i < total_beats; i ++) {
		beat_array [i] = _offset + (interval_time * i);
	}
	return beat_array;
}
  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2008年05月26日

ピッチテーブルを作ってみる

Flash Player 10 でサウンド生成が可能になりましたが実際これを利用する場合は「音階と周波数」の関係を多少なりとも知っておくと後々役立ちます。

と言うことで、簡単なピッチ(周波数)計算機(SWF)を作ってみました。
(たまにはコードもアップしないとね・・・)

■ 表示内容は:


  • 「Keyb. Note =」は、キーボード(鍵盤)での呼び名です。(例えばA4とか)

  • 「MIDI Note =」は、MIDIのノートナンバーです。

  • 「Freq =」は、対応する周波数値(Hz)です。

計算方法は以下のスクリプトです。(メイン部分のみ)
基準となる値は、MIDIノートナンバー69(鍵盤でA4)=440Hzです。
これらを基準として半音の平均率を求める公式を利用して周波数の配列を生成します。
配列のインデックスとMIDIノートナンバーが同じになるように周波数値を代入します。
そうすることで、周波数配列[ノートナンバー]ですぐ目的の周波数値が引き出せます。

function create_fs_array():Array {
	var fs_array:Array = [];
	var max_notes:int = 120;
	for (var i:int = 0; i<max_notes ; i++) {
		fs_array[i] = Math.floor(440*Math.pow(2, (i-69)/12));
	}
	return fs_array;
}

以下、デモサンプルです。
※注)上のサンプルスクリプトでは整数値のみを取り出していますがデモSWFでは小数点下三桁までを求めていますのであしからず・・です。





  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2008年04月29日

Box2DFlashAS3をちょっとだけつまみ食い

フレームワークと言えど、3Dや物理エンジンに関しては、その考え方(または空間イメージ)が理解できないとなかなか自分のものにはならないような気がします。少々勉強が必要ですね。

とりあえず実験(勉強)がてら簡単なサンプルをやってみました。

ステージをクリックするたびにアイコンがランダムな位置から落下します。
他の物体と接触または地面に落下したときは「ある程度」フレームワーク側が処理してくれます。

サンプルコードは、また、あらためて・・・







デモ表示には、FlashPlayer9が必要です。

  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2008年04月07日

主要3ジャンルフレームワークのリンクまとめメモ

これまでは、3Dなら「PaperVision3D」、トウィーンなら「Tweener」と言うように、いつの間にか定番のようになっているものがありましたが、ここに来てオリジナルフレームワークの派生版も含めてかなりの種類が出てきていますので個人メモとしてリンクをまとめてみました。

主要3ジャンル(勝手に主要呼ばわりしてます・・・特に、3D、物理、アニメーション)

■ 3Dエンジンフレームワーク

  → PaperVision3D(今のところ一番人気)
  → Away3D
  → Sandy3D
  → 3D Alternativa Game Engine
  → Flash Isometric 3D Game Engine
  → Five3DAS3

■ 物理エンジンフレームワーク

  → WOW-Engine
  → APE
  → Fisix
  → Box2DFlashAS3(今のところ一番人気??)
  → FOAM
  → Glaze
  → Motor2
  → Physaxe(haXe 2D)

■ アニメーションエンジンフレームワーク

  → Tweener(今のところ一番人気)
  → TweenLite(GreenSock)
  → TweenFilterLite(GreenSock)
  → TweenMax(GreenSock)
  → Go(ActionScript Animation Platform)
  → Twease
  → AS3Easing
  → Animation Package
  → AS3 Animation System v2.0
  → ビルトイン・Tweenクラス (スピード比較によると問題外に重そうだけど・・・)

以上、結構出てますよね。(詳細はリンク先を確認のこと)

どれを使うかはあなた次第!!(笑)

  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2008年04月06日

TweenLightの機能拡張版「TweenMax」がリリース

以前、トウィーンエンジンスピード比較で軽量・高速であることの優位性を盛んにアピールしていたGreenSockの「TweenLight」ですが、やはり他のアニメーションフレームワークと比べると機能が見劣りすることは自覚していたようで、次にFilterトウィーニングを追加した「TweenFilterLite」をリリースし、そして今回さらにベジェトウィーニングを追加した「TweenMax」をリリースしました。

こちらもTweenerとのスピード比較をしていますので興味のある方はどうぞ。

機能を増やしても”軽量・高速”が最大の売りであることは変わらないようです。
TweenLite(3k)、TweenFilterLite(6k)、 TweenMax(8k)

でも、トウィーンのパターンバリエーションが少ないかなあ・・・?!

→ TweenLite (AS3) - A Lightweight (3K) and FAST Tweening Engine
→ Speed Test - Tweening Engine Comparison Tool
→ TweenFilterLite (AS3 Version) - Easily Tween Filters & Image Effects
→ TweenMax (AS3) - TweenLite on Steroids
→ Bezier Tweening Speed Test - How Fast is TweenMax?

  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2008年02月17日

もう”ActionScript 4.0”の話???

コリン・ムック氏のブログエントリ「Upcoming Lecture: ActionScript 4.0??」によると、次期「ActionScript 4.0」で導入されるであろう言語機能についてFITCで講義する旨が書かれています。

→ FITC講義ノート

現時点では確定的なものではなく、ECMAScript 4で提案されたいくつかの機能の中で今後ActionScriptに導入されるであろうという感じのものです。(でもノートに書かれていることはたぶん導入されるんでしょう・・・)

→ ECMAScript 4 Overview(概要PDF)


私の方は、ActionScript 3.0 すら、まだちゃんと足を踏み入れてないのでちょっと焦りが・・・(笑)”Flex 3”と”AIR”が、もうすぐ正式リリースとなりそうなので今の仕事が一段落したら急ピッチで勉強してみますかね。

  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2008年01月17日

シャッフルを目視する

fy1.jpg

11月10日のエントリ配列のシャッフル「Fisher-Yates」でFisher-Yatesアルゴリズムの動作サンプル(SWFのみ)を掲載しましたが、miscellaneousさんのブログエントリ([ActionScript 3.0] Fisher-Yatesアルゴリズムの可視化)で、実際にどのようにシャッフルされているのかを目で確認することができます。

シャッフルされていく過程がなかなかおもしろいです。

ところでこのエントリを書いていて気がつきましたが11月10日のエントリがフロントの最下位に並んでいると言う更新頻度の低さにびっくりです。(笑)

  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2007年11月10日

配列のシャッフル「Fisher-Yates」

配列をランダムにシャッフルする方法はいくつか考えられますが、最近「Fisher-Yates」と言うアルゴリズムがあることを知ったので実際にやってみました。

シャッフル度合いはどの方法でも大差ない(比較が難しい)感じですが、このアルゴリズムはなにせ高速らしいですよ。要素数が多ければ多いほど差が出るようです。





アルゴリズムの詳細については右上のフォームからGoogle検索してみてください。

  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2007年06月09日

CS3コンポーネントで楽々字幕入りコンテンツを作る

CS3の「FLVPlaybackCaptioning」コンポーネントと「FLVPlayback」コンポーネントを組み合わせることで簡単に字幕入りコンテンツを作成することができます。

下記の例(アドビサンプル)では「FLVPlaybackCaptioning」コンポーネントの定義ファイル(ソース)として外部にある「caption_video.xml」を読み込んでいます。

このXMLファイルは、Timed Text (TT) XMLと呼ばれるものでフォーマットや使えるタグが決まっていますのでご注意ください。

つまり外部XMLファイルをこのTimed Text (TT) XMLフォーマットに従って書き換えればウェブ上で字幕を入れるようなサービスがFlashのみで簡単にできることになります。もちろんサーバーへの(読み)書きには何らかのサーバースクリプトが必要だけど。

また、言語別のTimed Text (TT) XMLを用意すれば視聴者の言語環境を判別してそれに対応したファイルを読み込むことも可能ですのでいろいろな使い方が考えられますよね。

ちなみにトランスポートコントロールの右端の2つは「FullScreen」と「Caption」のオン/オフです。このサンプルではフルスクリーンモードにも対応させましたのでアイコンクリックでフルスクリーンモードになります。




■ caption_video.xml

<?xml version="1.0" encoding="UTF-8"?>
 <tt xml:lang="en" xmlns="http://www.w3.org/2006/04/ttaf1" 
  xmlns:tts="http://www.w3.org/2006/04/ttaf1#styling">
    <head>
     <styling>
       <style id="1" tts:textAlign="right"/>
       <style id="2" tts:color="transparent"/>
       <style id="3" style="2" tts:backgroundColor="white"/>
       <style id="4" style="2 3" tts:fontSize="20"/>
    </styling>
   </head>
 <body>
  <div xml:lang="en">
   <p begin="00:00:00.00" dur="00:00:03.07">I had just joined <span tts:fontFamily="monospaceSansSerif,proportionalSerif,TheOther" tts:fontSize="+2">Macromedia</span> in 1996,</p>
   <p begin="00:00:03.07" dur="00:00:03.35">and we were trying to figure out what to do about the internet.</p>
   <p begin="00:00:06.42" dur="00:00:03.15">And the company was in dire straights at the time.</p>
   <p begin="00:00:09.57" dur="00:00:01.45">We were a CD-ROM authoring company,</p>
   <p begin="00:00:11.42" dur="00:00:02.00">and the CD-ROM business was going away.</p>
   <p begin="00:00:13.57" dur="00:00:02.50">One of the technologies I remember seeing was Flash.</p>
   <p begin="00:00:16.47" dur="00:00:02.00">At the time, it was called <span tts:fontWeight="bold" tts:color="#ccc333">FutureSplash</span>.</p>
   <p begin="00:00:18.50" dur="00:00:01.20">So this is where Flash got its start.</p>
   <p begin="00:00:20.10" dur="00:00:03.00">This is smart sketch running on the <span tts:fontStyle="italic">EU-pin computer</span>,</p>
   <p begin="00:00:23.52" dur="00:00:02.00">which was the first product that FutureWave did.</p>
   <p begin="00:00:25.52" dur="00:00:02.00">So our vision for this product was to</p>
   <p begin="00:00:27.52" dur="00:00:01.10">make drawing on the computer</p>
   <p begin="00:00:29.02" dur="00:00:01.30" style="1">as <span tts:color="#ccc333">easy</span> as drawing on paper.</p>
  </div>
 </body>
</tt>
  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2007年02月22日

AS2(Flash 8)でフルスクリーンを使ってみる

Flash Player 9で実装されたフルスクリーンモードですがFlash 8の開発環境でもクラスファイルに一手間加えれば簡単に実装できますのでやってみました。
もちろんFlash Player は、フルスクリーン可能な「9,0,18,0」以降が必要です。



Stage.as クラスファイルに「Stage.displayState:String」プロパティを追加する。

//****************************************************************************
// ActionScript Standard Library
// Stage object 
//****************************************************************************

intrinsic class Stage
{
static var displayState:String;//追加
static var align:String;
static var height:Number;
static var scaleMode:String;
static var showMenu:Boolean;
static var width:Number;

static function addListener(listener:Object):Void;
static function removeListener(listener:Object):Boolean;
}

アクションとしてはプロパティの値を「normal」か「fullScreen」にセットするだけです。

Stage.displayState = "fullScreen";
//Stage.displayState = "normal";

必要であればイベントリスナーを設定します。

EventListener.onFullScreen = function( bFull:Boolean ){}
Stage.addListener( EventListener );

HTMLコーディングではパラメータの追加も必要ですのでお忘れなく。

param name="allowFullScreen" value="true"
allowFullScreen="true"
  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2006年02月21日

Tweenクラスいじりーその2

3つ前のエントリで取り上げたTween クラスのイベントを使ってフィルタを適用してみました。

■エラスティックイースアウト+モーションブラー+ドロップシャドー。
(ボールをクリック!)

import flash.filters.DropShadowFilter;
import flash.filters.BlurFilter;
import mx.transitions.Tween;
import mx.utils.Delegate;
//DropShadow setup...etc...
mc.onPress = function():Void {
var tw:Tween = new Tween(this, "_x", mx.transitions.easing.Elastic.easeOut, 30, 300, 3, true);
tw.onMotionChanged = Delegate.create(this, move_me);
};
function move_me():Void {//Blur actions...etc...};





  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2006年02月04日

使えばそれなりに便利なパッケージ

存在すらよく知られていないTransitionManagerクラスやTween クラスですが使ってみればそれなりに便利なクラス達です。
たまには安易な(?)方向に走るのもいいかもね・・・

■バネのような動きでイースアウトします。(ボールをクリック!)

import mx.transitions.Tween;
var tw:Tween = new Tween(mc, "_x",mx.transitions.easing.Elastic.easeOut, 0, 300, 3, true);
//
Tween( obj:Object, prop:String, func:Function, begin:Number, finish:Number,duration:Number, useSeconds:Boolean )





■”Iris” トランジションで現れます。

import mx.transitions.*;
import mx.transitions.easing.*;
TransitionManager.start(mc, {type:Iris, direction:Transition.IN,duration:5, easing:Bounce.easeOut, startPoint:5, shape:Iris.CIRCLE});


■下のSWFサンプルファイルは、Flash 8\ja\First Run\Behaviorsフォルダ内にあるものです。





  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2006年01月19日

9スライス機能を使ってみる

9スライスの拡大/縮小を使って縦横スケールチェンジ時の外枠の変形を抑えてみました。
(四隅の三角張り出し部分に注目)
このガイド枠設定はスクリプトで記述するよりはシンボル編集を使った方が簡単ですね。
このサンプルではドロップシャドーもスクリプトではなくオブジェクトインスペクタのフィルタ機能を使っています。
ドロップシャドーのプロパティを動的にコントロールする必要がないのであればこちらの方がだんぜん楽ちんですね(笑)

※サンプルは、↓






  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2005年11月18日

Flash 8 Component: Tile Transitions

macromedia機能拡張ファイルActionScript.comにてFlash 8用のタイルトランジッションコンポーネントが公開されていて自由にダウンロード可能となっています。

用途としてはスライドショーのための画面切換エフェクトです。
ステージ上に置いたコンポーネントにインスタンス名を付け(下記サンプルでは、「clip」)コンポーネントインスペクタにパラメータをセットすることで実際に書くスクリプトは最小限で済みますので扱いが非常に簡単です。
エフェクトに関してもランダムという項目が選べますので用意されたエフェクトをランダムに適用することができます。

function nextImage() {
clip.getNextImage();
}
setInterval(nextImage, 6000);

プロパティインスペクタ

■コンポーネントで利用可能なメソッド(パラメータ)一覧(API)

  setEffectSpeed(n:Number):Void
setEffectType(s:String):Void
setImageArray(a:Array):Void
setNumberAffected(n:Number):Void
setTileWidth(n:Number):Void
setTileHeight(n:Number):Void
getNextImage():Void
getPreviousImage():Void

↓画面サンプル↓


※要Flash Player 8





  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2005年09月17日

「ぼかし」ては見たけど・・・その2



昨日のサンプルだとあまりにシンプル過ぎるので、「setInterval()」関数を使って任意のタイミングで移動スピードとぼかし量を任意の数値に変化させてみました。

これだと少しはモーションブラーな感じがでるんじゃないでしょうか?(笑)

ついでにステージ上のカーソル横移動で円の幅を変化させてみました

■後日談
この回転サンプルが2つ並んでいるとなぜか自宅のiMac-G5のファンがかなりの勢いで回るのでプログラム的には大した分量でも負荷のかかるようなロジックでもないけどマック的(iMac-G5 rev.A+ブラウザ+Flash Player 8+回転サンプル*2)にはCPUに負荷がかかるようです。(ウィンドウズには関係無し)

  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2005年09月16日

とりあえず、「ぼかし」ては見たけど・・・



☆サンプルスクリプト(フィルタ適用部分のみ)

 var my_blur = new flash.filters.BlurFilter();
my_blur.quality = 2;
my_blur.blurX = 5;//横移動のモーションブラー効果を狙ってX軸のみ適用してみる
my_blur.blurY = 0;
mc.filters = [my_blur];

定速で動いてるのでモーションブラーとしての視覚的効果はイマイチ、減速なり、加速なりで値を変化するともうちょっとましかも?

  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2005年07月17日

Flash 8用にパブリッシュする

flash昨日のブログでベータテスター以外の人はどうやって作ってるんだ?と言うことを書きましたが何故かタイミングよくその解説がOpen Source Flashサイトを含めて海外の多くのブログにでてましたので自分用のメモとしても掲載しておきます。

■デフォルトをエディットしてFlash 8用のProfileを作成する

<flash_profile version="1.0" name="Flash 8"> //2行目
     --
     --    
<Version>8</Version> //64行目

Flash8 Profile
上記の編集項目にしたがってFlash8用のProfileを作成し「パブリッシュの設定」で読み込むと左図のようにターゲットプレイヤーとActionScriptが選択されます。
後は、パブリッシュするだけです。

現時点では、マクロメディアのサポートはプラグインのみなのでプラグインをインストールしたブラウザでしか確認できませんが、F·L·A·S·H·I·S·Mサイトに「Standalone FlashPlayer 8」というのがあるのであくまで自己責任ですがオーサリング時のプレビューが可能かもしれません(実験してないので何とも・・・)

試しにOpen Source Flashに掲載されていたサンプルをフレーム1に記述しパブリッシュしてみます。

■テキストにドロップシャドーを付ける

// テキストフィールドを作成する
this.createTextField("txtField", this.getNextHighestDepth(), 10, 10, 300, 100);
txtField.html = true;
txtField.htmlText = "<font size='60'>Hello World!</font>";
txtField.textColor = 0x0055CC;
// アンチエイリアスモードに設定する
txtField.antiAliasType = flash.text.TextRenderer.AntiAliasType.ADVANCED;
// ドロップシャドーフィルターを作成する
var dropShadow = new flash.filters.DropShadowFilter();
dropShadow.blurX = 5;
dropShadow.blurY = 5;
dropShadow.distance = 3;
dropShadow.angle = 35;
dropShadow.quality = 2;
dropShadow.alpha = 0.5;
//ドロップシャドーフィルタを適用する
txtField.filters = [dropShadow];

※Player 8 がインストールされていればテキストにドロップシャドーが付いているハズ?です。





  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2005年07月15日

問題はFLVのバージョンだった・・・

flashMediaクラスにおける「complete」イベントやtotalTimeプロパティの認識、その他もろもろの不具合は、結局のところFLVのバージョンの問題でした。

この問題が解決すればメディアの再生が終了した(最後まで再生した)ときに「complete」イベントが発生しますのでヘルプマニュアルに沿って終了時のアクションが簡単に実装できます。

■下記のサンプルではv7.2アップデータで追加されたDelegateクラスを使ってます。

import mx.utils.Delegate;
function my_event (evt : Object):Void
{
  stop_action ();
}
mdisplay.addEventListener ("complete", Delegate.create (this, my_event ));

今回の仕事ではエンジンとなるプログラムだけを書いてるのでFLVファイル自体のバージョンにはまったく気が行ってなかったのですが以下のヘルプ内容により疑いを持って検証してみたらやはりFLVの問題でした(ちなみに最新版は、Flash Video Exporter 1.2です)。

以下、ヘルプ引用:

ビデオの種類に MP3 を選択すると、ビデオ時間コントロールは使用できません。この情報は MP3 ファイルを使用するときに自動的に読み込まれます。Flash Video Exporter 1.0 で作成された FLV ファイルでは、メディアの合計時間 (Media.totalTime) を入力し、MediaPlayback コンポーネント (またはリスニングしている MediaController コンポーネント) の再生バーに再生の進行状況が正確に反映されるようにする必要があります。Flash Video Exporter 1.1 以降で作成された FLV ファイルでは、継続時間が自動的に設定されます。

FLVのバージョン、それも小数点バージョン(1.0とか1.1とか)を確認するようなユーティリティソフトウェアがないものかとネットをいろいろ探してみましたが見つからなかったので、Flash Video を扱う方はご注意あれ・・・

  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2005年06月25日

Mediaクラスの不具合?に振り回される

flash現在、Mediaクラス(コンポーネント)を使っていろいろプログラムを書いているんですがバグなのか何なのかヘルプに記述があっても正しく機能しないイベントやらプロパティがいろいろあって完全にハマリこんでます。

まず、「complete」イベントハンドラがまったく機能しません。

これは、国内の検索ではほとんどヒットしませんでしたが海外の検索でヒットしたものを読んでみるとみんな同じようにはまってるようです。(解決策を提示してるところは見つからない・・・)

マクロメディアヘルプによると、「Mediaコンポーネント」のインスタンスに対して以下のようにリスナーイベントを割り当てることでメディアの再生終了を通知することが可能なハズですが実際は何も起こりません(爆)

■Flash Helpより
var myListener = new Object();
myListener.complete = function(eventObject) {
 trace("メディアが終了しました");
};
myMedia.addEventListener("complete", myListener);

この何も起こらないことが正しいことを知るまでに無駄な時間を過ごしました(爆2)

まあ、これがダメなら他の方法で・・・と言うことでメディアの終点(タイム)?を知るためのプロパティとして:

myMedia.totalTime

を使ってみるが、実際のビデオの長さと違うためうまくいかない。
(FLV再生時直後はundefinedで、その後値を読み込むが実時間より長くなるため使えない)

おまけに

myMedia.playing

の値が、再生中はTRUEだがメディアの終点で停止してもTRUEのまま。
myMedia.pause()やmyMedia.stop()で停止したときはFALSEになる)

と言うことで、あれこれ解決策を考え中です・・・(cuePoint又はchangeイベントが妥当な策かも?!)

それにしても・・・ねえ・・・ヘルプにあるものは正しく実装していて欲しいよね・・・
(後日談:実はFLV書き出しソフトウェアの問題かも???要検証)


■後日談

「complete」イベントは再生メディアタイプがMP3の場合はうまく働くようです。
オマケに最後まで再生すると再生ヘッドが自動的に0に戻ってしまいますのでFLVで使用した場合とMP3で使用した場合とでは動作結果にかなり差がありそうです。

要はMP3の場合は、マニュアルにあるイベントが正しく動作しメディアの再生ヘッドが最後まで行くと自動的にアタマに戻ると言うきわめて望み通りの動きです。
FLVでもこの動きが欲しいわけですが・・・再生ヘッドの終点がトータルタイムプロパティの値より短いので終点が一致せず、つまりはcompleteイベントが発生しない&playingプロパティもtrueのままで止まってしまう・・・と言う感じが一番近いかもです。

FLVの場合は、exporter(書き出し)のバージョン等によってもかなり違いがありそうですね。

以下、ヘルプ引用:

ビデオの種類に MP3 を選択すると、ビデオ時間コントロールは使用できません。この情報は MP3 ファイルを使用するときに自動的に読み込まれます。Flash Video Exporter 1.0 で作成された FLV ファイルでは、メディアの合計時間 (Media.totalTime) を入力し、MediaPlayback コンポーネント (またはリスニングしている MediaController コンポーネント) の再生バーに再生の進行状況が正確に反映されるようにする必要があります。Flash Video Exporter 1.1 以降で作成された FLV ファイルでは、継続時間が自動的に設定されます。

ファイルの種類を FLV に設定すると、[Milliseconds] オプションと ([Milliseconds] を選択していない場合は) [FPS] ポップアップメニューが表示されます。[Milliseconds] を選択すると、FPS コントロールは非表示になります。このモードでは、実行時に再生バーに表示される時間は HH:MM:SS.mmm (H = 時間、M = 分、S = 秒、m = ミリ秒) 形式になり、キューポイントは秒数で設定されます。[Milliseconds] を選択していない場合は、FPS コントロールが有効になり、再生バーの時間は HH:MM:SS.FF (F = 1 秒あたりのフレーム数) 形式になります。また、キューポイントはフレーム数で設定されます。

ここのタイトルに「Mediaクラスの不具合・・・」と書きましたが、もしかしたらFLV側のフォーマット問題かもしれませんね???

今後、FLVに関しては検証を試みてまた結果をこのブログに書きたいと思います。

  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2005年06月10日

Flash /JavaScriptインテグレーションキット

Flash /JavaScriptインテグレーションキットは、FlashとJavaScriptの間でシームレスに通信することを可能にします。 FlashからJavaScript関数又はJavaScriptからActionScript関数を簡単にコールすることができます。

これまでもfscommand()やgetURL()と言ったFlashとJavaScript間をやり取り可能なものがありましたが、Flash /JavaScriptインテグレーションキットは、これらを拡張し、よりスマートでフレキシブルなスタイルになっています。

■主要なファイル

  • JavaScriptFlashGateway.swf

  • Exception.js

  • FlashTag.js

  • FlashSerializer.js

  • FlashProxy.js

  • com.macromedia.javascript.JavaScriptProxy.as

  • com.macromedia.javascript.JavaScriptSerializer.as


■インストレーション及び使用方法に関するドキュメント(もちろん英語です)

☆Calling a JavaScript function from ActionScript(EX.)

import com.macromedia.javascript.JavaScriptProxy;
var proxy:JavaScriptProxy = new JavaScriptProxy();
proxy.call("javaScriptMethodName", "arg1", new Object());
proxy.javaScriptMethodName("arg1", new Object());

  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2005年04月08日

右クリックメニューにライセンス項目を追加

コンテクストメニュー現在開催されているFlashforward2005カンファレンスで行われたスタンフォード大学Larry Lessig教授の基調講演「Flashはもっとオープンに」での指摘を受けてかどうか分かりませんが、MacromediaのMike Chambersブログにてさっそくコンテクストメニューにライセンス項目を追加する外部ASファイル(関数ファイル)が公開されました。

この提供ファイルでは、ライセンスURLやファイルパスをHTML側からパラメータとして渡していますがファイルのアドレス等を隠したい場合はFlash側のみで完結してたほうがいいかもしれません。

■EMBED(Object)タグパラメータでFLAファイルのパスとライセンスのアドレスを渡す(例)

flashVars="flashSource=example%2Efla&contentLicense=http%3A%2F%2Fcreativecommons%2Eorg%2Flicenses%2Fby%2F2%2E0%2F"

■Flashに外部ファイルを取り込む
#include "viewFlashSource.as"

※「View Source」で指定ファイル(FLA)をダウンロード又はテキスト表示とか?
※「View License」でライセンスページの表示(URL移動)

Creative Commons LicenseLarry Lessig教授はソース及びファイルのCreative Commonsライセンスでのオープンな共有を訴えているようですが現状でソースやFLAファイルを喜んで提供する人がどれだけいるかはかなり疑問です。

  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2005年02月24日

Videoとアニメーションの同期をとる

flashFlashフレームアニメーションとFlash Video(FLV)の同期を取るにはいくつかの方法があります。

まず、最初の方法は、Flashにビデオを埋め込みフレームアニメーションのひとつとして同期させる方法です。これは、通常のフレームアニメーションの制作方法と何ら変わりありません。

もう一つの方法は、メディアコンポーネント(Professionalのみ)を使用してキューポイントからコントロールする方法です。

MediaDisplayコンポーネントインスペクタ


MediaDisplayコンポーネントインスペクタにはキューポイントを設定する項目があります。

ここで設定したキューポイントはリスナーイベントとして読み出すことが可能です。

以下のサンプルではMediaDisplayコンポーネントのオブジェクト名を「mdisplay」としています。

function cuePoint(evt) {
   trace(evt.cuePointName);
}
//
mdisplay.addEventListener("cuePoint", this); //リスナーを設定する
//

キューポイントは、スクリプトから設定することもできます。
mdisplay.addCuePoint("c2", 10.0);

ただし、どれくらい正確なタイミングで読み出せるかは自分で実際に試してみてください。
例えば音楽のメトロノーム(4分音符のタイミング)のように1秒以内の任意の間隔で設定したキューポイントを正確に読み出せるかどうかは微妙なところです。

  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2004年11月01日

繰り返しの中に不規則性を作る

flashフレームループの中で繰り返しMCを生成しようとする場合、単に生成アクションを記述すればよいのですが、時としてこの繰り返しの中で不規則に生成したい場合があります。
例えば、雪や雨といった自然界の現象をシュミレーションする場合がそのひとつです。
あまりに決まり切った間隔で繰り返し生成されるよりは多少のズレがあったほうがよりリアルですよね。
その場合、下記のサンプルのように狭い範囲のランダム値を使うのもひとつの方法です。
また、落下の際の横ぶれの設定やスピードにも利用すればなおリアルさが増すでしょう。


■ランダム値(狭い範囲)を使った一例

_root.onEnterFrame = function() {
 var make:Number = 1+Math.round(Math.random()*3);
 if (make == 2) {
  //生成アクション
 }
};

  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2004年09月08日

DrawAPIでトゥイーンする

actionscriptMC prototypeを提供しているサイトに使い方のおもしろいサンプルがあったので多少エディットを加えてアップしてみました。
と言うことで今回スクリプトの詳細は省略します。

下記サンプルのように現時点のDrawAPIでは図形を描画するぐらいしかできませんが今後、画像データも扱えるようになればもっとおもしろいエフェクトが作れそうな気がします。
例えばOSXのジニーエフェクトやSunのLooking Glassようなことができるかも?




  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2004年08月08日

AMFPHPの準備(その2)

「flashservices」フォルダが準備できたら、examples/basicフォルダ内にあるgateway.phpをflashservicesフォルダに移動します。
後でサンプル(examples.fla)を動かしますので、ついでにexamples/basic/servicesフォルダ内のファイルをflashservices/servicesフォルダ内に移動します。
これらのファイルはパスさえ通っていれば本来移動する必要のないファイルですがパス位置を固定することによりActionScript側で記述する際に少しだけ楽になります。

<ActionScript例>(赤字は絶対パス

NetServices.setDefaultGatewayURL("http://xxx/flashservices/gateway.php");

■gateway.phpの中身(赤字は相対パス
(移動後は赤字のパス部分を下記の内容に変更する)

<?php
 include "./app/Gateway.php";
 $gateway = new Gateway();
 $gateway->setBaseClassPath("./services/");
 $gateway->service();
?>

(続く・・・)

flashservice

  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2004年07月26日

AMFPHPの準備(その1)

AMFPHP(Flash Remoting for PHP)を利用するにはまずサーバーでPHPを使えることが前提です(当たり前ですが・・・)

■Flash側の準備
Flash Remotingコンポーネントをダウンロードし、インストールしてください。
Flashのバージョンによってダウンロードするファイルが違いますので自分の環境に合ったものを選択してください。

■サーバー側の準備
AMFPHPダウンロードしてください。
(現時点の最新バージョンは、0.9.0です)

flashservice解凍したファイルは、左図のようにhttp://localhost/としたときのサーバールートディレクトリに置きます。
AMFPHPとして重要なフォルダは「flashservices」フォルダですのでこのフォルダは丸ごとアップします。
後は、ActionScriptからAMFPHPに接続する「gateway.php」と実際のメソッド処理を行う「クラスファイル.php」が必要になります。

(続く・・・)



  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2004年07月25日

treeコンポーネントを使ってみる

flashダイアリー(blog)の方では表示(SWF)のみを簡単に取り上げたTreeコンポーネントですが、ここではもう少し詳しく取り上げたいと思います。
Treeコンポーネントは、階層データを表現することができますのでファイルブラウザやデータベースのカテゴリブラウザに使うと便利かもしれません。

手順としてはTreeコンポーネント用フォーマットで記述されたXMLファイルをTreeコンポーネントDataProviderインターフェイスにセットするだけです。
以下のサンプルではリスナーにカスタムイベントを設定し右側テキストエリアに表示しています。







     ↑treeコンポーネント(tree_comp)  ↑textareaコンポーネント(txt_comp)


■frame 1 アクション(AS2)

System.useCodepage = true;
var obj_xml :XML= new XML();
obj_xml.ignoreWhite = true;
obj_xml.load("tree_source.xml");//外部XMLファイルをロードする

// XMLをデータプロバイダにセット
obj_xml.onLoad = function(success:Boolean):Void{ 
 if (success) {
  tree_comp.dataProvider = obj_xml;
 } else {
  text_comp.text = "xml load error";
 }
 //trace(success);
}
var myListener:Object = new Object();//リスナーオブジェクトの生成
//ノードオープンハンドラ
myListener.nodeOpen = function ( eventObject:Object ):Void{
 txt_comp.text += "<li>"+eventObject.node.attributes.label + " を開く</li>";
}
//ノードクローズハンドラ
myListener.nodeClose = function ( eventObject:Object ):Void{
 txt_comp.text += "<li>"+eventObject.node.attributes.label + " を閉じる</li>";
}
//イベントチェンジハンドラ
myListener.change = function ( eventObject:Object ):Void{
 var theSelectedNode = eventObject.target.selectedNode;
 var theSelectedNodeLabel = theSelectedNode.attributes.label;
 txt_comp.text += "<li>"+theSelectedNodeLabel + " を選択</li>";
}
// リスナーにイベントを追加
tree_comp.addEventListener ( "nodeOpen", myListener );
tree_comp.addEventListener ( "nodeClose", myListener );
tree_comp.addEventListener ( "change", myListener );

■Treeコンポーネント構造定義の外部XMLファイル

<node label = "Logicalyze Web">
 <node label = "WorkShop">
  <node label = "HandBook Support" />
  <node label = "ActionScript Lab." />
  <node label = "Lingo Workshop" />
  <node label = "SSL-G Manual" />
  <node label = "Timecode Manual" />
 </node>
 <node label = "Software">
  <node label = "Chord Composer" />
  <node label = "Studio Calculators Mac" />
  <node label = "Studio Calculators Win" />
  <node label = "Studio Refference" />
 </node>
 <node label = "Link" />
 <node label = "Column">
  <node label = "Web Short Tips" />
  <node label = "PowerBook Report" />
 </node>
 <node label = "Recommend Balladas" />
 <node label = "Profile" />
 <node label = "Blog Diary" />
</node>


使い方のより詳しい解説はFlash MX 2004内のヘルプをご覧ください。
ブログなのでこの程度で・・・

  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする

2004年07月02日

スケール操作で簡単3D回転(してるふり)




通常、MovieClipを回転させるには_rotationプロパティを使いますが、左側に表示しているサンプルのようにスケール値を操作することで三角関数のような計算を使わなくても簡単に擬似3Dもどきに回転させることができます。
スケールは+100~-100の値で変化させることにより基準点を中心に完全反転させ再び元に戻すことを繰り返します。
表示サンプルは一定の速度で変化させていますのでいまいち味気ないかもしれませんが変化の速度を換えることでもう少しおもしろい感じを出せるかもしれませんね。

また、表示サンプルのように下側に影のMovieClipを用意し同じように変化させることでより立体的に見せることもできます。(そう言う風に見えてますか?)

<スクリプトの一例>

  var speed:Number = 5; 
var dir:Number = -1;
_root.r_mc.onEnterFrame = function() {
  if (this._xscale>100 || this._xscale<-100) {
   speed *= dir;
  }
  this._xscale += speed;
}


Type2



Type1のサンプルだと100%ないしは-100%の最大時から反対方向に数値が変化するときにどうしても違和感を生じてしまいます。
これを解消するには、やはり三角関数のコサイン値を利用して横スケールをスムースに変化させるようにします。
コサイン値は角度の変化(円運動)によって+1~-1の間を繰り返しますのでこの値をスケール変化に利用することでよりスムースな回転に見せることができます。
Type1とType2の回転(横スケールの変化)のスムース具合の違いが分かると思います。

<スクリプトの一例>

  var speed:Number = 5; 
var radian:Number = Math.PI/180;
var degree:Number = 0;
_root.r_mc.onEnterFrame = function() {
  degree += speed;
  var cos_x:Number = Math.cos(radian*degree);
  this._xscale = cos_x*100;
}


Type3





上のサンプルで_rotationとコサイン値を利用して左右に揺らしてみましょう。

<スクリプトの一例>

 this._rotation = cos_x*10; 

  • このエントリーをdel.icio.usに追加する
  • このエントリをニフティクリップに追加
  • POOKMARK Airlinesへ追加
  • このエントリをLivedoor クリップに追加
  • このエントリーをはてなブックマークする