[FlashDevelop]FlashDevelop3.3.2RTMのインストールと設定

Windows7にFlashDevelopをインストールしてみた


いい加減PCが古くなったので、買い替えてみた。
今度は6,7年使う予定ではないので、2年で買い替えということで予算は5万くらいで適当に購入。
どうせ開発遊びに使うくらいだし。



Core i5にするか悩んだけど、まぁいいやーということで廉価版。
Corei5ならこっちかな。Lenovo G560シリーズ 15.6型ワイド液晶 A4サイズノートブック 06798NJ
これに「よく一緒に購入されている商品」のメモリ2Gを追加してポチっとして、1週間待つべし。


メモリの追加作業で、ネジが長いのと短いのがあって短いのは外さなくていいことを知らずにがんばって外そうとしちゃってちょっと変になったけど気にしない。
ちなみに排気音がうるさいので気になる人はお勧めしない。マイクが標準でついているが、前述のとおり排気音がうるさすぎるので、専用のをつけたほうがいい。


前置きはこんなもんで、FlashDevelopをインストールしましょうか。
Eclipseインストール先にしたから多分Javaは入っているという前提でスタート。<=ここ重要?


FlashDevelopのダウンロード


過去の記事を漁ってたけど、2年近く前なのね。当時は情報が少なかったけど、今は公式の日本語もあるので楽チン。


ダウンロード先へアクセスしてFlashDevelopのインストーラをダウンロードしてきます
リンク先の[Download FlashDevelop 3.3.2 RTM]をクリックすればOKです。
78_01.png


ダウンロードしたインストーラをダブルクリックして実行。
特に[管理者として実行]は選択していません。
インストール方法は日本語の公式ページを参考にするといいでしょう。
途中およ?っとなったところは以下の箇所。
78_02.png
Flex SDK 4をダウンロードしているのか?


まぁそんな疑問はさておき、正常にインストールできたようなので、起動してみます。
>78_03.png
起動しました。特に問題がないのはFlashDevelopが進化したからか。。。


FlashDevelop3.3.2RTMの設定の確認


Downloadなんちゃらなんちゃらと出てたのでちょっと期待しましたが、
そうでもないようです。
[F10](Tools=>Program Settings) => 左サイドバー[AS3Context]で表示される画面の下部[Flex SDK Location]
78_04.png


まぁダウンロードページにこんなことが書いてありますからね。。。

* Get the free Adobe Flex SDK. The free Adobe Flex SDK (2, 3 or 4) is required for ActionScript 3 development if you don't use Flash CS*.

Flash CSなんて高価なものはないんですよーだ。
78_05.png


Flex SDKのダウンロード


まぁ素直にSDK落としてきましょうかね。
今回はFlex3とはお別れし、Flex4(4.1.0.16076)にします。
http://opensource.adobe.com/wiki/display/flexsdk/Download+Flex+4へお邪魔してソースコードを落としてきます
78_06.png
いつも悩むけど、どれ落とせばいいんだー。
商用だとOpen Source Flex SDKがいいという話。
でも別に商用じゃないので、Adobe Flex SDKを落とします。
リンクを選択して、ライセンス条項に同意したらダウンロードが始まります。
(I have read the License Agreement(s), and by downloading the software, I agree to the terms of the agreement.という箇所のチェックボックスにチェックを入れます。)
容量が大きいのでしばらく待ちます。


ダウンロードしている最中にライセンス呼んでみたら、Flex SDKはMPL(Mozilla Public License)のようです。
トリプルライセンスという初見だと意味不明なライセンスです。
Adobe Flex SDKのほうは、MPL適用されているソースの数がOpen Source Flex SDKより多いようです。
あんま見てないから適当。まぁトリプルライセンスって公開する場合は、ライセンス放棄とかできるのかね?
よくわからんから、GPLにしてしまうでいいかー
ライセンス関連もうちょっと勉強せんといかんな。。。


Flex SDKにパスを通す


ダウンロードが出来たら[flex_sdk_4.1.0.16076.zip]というファイルが出来ると思います。
こちらを解凍した後に任意の場所に設置して、パスを通しておきましょう。
私は以下のように設置しました。


C:\flex\flex_sdk_4.1.0.16076

Windows7になってから見つけにくくなりましたが、
[コンピューター]右クリックで[プロパティ]=>[システムの詳細設定]=>システムのプロパティダイアログが表示されますので、[詳細設定]=>[環境変数]と選択します。
78_09.png


環境変数のプロパティダイアログが表示されますので、
[PATH]を選択し、[編集]を選択します。
その後表示されるダイアログの末尾に先ほど設置したFlexのパスにbinを付与した値(C:\flex\flex_sdk_4.1.0.16076\bin;)を入力すればOKです。
(※PATHがなければ、新規ボタンでPATHを作成してください。)
(※既に入力されていれば問題ないと思いますが、複数設定する場合は前の値とは;で区切ってください。)
78_10.png


設定が正しいかの確認を以下の手順で行います。
Windowsキーを押しながらRキーを押して[ファイル名を指定して実行]ダイアログを出します。
cmdと入力し、Enterを押します。
コマンドプロンプトが立ち上がりますので、以下のコマンドを入力してみましょう


mxmlc --version
Version 4.1.0 build 16076

上記のように表示されれば、パスが正常に通っていることになります。
※FlashDevelopを使う上では必要ない気がするけどまぁいいや


FlashDevelopにFlexのパスを通す


FlashDevelop上で[F10]=>左ナビゲーション[AS3Content]=>右ペイン中央のFlex SDK Locationの箇所に
先ほど設置したFlex SDKのパスを設定します。(必ずbinディレクトリを指定すること)
78_11.png


Flex 4でコンパイルできるか試す。


上記でパスが通ったはずですので、以下の手順でプロジェクト作成 => コンパイルを実行してみましょう。


FlashDevelop上で[プロジェクト]=>[新規プロジェクト]を選択します。
(※下の手順で日本語化をしてあります)
以下のように設定していきます。
78_12.png


途中Authorを聞かれますが、適当に入力します。
プロジェクトが作成できると右ペインの[プロジェクト]が以下のようになりますので、
[src]=>[Main.mxml]をダブルクリックします。
78_13.png


Main.mxmlのソースコードを以下のように変更します


<?xml version="1.0"?>
<!-- Simple example to demonstrate the Spark Button control -->
<s:Application
xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx">

<fx:Script>
<![CDATA[
import flash.events.Event;

// Event handler function to print a message
// describing the selected Spark Button control.
private function printMessage(event:Event):void {
message.text += event.target.label + " pressed" + "\n";
}

]]>
</fx:Script>

<s:Panel title="Spark Button Control Example"
width="75%" height="75%"
horizontalCenter="0" verticalCenter="0">
<s:VGroup left="10" right="10" top="10" bottom="10">
<s:VGroup width="100%">
<s:Button label="Default Button" click="printMessage(event);"/>
<s:Button label="autoRepeat Button" buttonDown="printMessage(event);"
autoRepeat="true"/>
<s:Button label="Disabled Button" enabled="false"
click="printMessage(event);"/>
</s:VGroup>
<s:TextArea x="80" y="0" id="message" height="100%" width="100%"
color="#0000FF"/>
</s:VGroup>
</s:Panel>
</s:Application>

[プロジェクト]=>[プロジェクト設定]を選択し、以下のように実行するプレイヤーを変更しておきます
78_14.png


最後に[F5]を押すと、コンパイルされ、ポップアップでFlashPlayerが起動します。
通常通りであれば、ここで正常に起動して、Buttonが表示されるサンプルが実行されます。
出来なかったら教えてください。
なお、上記ソースコードはFlex 4のリファレンスサイト(Adobe提供)のソースをコピペしたものとなります。
http://help.adobe.com/en_US/FlashPlatform//reference/actionscript/3/spark/components/Button.html


FlashDevelopの日本語化の設定


次にFlashDevelopの日本語化をしておきましょう。
[F10]=>左ナビゲーション[FlashDevelop]=>右ペインを一番下までスクロールしたところに[Selected Locale]がありますので、プルダウンからja_JPを選択します


78_07.png


[Close]ボタンを選択し、[File]から[Restart]を選択します。(普通に×ボタンで閉じて、再度起動しなおして得もOK)
ちなみに最初やったときは何故かen_USに戻っていたので、もう一回やったら適用されました。
78_08.png


スポンサーサイト

[FlashDevelop]FlexUnitTestを使ってみたい。

[FlashDevelop]FlexUnitTestを使ってみたい


FlexのUnitテストを使いたいのです。


使いたいのはadobeのOpenSourceに登録されているorg.flexunitです。


FlexUnit 4.1 Beta 1を使ってみたいナーと思っています。
上記URLからダウンロードして解凍してみたらflex3でのデモが入っていましたので、とりあえずこれで試してみたいなと思っています。


プロジェクト構造


解凍したら以下のようなプロジェクト構造でした。



├─html-template
│ └─history
├─libs
└─src
├─main
│ └─flex
│ └─org
│ └─flexunit
│ └─demo
└─test
└─flex
└─org
└─flexunit
└─demo

JavaのUnitテストと同様な形ですごく使いやすそうでした。
Flex Builder使えばいいんだけどさ...
今度FlashDevelopでも使えるか試してみたいと思います。
今日は覚書のみです。

[FlashDevlop]Debug(デバック)プラグイン

[FlashDevelop]Debug(デバック)プラグイン - FlexDbg


FlashDevelopの[3rd Party Plugins]にFlexDbgというものがあったので試してみました。

基本的なインターフェイスはfdbPluginと同じっぽい。


ダウンロード


こちらのページからダウンロードできます。

http://www.flashdevelop.org/community/viewtopic.php?f=4&t=4660


上記のページ内の一番最初のメッセージ内の下部にある以下の箇所をクリックしてzipファイルをダウンロードしてください。

FlexDbg_01.png


インストール


ダウンロードしたzipファイルを解凍します。


解凍後のフォルダ内に4つのdllファイルがありますので、それらをFlashDevelopインストールディレクトリ内の
Pluginへ移動します。(デフォルトだとC:\Program Files\FlashDevelop\Plugins)


これで、インストールは完了です。


※バッティングするかもしれなかったので、fdbPluginは削除してから入れました。

上書き確認がでますので、OKを押してください。不安ならば、バックアップを取りましょう。


簡単な使い方


ブレイクポイントの設定


ブレイクポイントを設定したい箇所左端でクリックするだけ。

もう一度選択すると、enabledがfalseになります。(ブレイクポイントとしてはあるけれど、有効ではない状態)

さらにもう一度選択すると、ブレイクポイントが解除されます。


ブレイクポイント有効状態

ブレイクポイント無効状態


デバックの開始


ブレイクポイントが設定されている状態で、メニューバーの[Debug] => [Start]と押下するだけで実行されます。
各種ウィンドウが表示されていない場合は、ここを押すと出てきます。

デバックが開始されるとメニューバーの各種機能が利用できるようになります。

FlexDbg_04.png


FlexDbgプラグインのまとめ


現在使用しているfdbPluginと同等以上の機能です。

これ採用!!

ちなみにAIRもサポートしているらしいですが、AIRは範疇外ですので...
ちなみに結構ハングするので、保存してからデバックしましょう。
間違ってもデバック中にデバック用のFlashPlayerを終了させないように...

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。