AS3

LocalConnectionいじくり回せばできるんじゃね？ってことで作ってみた。

仕組みは簡単。
TextFieldだけのswfを別ウインドウで開いて
LocalConnectionでテキストを送信。
別ウインドウのswfの方で表示。

コネクションIDをurlに付けてjsで受け渡しししたり、
navigateToURLでウインドウ開くまでタイムラブがあったりするので
いろいろごにょごにょしてたりするけど。

ただ、safariだと

navigateToURL(new URLRequest(_url), "newwin");

で一度開いたウインドウがリロードされずに新しくウインドウが開く。激しくウザイ。

まぁ、おとなしくdebag playerつかえってことですかね。

クライアント側のソースもwonderflにのせときます。

オンラインtraceのclient側 – wonderfl build flash online

特定の環境下でflashが正常に表示されない現象に遭遇。

イロイロしらべた結果、
どうもEvent.COMPLETEとキャッシュっぽい。

参考
LoaderInfoでキャッシュがある時の動作について

※ちなみに上記記事にはifの分岐に誤りがあって正しくは

if(info.bytesLoaded == info.bytesTotal){
	init();
}else{
	info.addEventListener(Event.COMPLETE,onCompleteFunc);
}

バグが発生する条件は確認できた限りで

• IE7/6
• Flash Player9.045
• Objectタグを直接htmlに記述
• IEの設定でキャッシュを有効にする

以上の組み合わせの時。

SwfObjectを使えば発生しないのでオーサリング/テスト時に全く気付かなかった罠。

自作で便利だったので公開。
タイムラインでアニメーションするMovieClipを再生。
停止を待つThread（そうめん）用のスクリプト。

package {
    import flash.display.DisplayObject;
    import flash.events.Event;

    import org.libspark.thread.IMonitor;
    import org.libspark.thread.Thread;

    public class TimelineThread extends Thread {

        private var _mc:DisplayObject;
        private var _frame:*;

        public function TimelineThread(mc:DisplayObject,frame:*=1) {
            _mc = mc;
            _frame = frame;
        }

        public function cancel():void {
            interrupt();
        }

        override protected function run():void {
            interrupted(interruptedHandler);
            _mc.gotoAndPlay(_flame);
            event(_mc, Event.COMPLETE, completeHandler);
        }

        private function completeHandler(e:Event = null):void {

        }

        private function interruptedHandler():void {
            _mc.stop();
        }
    }
}

親のThread内で

var _timelineThread:TimelineThread=new TimelineThread(button_mc, 2)
_timelineThread.start();
_timelineThread.join();

としてムービークリップへの参照と、再生したいフレーム（数値 or フレームラベル）を渡す。

ムービークリップ内で次の処理に移行したいフレームにEvent.COMPLETEを記述。

this.stop();
dispatchEvent(new Event(Event.COMPLETE));

アニメーションを止める必要が無ければthis.stop();はいらない。

BeTweenAS3ではeasingのBackとElasticについて
それぞれイージングの調節が出来るようになっている。

Backの場合、以下のプロパティが用意さている。

Back.easeInWith(s:Number = 1.70158)
Back.easeOutWith(s:Number = 1.70158)
Back.easeInOutWith(s:Number = 1.70158)
Back.easeOutInWith(s:Number = 1.70158)

例えば

BetweenAS3.tween(box, {x:400},  null, 10, Back.easeOutWith(3.5));

て感じで指定するとBackの振れ幅が大きくなる。
デフォルト値は1.70158。

Elasticの場合も同様。ただしこちらは引数が2つ

Elastic.easeInWith(a:Number = 0, p:Number = 0)
Elastic.easeOutWith(a:Number = 0, p:Number = 0)
Elastic.easeInOutWith(a:Number = 0, p:Number = 0)
Elastic.easeOutInWith(a:Number = 0, p:Number = 0)

aとpは amplitudeとperiodかな。
http://blog.nipx.jp/2008/04/elastic-transition-amplitude-p/

ちなみにTweenerでも同様の調整が出来るそうで。
http://saqoosha.net/2008/02/19/641/

ボタンのhitArea（座布団）として透明のオブジェクトを使う場合、
alpha=0のobjectを使った方が良いのか、
それともblendModeの方が良いのか気になったので検証してみた。
ついでにSimpleButtonも。

alpha版、blendMode版、SimpleButton版のどれで
見た目が変わらない（背景に影響を与えない）状態で
5×5pixelのボタンを一面に敷き詰めた。
約8500個。

思った以上に差は出てない。
強いていえばSimpleButtonが若干FPS落ちるくらい？
うーん・・・何とも微妙な結果に。

BeTweenAS3を使ったチョー簡単モーションタイポ。

MovieClipに対して名前付けたり、それをArray化したりするのがかなり面倒で
複数行のモーションタイポはあんまり使っていなかった。
でもBeTweenAS3のおかげで簡単にできる方法を見つけたので掲載。

• 空のMovieClip内にテキストを配置。
• 修正 > 分解
• 全部のオブジェクトが選択された状態で右クリック > レイヤーに配分
• 全部のレイヤーが選択された状態でタイムラインを右クリック > モーショントゥイーンを作成
• 念のためもう一回右クリック > トゥイーンを削除
• このMovieClipに基本クラスで以下の様な外部クラスを指定。

MovieClipに対して名前を付けたりする手間が無く、かなりの手数が省略できる。

package{
	import flash.display.Sprite;
	import flash.utils.describeType;
	import org.libspark.betweenas3.BetweenAS3;
	import org.libspark.betweenas3.easing.*;
	import org.libspark.betweenas3.tweens.ITween;
	import org.libspark.betweenas3.tweens.IObjectTween;
	import org.libspark.betweenas3.events.TweenEvent;
	public class TextMotion extends Sprite {
		public var TweenList:Array=[]
		public var i:uint=0;;
		public var allTween:ITween;
		public function TextMotion() {
			while(i!=numChildren){
				switch (String(describeType(getChildAt(i)).@name)) {
					case "flash.display::Shape":
					var obj = getChildAt(i);
					obj.alpha=0;
					var _t:ITween =  BetweenAS3.parallel(
						BetweenAS3.tween(obj, {x:obj.x,y:obj.y},  {x:obj.x-50,y:obj.y-50}, 0.5, Back.easeOut),
						BetweenAS3.tween(obj, {alpha:1},  {alpha:0}, 0.5, Sine.easeOut)
					);
					TweenList.push(BetweenAS3.delay(_t,i*.1));
					break;
					default:
					break;
				}
				i++;
			}
			allTween = BetweenAS3.parallelTweens( TweenList );
			allTween.play();
		}
	}
}

describeTypeでflash.display::Shapeだけを引き抜く様にしてるが、
@baseでクラスを指定したり、いろいろ応用可能。
トゥイーン n のグラフィックシンボルはフォルダに入れないとライブラリがカオスになる。

このMCをメインタイムラインに配置して、メインタイムラインをstop()
onCompleateでメインタイムラインを再生とかも簡単。

allTween.onComplete = _onComplete
allTween.onCompleteParams = [this]
_onComplete=function(d){
	d.parent.nextFrame();
}

こんな感じ。

すげーBeTweenAS3。
BeTweenAS3ヤバイ！

ちなみにscaleXとscaleYを変更しようとするとちょっと挙動が怪しい。

blendMode=”layer”ではまった。

表示オブジェクトに対しblendMode=”layer”とすれば表示オブジェクト内の透明度がグループされる。
はずなのだが、どうやらcacheAsBitmap=true,
「もしくはランタイムビットマップキャッシュを使用する」にチェックが入っている場合、表示オブジェクト内の透明度がグループ化されない。

どういう事かというと、

全て赤のシェイプの上に白のシェイプを重ねている。

一番上が普通のアルファトゥイーン。
アルファの途中段階でピンクが表示される。
2番目がblendMode=”layer”。
アルファの途中段階はグレーになる。
3番目がcacheAsBitmap=true。
アルファの途中段階でピンクが表示される。
ここでちょっとあれ？と思う。はず。
4番目がblendMode=”layer”とcacheAsBitmap=true。
アルファの途中段階はグレーになると思うがなぜかでピンクが表示される。

内部的な処理については下記の記事で詳しく解説されている。
cacheAsBitmapの法則

これバグじゃね？とか思いつつ
そもそもcacheAsBitmapとblendModeを同時に使う状態がおかしいのかもしれない自分の実装の甘さを嘆くことにする。