blog.sncr.jp

1.FlashIDE
基本的にFlashDevelopでコード書いてFlexSDKでコンパイルする派の僕ですが、
それでもFlash制作にFlashIDEは絶対に欠かせないツールです。
それは・・・

とかまぁそんなのは他の方に任せて、僕のデスク周り自慢をします。

1.いす

机とかだったら板買ってきて作ればいいんですけど、椅子は買わないとどうにもならんね、ってことで会社に持ち込んでます。
この椅子は体への負担を軽減しつつ、「働け！働け！」と言わんばかりに正しい姿勢へ矯正してくれます。
最高の仕事用椅子です。
僕はこれに8度傾斜させるように改造した机を合わせています。

2.スピーカー

長時間机から離れられない状況になってくると体によくないので、そんなときは音楽を聴いてリフレッシュします。
もちろんFlashに音入れるときのチェックにだって重宝しますよ。

3.カメラ

余裕のあるときはカメラと一緒に外に出ます。
他人のよい仕事を記録して、自分のモチベーションを高めます。
大きくて重い一眼レフカメラを持つのは、積極的に良いものを探すためです。

FlashDevelopではプロジェクトをビルドする時、FDBuildというexeファイルにプロジェクトファイルを渡すことでビルドを行います。
プロジェクトファイルには画面サイズやライブラリへのパスなどの書き出し設定が記述してありますが、コンパイル元に指定できるasファイルはつねに一つです。
ですが同じ設定をもとに、複数のasファイルをコンパイルしたい場合もたまにあると思います。
そんなときにとることが手段としては、Always Compileを一時的にそのasファイルに設定することくらいです。
ですが設定したものは戻さなければなりません。プロジェクトファイルを複製するなどの方法もありますが、とてもめんどくさいように思います。そこで、FDBuildに穴を開けることにしました。

FDPreBuild
ダウンロード

FDPreBuildは、FDBuildにいくつかの穴を開けたもので、プロジェクトファイルで設定してあるはずのコンパイル元と書き出し先を無理矢理変更することができます。
たとえばMain.as3projというプロジェクトファイルがあったとして、
コマンドラインで以下のように使います。

fdprebuild "Main.as3proj" -file-specs "src\Sub.as" -output "bin\sub.swf" -compiler "c:¥flex_sdk"

これで、Main.as3projの設定をもとにSub.asからsub.swfが書き出されます。

プロジェクトファイルの中で使う

さらに、これはプロジェクトの書き出し設定のPre-BuildやPost-Buildで使うと便利です。
FlashDevelopでプロジェクトのプロパティを開くと設定用の小窓が出ますが、Buildというタブの中にあります。
ここでは、$(ToolsDir)や$(ProjectPath)などといったショートカットが使えます。
プロジェクトファイルを他人に配布したいときに便利ですね。

Pre-BuildかPost-Buildのどちらでもいいんですが、Pre-Buildに入れるとして、

"$(ToolsDir)\fdbuild\fdprebuild" "$(ProjectPath)" -file-specs "src\Preloader.as" -output "bin\preloader.swf" -compiler "$(CompilerPath)" -noloop-prebuild

って感じにしておくと、index.swfを書き出すと同時にpreloader.asも同じ設定で書き出される仕組みです。

増えた設定の説明とか

-file-specs
コンパイルするASファイルを変更します。

-output
出力先のパスを変更します。

-noloop-prebuild
Pre-Buildをループさせないようにします。例えば、あるプロジェクトファイル、仮にIndex.as3projとしましょう、その設定でPre-Buildに

fdprebuild "Index.as3proj" -file-specs "src\Preloader.as" -output "bin\preloader.swf" -compiler "$(CompilerPath)"

こんな感じで、Index.as3projと同時にIndex.as3projをもとに他のasをコンパイルすると便利です。
しかしこれを実行すると、Pre-Buildの設定はプロジェクトファイルの設定として保存されて、Pre-Buildの中でもIndex.as3projのPre-Buildが実行されますから、無限ループになってしまいます。
これを防ぐために、Pre-Buildの中でPre-Buildを行わないよう設定できるようにしました。
基本的に、-noloop-prebuildはPre-Buildの中で使うものです。Post-Buildの中であれば、-noloop-postbuildを使います。

-noloop-postbuild
Pre-Buildをループさせないようにします。以下同文。

あ、いまのところ、コンパイルするasファイルやoutput先を上書きできるのはas3だけです。
as2とhaXeには未対応です。需要がなさそうなのでやってないだけですけど、対応してほしい方は以下に熱いメッセージをどうぞ。

こちらに移動しました。
http://www.libspark.org/wiki/FlashDevelop/Macros/PMDResults

FlexPMDから出力されたXMLファイルを読み込んで、Resultsパネルに表示するFlashDevelopマクロを組んでみました。

FlashDevelopのResultsパネルに出力しておくと、該当するコードをダブルクリックで表示できるので修正するときに楽だと思います。

プロジェクトを開いているときにはそのプロジェクトファイルと同階層にあるpmd.xmlファイルを読みに行きます。
プロジェクトを開いていなかったり、ファイルが見つからなかった場合にはダイアログが開くのでpmd.xmlを指定してみてください。

ダウンロードはこちらPMDResults.cs

追記
独学ActionScriptのdkgkAsさんが機能を追加されているので、こちらを使うとよいです。僕も使わせていただいています。

FlexPMDのプライオリティ値をFDのトレースコード値（?）に反映させて、カラーリング＆アイコン表示と、プライオリティの文字列（ErrorとかInfoとか）も表示するようにしてみました。http://bit.ly/2U7HMz
http://twitter.com/dkgkAs/status/3795718949

マクロの登録がはじめての人へ

FlashDevelopのメニュー>Tools>Application Files…を開いて出てきたフォルダに
Macrosというフォルダを作成してください。
ダウンロードしたPMDResults.csファイルをその中へ。

FlashDevelopに戻って、メニュー>Macros>Edit Macros..を開きます。
出てきたウインドウの左下のAddをクリックするとUntitledというのが出てくるのでそれをクリック、
Labelを&PMDResultsとして、
Entriesのところを開いて
ExecuteScript|Development;$(UserAppDir)\Macros\PMDResults.cs
とします。
Shortcutなどはお好みでどうぞ。

マクロの実行はメニュー>Macrosの中にPMDResultsというのができているはずなのでそれをクリックするとよいです。

まず、こちらを参考にしてantとやFlexPMDをインストールします。
FlexPMD :: 環境構築から実験まで。-ソースコード解析によるバグの早期発見とコーディング規約準拠-

ここまでたら、もう少し便利に利用したいのでツールバーにボタンを追加するか、マクロを登録しましょう。

ツールバーにボタンを追加する

C:\Program Files\FlashDevelop\Settings\ToolBar.xmlの、からまでの好きな行に

<button label="Flex PMD" click="c:\windows\system32\cmd.exe;/c $(Quote)cd $(ProjectDir)&amp;&amp;ant flexPmdWithDefaultRuleset -buildfile build.xml$(Quote)" tag="c:\windows\system32\cmd.exe;/c $(Quote)cd $(ProjectDir)&amp;&amp;ant flexPmdWithDefaultRuleset -buildfile build.xml$(Quote)" image="486" />

を追加。

マクロを登録する

メニュー>Macros>Edit Macros..を開きます。
出てきたウインドウの左下のAddをクリックするとUntitledというのが出てくるのでそれをクリック、
Labelを&FlexPMDとして、
Entriesのところを開いて

RunProcessCaptured|c:\windows\system32\cmd.exe;/c cd $(ProjectDir)&&ant flexPmdWithDefaultRuleset -buildfile build.xml

とします。
Shortcutなどはお好みでどうぞ。

プロジェクトのPMDを書き出す

どちらかが終わったら、
いままでAntのインストールフォルダ直下に置いていたbuild.xmlをコピーして、
PMDしたいプロジェクトのas3projがあるフォルダに追加。

build.xmlの11行目のsrc.dirのvalueを、クラスを置いてる場所に書き換え。

<property name="src.dir" value="src\" />

みたいな感じに。

あとはFlashDevelopを再起動して、ツールバーに新しく登録された赤いアリさんアイコンか、マクロをクリックしたらpmd.xmlが書き出されます。

FDのプロジェクトテンプレートに、以下のようなbuild.xml.templateファイルを追加するともっと便利かも。
src.dirのvalueを自動的に書き込んでくれるんで、ここまできたら手軽に利用できますね。

<?xml version="1.0" encoding="utf-8"?>
<project name="Flex PMD example" default="flexPmd" >

    <description>
        Flex PMD
    </description>

    <property name="projecthome" value="${basedir}/.." />
    <property name="flexpmd.version" value="1.0-RC3" />
    <property name="flexpmd.dir" value="${basedir}/somedir" />
	<property name="src.dir" value="src/$(PackageSlash)" />
	<property name="bin.dir" value="./" />

    <!--****************************************************
                FlexPMD
        *****************************************************-->

        <taskdef name="flexPmd"
             classname="com.adobe.ac.pmd.ant.FlexPmdAntTask"
             classpath="${flexpmd.dir}/lib/flex-pmd-ant-task-${flexpmd.version}.jar">
        <classpath>
            <pathelement location="${flexpmd.dir}/lib/flex-pmd-ruleset-api-${flexpmd.version}.jar"/>
            <pathelement location="${flexpmd.dir}/lib/flex-pmd-ruleset-${flexpmd.version}.jar"/>
            <pathelement location="${flexpmd.dir}/lib/flex-pmd-core-${flexpmd.version}.jar"/>
            <pathelement location="${flexpmd.dir}/lib/as3-plugin-utils-${flexpmd.version}.jar"/>
            <pathelement location="${flexpmd.dir}/lib/as3-parser-${flexpmd.version}.jar"/>
            <pathelement location="${flexpmd.dir}/lib/pmd-4.2.2.jar"/>
            <pathelement location="${flexpmd.dir}/lib/commons-lang-2.4.jar"/>
            <pathelement location="${flexpmd.dir}/lib/flex-pmd-files-${flexpmd.version}.jar"/>
            <pathelement location="${flexpmd.dir}/lib/as3-parser-api-${flexpmd.version}.jar"/>
        </classpath>
    </taskdef>

    <target name="flexPmdWithCustomRuleset">
        <flexPmd
            sourceDirectory="${src.dir}"
            outputDirectory="${bin.dir}"
            ruleSet="${flexpmd.dir}/pmd.xml"/>
    </target>

    <target name="flexPmdWithDefaultRuleset">
        <flexPmd
            sourceDirectory="${src.dir}"
            outputDirectory="${bin.dir}"/>
    </target>

</project>

http://www.libspark.org/wiki/alumican/JPPScrollbar のサンプルに移動しました

まずこちらをお読みください
Alumimum – Twitter and Presenter.

・・・ということなので、面白そうだから作ってみることにしました。Flashで。

Continue reading

Adobe MAX Japan 2009で、Flash OOP Japanの原さんという方がFunnelを使ってActionscriptと各種センサーを通信させる遊びのデモをされていました。
Flash OOP Japan – Adobe MAX Japan 2009 セッションレポート

これはGainerの後継で、無線通信でワイヤレスなものが作れる優れもの。
実はGainerやりたかったんですが、完全に出遅れた感があったのでやる気がしなかったのです。
でもFunnelなら先進的っぽい！ので僕もやってみたいなーと思ってました。

それでスイッチサイエンスというお店で売ってることを知って衝動買いしました。

Continue reading

カスタムイベントって何ですかね、イベントフローとかバブリングとか出てくると話がちょっと難しいですね。
使いこなせる日は来るのか・・・

とりあえず詳細! ActionScript 3.0 入門ノート2の方までひととおり読みました。
内容が完全に理解できてないっぽくても、とりあえず書いてあるサンプルコードを打ち込んではいるので、きっと必要なときに体が思い出してくれると期待します。

で前回のようにクラスベースでのコーディングについてなんとなく理解できたので、やっとwonderflという魅力的なウェブサービスを楽しめそうな感じになってきました。

で作ってみたのがコレです。

Continue reading

さて、AS3とAS2の壁って、言われてるほどそんなに高くはないな、これはいけるな、と思っていた矢先でした。
クラスの話、つまりオブジェクト指向的な話になっていくと、やっぱりというかうまく理解できません。
オブジェクト指向の壁は高かったのです。
それでまたしばらく勉強が止まりました。

それで何日かたって、
ところでオブジェクト指向ってなにがいいんだろう？
そういえばオブジェクト指向の本を一冊買ったけど、いったい何ができるようになるんだろう？
などと考えた僕はこのFLASH OOP for ActionScript 3.0という本を開きます。

僕はこの本は、AS3をバリバリできるようになったら読むんだ！なんて思っていました。
Amazonにも初心者向けではないですよ的なレビューがあります。

ですが僕は、この本はAS3初心者にこそオススメしたいと思います。
この本の第一章『ゼロから始めるOOP』では、とてもわかりやすいオブジェクト指向入門の解説がしてあります。
僕はこの本のおかげでオブジェクト指向、クラスについて理解することができました。
その次の第二章も、AS2経験者にとってタメになるAS2とAS3の違いについての解説がされています。
もっと早めに目を通しておけばよかったなと思いました。