ActionScript3.0のオープンソースライブラリ「Box2DFlashAS3」
の紹介をGIGAZINEさんでやっていたのでリンク。
Directorでは以前から高度な物理シミュレーションが可能だったのだけれど
商業的なコンテンツで活用された例を知りません。
物理シミュレーションがどのように商業利用されていくのか、行かないのか
興味津々です。
Category Archives: as3
AS3日記（9）：マウスイベント3
マウスイベントの最終回はMOUSE_LEAVEのお話し。
あと、説明し忘れていたボタンモードについても後半に。
●MOUSE_LEAVE
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
タイトルにマウスイベントと書いたものの、マウスイベントではないかも
しれません。だって下のようにMouseEventではなく、Eventのプロパティに
なっているから…。
stage.addEventListener(Event.MOUSE_LEAVE, this.leaveFunc);
そしてもう一つポイント、このMOUSE_LEAVEはstageオブジェクトにしか
利用できません。そしてAS2のことと異なり、stageのsは小文字な事に注意してください。
stage.addEventListener(Event.MOUSE_LEAVE, this.leaveFunc);
１つ前のエントリーのサンプルではこれを大文字にしていて、
なんで機能しないんだろー、と考え込んでしまいました…。
●buttonMode
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
AS2ではマウスイベントを設定すれば、カーするがムービークリップに重なったとき
に指カーソルに変わりますが、AS3では変わりません。buttonModeプロパティを
trueにすることで変わるようになります。
また、これはマウスイベントを設定しなくてもtrueにすると指カーソルになります。
あと、これをtrueにするとAS1の時からある_upや_overといったフレームラベルを
利用できるようになりますが、これらは授業ではやりませんので、説明しません。
this.buttonMode = true;
さて、次回はAS２でいうところのアタッチの仕方について説明
しようとおもいます。
MOUSE_LEAVEサンプル
AS3で新しく追加されたMOUSE_LEAVEイベントのサンプル。
AS2まででのコンテンツではカスタムカーソルを利用しようとしても
Flash外にカーソルが出たときにFlash内にカーソルが置き去りにされて
しまうのだけれど、AS3のMOUSE_LEAVEを利用すれば
Flash外にカーソルが出たときにイベントがとれるので、
そのタイミングでvisibleをfalseにしてしまえばカーソルが残ることが
ありません。
これを利用すればインターフェイス講座のときに説明した、
ハイドメニューやプルダウンメニューの問題解決にもつながります。
sandy
結構前に試したまま放置していたファイルを見つけたのでアップ。
sandyというFlash用の３Dライブラリ群？なオープンソースを使ってます。
マウスの位置に合わせて、球体が回転するよ。
AS3日記（8）：マウスイベント2
さて、今回も引き続きマウスイベントのお話し
では早速
●dragOver、dragOut
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
授業の時にも、これを設定しないとバグが発生することを確認しましたが
前回のマウスイベントのリストには、これに該当するものがありません。
ではどうするかというと、
イベントが発生したときに実行するカスタムメソッドでは
引数を受け取らなければなりませんでした、この引数はイベントオブジェクトと
呼ばれるもので、いろいろなプロパティを持っているというのは
enterFrameの回で説明しました。enterFrameの時は使えそうなものが
ないと書いたのですが、マウスイベントでは使えるプロパティがあります。
それがbuttonDownプロパティです。その名の通り、イベントが発生したときに
ボタンが押されているか否かを教えてくれます。
this.addEventListener(MouseEvent.ROLL_OVER , this.clickFunc);
function clickFunc (eo) {
var test = eo.buttonDown
trace(test);
}
function clickFunc (eo) {
var test = eo.buttonDown
trace(test);
}
これを利用すれば、dragOut、dragOverとrollOver、rollOutで動作を分けることができます。
授業ではdragOut、dragOverを設定しましたが、これはボタンが押されているときは
rollOver、rollOutのイベントが発生しないためでした。しかし、AS3では
ボタンが押されていようが、いまいがROLL_OVER、ROLL_OUTのイベントが発生するので、
この点に関しては楽になりました。
●releaseOutside
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
releaseOutsideもAS3ではなくなってしまいました。
そして、これを実現するのは、ちょっとややこしいです。ですが、
色々な方が、すでに対応策を公開していますので、そちらを参照してください。
まず考え方はこちらのブログを参照
fladdict.net
そしてサンプルを公開している方のブログ
52sec.org
●MOUSE_MOVE
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
AS2のmouseMoveに相当するものですが、設定されたムービークリップの領域にあるときしか
なので、これもreleaseOutsideの時と同様にstageにaddEventListenerする手法を用いないと
AS2のようなことは出来なくなってしまいました…。
●ダブルクリック
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
WEBコンテンツの作成においては、ほとんど使う機会はないと思います。
でもWEBアプリの作成なんかになると使うのでしょうね、きっと。
ダブルクリックのイベントは通常発生しないようになっています。
ダブルクリックのイベントを利用する場合はAS日記（5）で紹介した
doubleClickEnabledをtrueにする必要があります。
doubleClickEnabled = true;
doubleClickEnabledをfalseにしたときにダブルクリックをすると
クリックイベントが２回発生します。
doubleClickEnabledをtrueにしたときにダブルクリックをすると
ダブルクリックイベントが１回発生し、あとクリックイベントも１回発生します。
こんな感じで、かなりマウスイベントの扱いが変わってしまいました…。
さてマウスイベントについて調べていたら、
Stageオブジェクトにだけ利用できるMOUSE_LEAVEというイベントを見つけたので
２回で終わる予定でしたが、次回もマウスイベントにしたいと思います。
AS3日記（7）：マウスイベント
な、なんだかAS3のマウスイベントが大変なことになっています…
AS3になって色々変わるのは覚悟していたのですが、
ちょっと戸惑いを隠せません…。なので２回に分けて
マウスイベントについてお話ししたいと思います。
まずはイベントリスナーの構文ですが、これはenterFrameのときと同じです
しかしenterFrameの時はEventだった部分がMouseEventに変わる点に注意です。
this.addEventListener(MouseEvent.CLICK , this.clickFunc);
function clickFunc (eo) {
trace(“click”);
}
function clickFunc (eo) {
trace(“click”);
}
そして上のActionScriptでお気付きかもしれませんが
イベント名がCLICKになっています。
AS3では扱えるイベントが下記のように変更されているのです。
イベントの名前が異なるくらいなら、何でもないのですが
僕がショックなのは、微妙にAS2の仕様と異なるのです。
僕にとっては悪い方に変わった感じです…。
とりあえずマウスイベントを下に列挙します。
CLICK
MOUSE_UP
MOUSE_DOWN
DOUBLE_CLICK
MOUSE_UP
MOUSE_DOWN
DOUBLE_CLICK
ROLL_OUT
ROLL_OVER
MOUSE_OUT
MOUSE_OVER
MOUSE_MOVE
MOUSE_WHEEL
でもって、各イベントについてのお話し
● CLICKとMOUSE_UPの違い
CLICKはクリックで、授業で説明したとおり
「ムービークリップを押して離したとき」に発生します。
それに対しMOUSE_UPは「ムービークリップを押したかどうかに関わらず
ムービークリップ上でマウスが放されたとき」発生します。
つまり、ムービークリップでない別のところで押してから、
ムービークリップ上に移動して離すと、CLICKのイベントは発生しませんが
MOUSE_UPイベントは発生します。
これに関しては問題はないです。releaseの代わりにCLICKを使えば
よいでしょう。
● ROLL_OUTとMOUSE_OUT（ROLL_OVERとMOUSE_OVER）
これはムービークリップが入れ子にしないと違いが分かりません。
ROLL_OUTはAS2のrollOutとだいたい同じです（違う点は下の方で解説）。
MOUSE_OUTは入れ子にされた中のムービークリップに重なるときにも発生します。
例えば、授業ではbuttonMCの中にtextMCのインスタンスを配置したりしましたが、
MOUSE_OUTのイベントはこのtextMCにも反応してしまうのです。
たとえtextMCにActionScriptを何も書いていなくてもです。
まぁ、上記のとおりなら、これまでのrollOverやrollOutの代わりにROLL_OUT、ROLL_OVER
を利用すればよいのですが…
●微妙に仕様が変わったROLL_OUT/ROLL_OVER
OSも含めインターフェイスのボタンは、そのボタン以外の場所でpressされ
pressしたままの状態で、ボタンにロールオーバーしても反応しないのが本来の仕様（だと思います）
そしてAS2のrollOverやrollOutも、そのような仕様になっています。
しかし！AS3ではボタンでないところからpressしたままロールオーバーしても
イベントが発生してしまうのです。
まぁ、普通に操作している分には全く違和感はないのですが。
なんだか気になるので、ネットで調べたけれど、だれも気にしていないみたい。
じゃぁということで、現在公開されているAS3コンテンツのボタンで
上記のようなROLL_OVERの仕様をどうしているのか調べてみた…。
EYE-PROJECT BY KDDI
うん。そのまんまAS3のROLL_OVERの仕様です。
ということで、僕もとりあえず気にしないことにします。
AS3日記（6）：イベント（enterFrame）
今回はイベントについて。
AS2ではイベントを扱う仕組みとして、イベントハンドラ、イベントハンドラメソッド
イベントリスナーがありましたが、AS3ではイベントリスナーしか利用できません。
まずは手っ取り早く構文を確認しましょう。利用するActionScriptはaddEventListenerです。
addEventListener(利用したいイベント, イベント発生時に実行するカスタムメソッド);
AS2ではフリーサイズFlash講座のときにイベントリスナーを利用しましたが、
こちらはaddListenerでした。これとは別物ですので気を付けてください。
そして今回はenterFrameについてですから「利用したいイベント」はenterFrameになり、
ActionScriptでは以下のように書きます。
Event.ENTER_FRAME
２番目の引数には、イベントが発生したときに実行するカスタムメソッドを書きます。
ですから、総合すると以下のような構文になります。
addEventListener(Event.ENTER_FRAME, moveRoutine);
そして、AS3ではイベントが発生したら実行するカスタムメソッドにも注意が必要です。
実行したいカスタムメソッドには引数を１つ設定しなければ
なりません。
function moveRoutine (eo) {
this.x +=1;
}
this.x +=1;
}
引数はイベントオブジェクトとよばれるものなので、引数名はeo（event object）
としました。この引数を設定し忘れるとエラーになってしまいます。
ちなみに、この引数の値の型はEventですので、型指定をして書くとeo:Eventになります。
上の項目で、指定したenterFrameはイベントオブジェクトのプロパティだったりします。
引数であるからには、どのような値が入っているのか気になるので調べると
（ヘルプでENTER_FRAMEを調べると載っています）あまり使う必要が
なさそうなのばかりです。
結局、AS2ではイベントハンドラメソッドを利用していたものがAS3では
イベントリスナーに変わっただけです。
構文を覚え、引数を書き忘れないようにすれば入門基礎講座を修了した
方であれば問題なく利用できると思います。
それでもって、次回はマウスイベントについて
お話ししたいと思います。
追記
今回のActionScriptでオブジェクト指定を省略しないと以下のようになります。
※今回のActionScriptではthisを省略しても問題ありません。
this.addEventListener(Event.ENTER_FRAME, this.moveRoutine);
AS3日記（5）：プロパティ（後編）
今日は新しく追加されたプロパティの話
Flashが登場する前、マクロメディアの稼ぎ頭はDirectorでした。
このDirectorは確か、フレームラベルを取得できて便利だった気がします。
そしてAS3からはFlashにもフレームラベルを取得する「currentLabel」プロパティ
が追加されました。でもメッキリDirectorから離れているので、なんで
フレームラベルが取得すると便利だったのか忘れてしまいました…
currentLabel：
今いるフレームラベルを取得する、今いるフレームにフレームラベルが無い場合は
前のフレームにさかのぼって取得する。それでも無い場合はnullを返します。
今いるフレームラベルを取得する、今いるフレームにフレームラベルが無い場合は
前のフレームにさかのぼって取得する。それでも無い場合はnullを返します。
currentLabels：
ムービークリップ内のフレームラベルの全てを配列で返してくれます。
あとたぶん使わないdoubleClickEnabled。trueにするとダブルクリックのイベントを
受け取れるようになるとのことですが、WEBコンテンツではダブルクリックという
操作はしないとおもいます。
doubleClickEnabled：
trueに設定することでダブルクリックのマウスイベントを取得できるようになる。
trueに設定することでダブルクリックのマウスイベントを取得できるようになる。
でもAS３の計算処理速度向上によって、FlashはWEBコンテンツだけでなく
WEBアプリの作成も可能になったわけだから、ダブルクリックも必要になって
くるのでしょうね。
ほかにもマウスイベントに関するプロティなども追加されているようですが
それはマウスイベントのところでまとめて話したいと思います。
今回はあまり有用なこと書いていません…
でも次回はイベント（enterFrame編）でイベントの扱いがどの様に変わったか
紹介する予定です。
AS3日記（4）：プロパティ（前編）
今回はプロパティ（ムービークリップ）のお話し。
プロパティの扱いはAS2もAS3も同じですが、ビミョウに名称が変更されているので
両方使っていると混乱します。なので対応表を書いてみます。
基本的にAS2のプロパティから_（アンダースコア）を外したものが
AS3のプロパティ名となります。
_x → x
_y → y
_width → width
_height → height
等
_y → y
_width → width
_height → height
等
すべて上記のルールで変更されればよいのに
ビミョウに変わっているのもあります。
_xscale → scaleX
_yscale → scaleY
_xmouse → mouseX
_ymouse → mouseY
_yscale → scaleY
_xmouse → mouseX
_ymouse → mouseY
ｘやｙで始まるものはｘ、ｙを後ろに移動し大文字に
変更した名前になっています。
そして名前だけでなく、設定できる値の範囲も変わりました。
alphaの値は0〜1
scaleXの値は0〜1
scaleYの値は0〜1
scaleXの値は0〜1
scaleYの値は0〜1
つまり％設定のプロパティは０〜１の範囲で設定するように
変更されました。
さてはて、今回はここまで
次回は新しく追加されたプロパティを紹介したいと思います。
まだ試していないのだけれど、ヘルプには知らないプロパティが
たくさん乗っていました。
フレームラベルを教えてくれるcurrentLabelとか
AS3日記（3）：型について（後編）
今回は前回の続き、型について少し補足します。
型を指定すると、指定した以外の型を代入した場合
エラーになります。これは不便そうですが型指定をしないと、
エラーを出さずにFlashが気を利かせて適当（？）に処理してしまいます。
Flashでは一人で作ることが多く、あまり複雑なことに
ならないので、大抵の場合とくに問題になることも少ないのですが
もし、その処理が原因でバグが発生すると、とても
探しにくいバグとなりがちです。
ですが型指定をしていれば、想定外の値が入ってきても
エラーになり、バグを早期発見できるのです。
少しだけエラーの例を見ておきましょう。
var aaa:String = 10;
上記は文字列（String型）と指定したにもかかわらず
数値（Number型）の10を代入しようとしているのでエラーになります。
ちなみに以下のように、数値と文字列（型のちがう値）を足し算しても
エラーにはなりません。結果としては自動的に文字列に変換されます。
var aaa:String = “ABC”;
var bbb:Number = 123;
trace(aaa + bbb);
var bbb:Number = 123;
trace(aaa + bbb);
あっ、それと前回返値での型指定をしましたが、返値が無い（retrunを使わない）
場合はvoid（型無し）を指定します。
※voidは頭文字も小文字な事に注意してください。
function testFunc ():void {
trace(“testFunc!”);
}
trace(“testFunc!”);
}
返値にvoidを指定しているのに返値を返そうとするとエラーになります。
function testFunc ():void {
retrun “testFunc!”;
}
retrun “testFunc!”;
}
以上
型について（後編）でした。
次回はイベントについてお話ししようと思ったのですが
その前にプロパティの話をしておいた方が良いなぁ、ということで
色々と変更された、ムービークリップのプロパティの話をしたいと思います。