June 7, 2011
ワークスコーポレーションさんから発売されている「ActionScript Beautifl Code」にwonderflに投稿したHUWAHUWA LINEを掲載していただきました。
「ActionScript Beautifl Code」とはwonderflに投稿された作品を解説付きで紹介している本で全97作品のコードが収録されています。
それぞれの作品のポイントとなる部分が丁寧に紹介されていて、初心者から上級者まで参考になる本だと思いました。
「ActionScript Beautifl Code」を執筆された池田さん（@clockmaker）が運営しているBeautiflというサイトも素敵な作品がたくさん見れるのでおすすめです！
「ActionScript Beautifl Code」に掲載されている作品一覧はこちらから見ることができます。
September 6, 2010
FlashPlayer10が出てしばらく経ちますが、FP10実装でGOが出た案件はまだまだ少ない。
というわけで、まだまだPapervision3Dをバリバリ使ってます！今更ながら、3D空間上のオブジェクトにマウスイベントの付け方をまとめてみました。
以下3つの方法があります。
Papervision3Dでマウスイベントを設定する（1） - wonderfl build flash online
Papervision3Dでマウスイベントを設定する（2） - wonderfl build flash online
Papervision3Dでマウスイベントを設定する（3） - wonderfl build flash online
と、3つ挙げたものの、「どの方法がいいんじゃい！」と。。。
以下は個人的なやり方ですが、メモがてら書いておきます。
まずPV3Dの利用スタイルですが、PV3Dを使う時はデフォルトのソート（Zソート）を使わずにインデックスソートを利用する事が格段に多いです。
理由は、Zソート時に起きるオブジェクト同士が重なった時のオブジェクト欠けが気に入らないから。
※ViewportLayerについては「Papervision3Dのソート法をZソートからインデックスソートに変更する」、「Papervision3Dのソート法をZソートからインデックスソートに変更する 番外編（ViewportLayerの事）」を参考にしてもらえればと思います。
その流れから最近はViewportLayerを使った「3. プリミティブ の ViewportLayer に MouseEventクラス を利用してマウスイベントを設定する方法」を採用する事が多いです。
「3. プリミティブ の ViewportLayer に MouseEventクラス を利用してマウスイベントを設定する方法」を利用するのにはちょっとした利点があります。
1、2の方法を採用する場合、Viewport3DのbuttonModeプロパティをオンマウス、マウスアウト時に切り替える処理を入れたり、制作していく中でマウスイベントの伝播がおかしくなったりすることがありました。
ところが、3の方法を採用する事によって、PV3D独特のイベントハンドリングに頭を悩ませる事無く、従来通りのイベントハンドリングを行う事が可能になります。
それにPV3DのオブジェクトにアルファやブラーなどのフィルターもViewportLayerに直接適用できるので便利です！
という理由から僕は「3. プリミティブ の ViewportLayer に MouseEventクラス を利用してマウスイベントを設定する方法」をオススメします。
コードなどは上記サンプルのwonderflの方にありますので、参考にしてみてください。
「マウスイベントの付け方は他にもあるぜぃ！」って場合はフォーク、コメント欄などで教えていただけるとうれしいです
August 6, 2010
July 21, 2010
前回「Papervision3Dのソート法をZソートからインデックスソートに変更する」でPapervision3Dのソート法をインデックスソートにしましたが、インデックスソートにすることで、できた事があったのでちょこっと紹介。
3D空間上のオブジェクトの中に通常の3DオブジェクトでないボタンやUIを配置したいときにわざわざPlaneを追加するのは負荷があがるし、なにより面倒。。。
そこで、インデックスソートに変えたときに使った「ViewportLayer」を応用してその問題をクリアしてみました。
種明かしすると、ViewportLayerはSpriteの拡張クラスなので、空のViewportLayerを用意すれば3D空間の中で自由に深度を変えつつ、DisplayObjectを3D空間の中に描画できるということ。
詳細なコードは以下wonderflで確認していただければと思います。
July 20, 2010
Papervision3Dはポリゴンを「Zソート」という方法でソートして描画しています。
Zソートの弱点としてポリゴン毎に奥行きをチェックするため、オブジェクト同士が近くにあったり、交差していたりするとオブジェクト（ポリゴン）が欠けて描画されるということがあります。
そこで今回はソートをZソートではなく、指定した任意の順に描画する「インデックスソート」に変更することでその現象を回避してみます。
以下でZソートとインデックスソートの違いを比べてみました。
左がZソート、右がインデックスソートです。
※実際のコードはwonderflで見てください。
July 16, 2010
Papervision3DはViewportの中央が消失点になっているが、ずらしたい時があったのでちょっこっとViewport3Dを拡張したクラスを作ってみた。
wonderflにアップしたのでよろしければどうぞ。
バグがあるかもしれないので、見つけたらForkして直してくださいw
そもそもそういう機能ありそうな元からありそうな気がするけど、見つからなかった。
既にPV3Dで実装されてたら教えてください。
January 6, 2010
BetweenAS3のイージング関数いろいろあって便利なのですが、迷うときがあるのでリストにしました。
Linearに関しては6つもいらないか。。。
June 22, 2009
JavaScriptからFlashにフォーカスを与えられるよ - てっく煮ブログ を読んで、てっく煮さんの記事ではテキストエリアにフォーカスを当てているけど、stage.focusにもなにかを代入すれば行けるんじゃ？と思いついたのでやってみた。
FlashではキーイベントやマウスホイールなどFlashにフォーカスがないとだめなイベントがある。
いままではFlashエリアを一度クリックしないとフォーカスが与えられないと思ってたんだけど、できたぽい。
実際のコードはこちら
ActionScript
import flash.external.ExternalInterface;
//ExternalInterfaceに登録
ExternalInterface.addCallback("onload", _onLoad);
//JavaScriptから実行される関数
function _onLoad():void {
stage.focus = ターゲット（stageとか特定のMCとかとか）;
}
JavaScript
window.onload = function() {
var el = document.getElementById("swfのid");
if(el && el.onload) {
el.focus();
el.onload();
}
}
こんな感じでJavaScriptからフォーカスを当てた後に、ActionScript側で stage.focus に代入してあげればよいよ。
May 25, 2009
PV3DでDisplayObject3Dをボタンにしたいときの設定。バージョンは2.0.0。
Viewport3D.interactive プロパティを true にしてインタラクティブイベントを取得できるように。
続いて、Viewport3D.buttonMode プロパティを true に。これで指アイコンに。
コードは以下
_viewport = new Viewport3D(width, height);
_viewport.interactive = true;
_viewport.buttonMode = true;
ただこれだけだと、イベントを取りたくないオブジェクトまで指アイコンになってしまうので、
_viewport = new Viewport3D(width, height);
_viewport.interactive = true;
//_viewport.buttonMode = true; // ここはコメントアウト
var material:ColorMaterial = new ColorMaterial(0x0, 1);
material.interactive = true;
var object:Plane = new Plane(material, 100, 100);
object.addEventListener(InteractiveScene3DEvent.OBJECT_OVER, _objOverHandler);
object.addEventListener(InteractiveScene3DEvent.OBJECT_OUT, _objOutHandler);
function _objOverHandler(e: InteractiveScene3DEvent):void {
_viewport.buttonMode = true;
}
function _objOutHandler(e: InteractiveScene3DEvent):void {
_viewport.buttonMode = false;
}
これで一応意図した動きに。
参考にさせていただきました！
Papervision3D 2.0 マウスアクションをつける際のハンドカーソル | FlashやWebにまつわるいろいろなこと
April 14, 2009
コンテンツの先読みについて。。。
Preloader.asではデフォルトだとurlプロパティに設定したswfを読み込むようになってて、それ以外のファイルをどうやって読み込むかちょっと考える。
Preloader.asが終わった後に、index.swf内でもう一度ロード処理を記述するのはなんか微妙。。。
コンテンツ開始時にローディングが2回出るのとかは、ユーザーにとっては混乱してしまうだけだし。
なので、Preloader.as内で読み込みをして、ローダーなりバイナリをstaticな変数に代入しておく。
index.swfの初期化時にMain.as側から参照してコンテンツを展開して行くのが僕的にしっくり。
で、実際どう書いて行くかなわけですが。
今のところ僕の中でのPreloader内でのロード処理の流れの認識（超勘違いかもしれないけど）は、
_onCastLoadStart
ロード処理開始（index.swf [Preloader.urlで指定したswf] ）
_onCastLoadComplete
ロード処理終了（index.swf [Preloader.urlで指定したswf] ）
この処理中にindex.swf以外のコンテンツのswfも読み込もうとしたときに、どこでやるのがスマートなのかって考えて、並列で一緒に読み込むなら「_onCastLoadStart」内。直列で順々に読み込むなら「_onCastLoadComplete」内がいいかなと思ってます。
僕は順々に読み込みたかったので、「_onCastLoadComplete」内でもろもろ読み込むようにしました。
なんかあんま素直じゃない気がして気持ち悪いんだけど、、、とりあえず動いているのでいいか。
＜追記＞
Preloader.asに「parallelMode」っていうプロパティがあるのにさっき気づいた。
parallelMode = false;
で順々に読んでくれるのかしら？
ちょっと検証する時間がないので後回し。
March 19, 2009
FlashDevelopをRC2にアップデートした。
フォントの設定を変更しようとして、
「Tools」→「Syntax Coloring」
で「MS ゴシック」 を選ぶ。
エディタ上のフォントは「MS ゴシック」にならない。
「Osakaー等幅」を選んでも適用されてないし。
で、GUI上からはだめぽいので、FlashDevelopのセッティングファイルを弄る。
C:\Documents and Settings\ユーザー名\Local Settings\Application Data\FlashDevelop\Settings\Languages
にあるファイルで設定したい言語を編集する。
<style name="default" fore="0x000000" back="0xffffff" size="10" font="MS ゴシック" />
となっている部分の、「MS ゴシック」の部分を「MS Gothic」に。
<style name="default" fore="0x000000" back="0xffffff" size="10" font="MS Gothic" />
これで適用されます。
どうやら日本語のフォント名はNGみたい。
ちなみに手動でXMLを弄ったあとにSyntax Coloringで編集するとまたフォントがうまく適用されなくなってしまうので、使わないで方がいいかもしれません。
て、こんな面倒な事しなくてもSyntax Coloringで行ける方法があれば教えてください！！
October 14, 2008
embedFontsした入力フィールドに日本語が入力できないメモ。
MacのFirefox3で日本語が入力できないバグ（3.0.2で修正済み）の件は知っていたのでそれかと思いきや、safariでも同様に入力できない。
ちなみにPlayerは9.0.124。
embedFontsが原因かと思って、embedFontsをfalseにしてみたら動く。
マジかと思ったけど、納得いかなかったので、該当部分だけを取り出して、検証してみた。
普通にできる。。。
ということは元のファイルのどこかがおかしい？
改めて考えてみると、そのテキストフィールドを覆うMCにマスクがかかっているのに気づき、マスクを外してみたらとりあえず日本語入力できるようになった。
ただマスクかけてても日本語入力できたこともあったような。。。
ん〜イマイチ安定していないので、引き続きわかったことがあれば追記します。
お心当たりのある方はコメントいただけるとうれしいです。
September 25, 2008
フォントを外部からロードしてFont.registerFontするやつでちょっとハマった。
FACEs: as3:フォントのダイナミックなローディング
CS3版 フォントのダイナミックなローディング｜_level0.CUPPY
上記を参考にフォントを外部からロードする形にして、Font.registerFontもできて、TextFieldにembedFontしたみたら、、、できずぅぅ。。。
原因不明でいろいろ探っていたところ、embedFontするTextFieldのフォントの指定（Flash IDE上）がembedFontしようとしてるフォントと同じになっている。。。
もしやと思い、Flash IDEのフォントを「_ゴシック」に変更してからやってみたら、できた。
ちなみにFlashIDE上の別の場所にそのフォントを指定したダイナミックテキストとかがあってもNGみたい。
とりあえずメモ。
September 11, 2008
aaa.comのドメインで保存したSharedObjectをbbb.comでも使いたいときにbbb.comのswfから
SharedObject.getLocal("hoge")
としてもaaa.com側で保存したデータを取得できません。
そこでひと手間かかってしまいますが、以下の手順で共有することができそうです。
August 19, 2008
FlashDevelopを使っていて、コード検索をしたときに全然違うところがハイライトされてなぞだったのですが、わかりました。
原因
asファイルの文字コードがShift-JISだった。
解決法
該当ファイルの文字コードをUTF-8へ変換
めでたしめでたし。
August 1, 2008
package {
import flash.display.MovieClip;
public class Test extends MovieClip {
override public function set height(value:Number):void {}
override public function set width(value:Number):void {}
public function Test() {
super();
}
}
}
ってかけるの今知った。
つかえるかも
July 31, 2008
Flashで影などのアルファチャンネルを持ったエレメントを使うときの心がけ。
Photoshop上での作業のときに影の色をグレーで作成してFlashに持ってくると影がくすんでしまってきれいに見えなかったり、重なっているほかのエレメントが不自然に見えてしまうので、影のオブジェクトを乗算に。
でも、それだとFlashの負荷が増えてしまうので、Photoshop上の作業時に影の色は黒(#000000)で透明度で調整してFlash上に配置すれば、乗算にしなくても自然に見えるのでパフォーマンスはあがる。
April 1, 2008
Flashのプレビューでメモリが増え続けてorzだったけど、
ブラウザで見たらしっかりメモリがカクっと減った！！
「adddEventListener したら removeEventListener すること！」
「addChild したら removeChild すること！」
August 16, 2006
Flash8から追加されたビットマップキャッシュですが、使いどころを間違えるとえらい処理が重くなったりして死んじゃうので注意が必要。
基本_xと_y以外のプロパティを変更する時はビットマップキャッシュをかけちゃダメです。
軽くなるからーってノリで何でもかんでもかけてるとハマるのでご注意を。
July 30, 2006
package {
import flash.display.MovieClip;
import flash.events.*;
public class LftButton extends MovieClip {
/**
* Constructor
*/
public function LftButton() {
super();
this.addEventListener(MouseEvent.ROLL_OVER, rollover);
this.addEventListener(MouseEvent.CLICK, click);
}
//------------------------------------------------------------
private function rollover(eventObj:Event) {
trace('hover');
}
private function click(eventObj:Event) {
trace('click');
}
}
}このクラスをとりあえずムービークリップにリンケージで指定。
フレーム側では
var myBtn = new LftButton();
this.addChild(myBtn);と記述
ステージ上にオブジェクトが表示されて、ロールオーバーとクリックでtraceもちゃんと表示されるけど、アイコンが指にならない。。。
useHandCursorとか指定してもだめでした。う〜むどうすれば指アイコン出せるの?
July 23, 2006
Flash8のときに別ドメインの画像をdrawしようとしたらできなかった。
これに関してはnaoさんとこの記事とかを事前に知っていたので回避はできました。
でもこれ、FlashPlayer9がでて解消されたらしい。（未確認）
FlashPlayer8のバグだったのかな？
July 23, 2006
いまさらながらはじめてFileReferenceを使いました。
画像のアップロード自体はいつものようにcrossdomain.xmlの指定でOK。
アップロードが完了した後にサーバーからの戻り値が取得したい。
そんな時はアップロードする前にLoadVarsかなんかでサーバー側に接続をしておいてセッション管理するしかなさそう。
July 16, 2006
AS3のデビューセミナーが7月14日に開催されたので行ってきました。
Adobeの上条さんによるAS3とFlash 9 Public Alphaの紹介、野中文雄氏によるAS3の書き方教室、Flash OOPの活動報告、Flash-JPのパネルディスカッションなどのセッションで行われました。
AS2とAS3ではかなりいろいろなところが変わるみたいで、ちょっと敷居が高くなりそう。
よりプログラマー色の強い言語に生まれ変わる。
デザイナーは手を出しにくくなるのではないか？との議論が白熱していました。
とりあえず今は僕たちデベロッパーにとってもAdobeの開発者さんたちもいろいろな準備期間。
いままでのFlashは発売前にぼくたちが実際に触れる機会がなかったのに今回は触れることができるのでどんどん触っていこうと思う。
上条さんもおっしゃっていましたが、Alpha版のいまフィードバックを送れば、β版、製品版にはその要望が通りよりよいツールになる可能性があるので、どんどんバグ報告や要望など言っていきましょう。
今回の参考サイトまとめ
Adobe : http://www.adobe.com/jp/
Flash : http://www.adobe.com/jp/products/flash/flashpro/
Flash Professional 9 Public Alpha(Adobe Labs) : http://labs.adobe.com/technologies/flash9as3preview/
akihiro kamijo : http://weblogs.macromedia.com/akamijo/
FumioNonaka.com : http://www.fumiononaka.com/
Flash OOP : http://www.flashoop.jp/
marcosweskamp : http://www.marcosweskamp.com/blog/
Flash-JP : http://www.flash-jp.com/
March 21, 2006
actionscriptでいろいろごにょごにょやってるうちにスコープが訳わからなくなったりとか、ここのthisスコープはこれじゃあんわーって感じのときとかに使うといい感じ。
//_rootフレームアクション
mcA.onPress = pressA;
function pressA() {
trace(this);//output '_root.mcA'
}
import mx.utils.Delegate;
mcB.onPress = Delegate.create(this, pressB);
function pressB() {
trace(this);//output '_root'
}
とりあえず使うときはこんな感じで。
setIntervalで使うときは
import mx.utils.Delegate;
setInterval(Delegate.create(this, intervalAction), 1000);
function intervalAction() {
trace(this);
}
こんな感じで。
このDelegateはフレームアクションで使っても余りメリットというものがなく、クラス内で使うと幸せになれる。
import mx.utils.Delegate;
class A {
function A(mcA:MovieClip, mcB:MovieClip) {
mcA.onPress = runA;
mcB.onPress = Delegate.create(this, runB);
}
/**
mcAで実行するfunction
*/
function runA() {
trace(this);//output: "mcA"
}
/**
mcBで実行するfunction
*/
function runB() {
trace(this);//output: "object : Object"(クラスA自身)
}
}
にて運用しています。
