今回はFlexの基礎の基礎、導入から簡単なオブジェクトの設置まで。
MXMLってなんなのーってのが、しっぽりわかる予感。
Flex 3.0 SDKをダウンロード。
以後、コンパイルは
mxmlc hoge.mxml
のように、めんどい人はバッチファイルでも作ってください。
あとメインのmxmlファイルの文字コードはUTF-8で、ゲイツな場合は気をつけて。
そもそもFlexは、ActionScriptを簡単に生成してくれるXMLライクなMXMLってなだけなので、Flash職人はFlashを使えばいいしActionScript職人はFlashDevelopを使ったほうが、作りやすいと思われる。
たったのこれだけで、「くそぶた」ボタンを設置したFlashが生成できるのである。
次に、この「くそぶた」ボタンを押したときの動作、いわゆるイベントハンドラだが、これも簡単。
「くそぶた」をクリックすれば、「orz」になる。
id="buta" でこのボタンの名前を決め、
click="buta.label='orz'" ではクリックしたときに、butaのlabelをorzにするよ、と指定しているだけ。
これは前のやつと動作は一緒だが、クリックしたときに直接butaのレベルを変更するのではなく、hogeを呼び出してhogeの中でbutaのラベルを変更してみた。
ボタンの色、配置、背景の色などはCSSで簡単に定義できる。
元々はActionScriptだけで全てできることなのだが、FlexではMXML、CSSを使用することで更に扱いが容易になった、というイメージ。
プログラマがやるであろうイベント処理の部分はActionScriptを外部ファイルとして読み込むことで実装できるので、
webデザイナーな人はMXMLでオブジェクトの配置、CSSでデザインだけを考えればいい。
とってもweb開発ライクなもの、Flexでした。
次回はCSSと外部ASファイルの扱いと、応用編で。
余談としては会社で毎週やってるgungi(エンジニア勉強会)で次回たしまがFlexでクソゲー作りを語ることになっているので、(Flexはおろか、ActionScript、Flashすらやったことないのに)それに向けて勉強してる課程での情報共有だけで便所の落書きみたいなもんです。
Flexをやればやるほど、「あぁこれはすごいぞwebエンジニアがとっつきやすい」と思う反面、「これじゃ逆にゲーム作りに向いてねぇじゃん・・・」と思ったのでありました。
冒頭で紹介したFlashDevelopというフリーのIDEを使えば、ゲーム作りができそうです。
Flexでリッチなwebアプリケーションの開発、とかなんとかの場合はすごくいいです。
サーバーサイドのJavaならいざ知らず、ローカルのJavaアプリケーションは全てFlex、AIRにとって変わる時代がくるかもしれません。
#同じスタートラインならどう考えてもAIRですが、Javaのシェア、Javaエンジニアの数を考えるとまだJavaの時代は続きそう
MXMLってなんなのーってのが、しっぽりわかる予感。
Flex 3.0 SDKをダウンロード。
以後、コンパイルは
mxmlc hoge.mxml
のように、めんどい人はバッチファイルでも作ってください。
あとメインのmxmlファイルの文字コードはUTF-8で、ゲイツな場合は気をつけて。
そもそもFlexは、ActionScriptを簡単に生成してくれるXMLライクなMXMLってなだけなので、Flash職人はFlashを使えばいいしActionScript職人はFlashDevelopを使ったほうが、作りやすいと思われる。
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="horizontal" width="350" height="250">
<mx:Button label="くそぶた"/>
</mx:Application>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="horizontal" width="350" height="250">
<mx:Button label="くそぶた"/>
</mx:Application>
たったのこれだけで、「くそぶた」ボタンを設置したFlashが生成できるのである。
次に、この「くそぶた」ボタンを押したときの動作、いわゆるイベントハンドラだが、これも簡単。
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="horizontal" width="350" height="250">
<mx:Button id="buta" label="くそぶた" click="buta.label='orz'"/>
</mx:Application>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="horizontal" width="350" height="250">
<mx:Button id="buta" label="くそぶた" click="buta.label='orz'"/>
</mx:Application>
「くそぶた」をクリックすれば、「orz」になる。
id="buta" でこのボタンの名前を決め、
click="buta.label='orz'" ではクリックしたときに、butaのlabelをorzにするよ、と指定しているだけ。
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="horizontal" width="350" height="250">
<mx:Script>
<![CDATA[
public function hoge():void {
buta.label='うんち';
}
]]>
</mx:Script>
<mx:Button id="buta" label="くそぶた" click="hoge();"/>
</mx:Application>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="horizontal" width="350" height="250">
<mx:Script>
<![CDATA[
public function hoge():void {
buta.label='うんち';
}
]]>
</mx:Script>
<mx:Button id="buta" label="くそぶた" click="hoge();"/>
</mx:Application>
これは前のやつと動作は一緒だが、クリックしたときに直接butaのレベルを変更するのではなく、hogeを呼び出してhogeの中でbutaのラベルを変更してみた。
ボタンの色、配置、背景の色などはCSSで簡単に定義できる。
元々はActionScriptだけで全てできることなのだが、FlexではMXML、CSSを使用することで更に扱いが容易になった、というイメージ。
プログラマがやるであろうイベント処理の部分はActionScriptを外部ファイルとして読み込むことで実装できるので、
webデザイナーな人はMXMLでオブジェクトの配置、CSSでデザインだけを考えればいい。
とってもweb開発ライクなもの、Flexでした。
次回はCSSと外部ASファイルの扱いと、応用編で。
余談としては会社で毎週やってるgungi(エンジニア勉強会)で次回たしまがFlexでクソゲー作りを語ることになっているので、(Flexはおろか、ActionScript、Flashすらやったことないのに)それに向けて勉強してる課程での情報共有だけで便所の落書きみたいなもんです。
Flexをやればやるほど、「あぁこれはすごいぞwebエンジニアがとっつきやすい」と思う反面、「これじゃ逆にゲーム作りに向いてねぇじゃん・・・」と思ったのでありました。
冒頭で紹介したFlashDevelopというフリーのIDEを使えば、ゲーム作りができそうです。
Flexでリッチなwebアプリケーションの開発、とかなんとかの場合はすごくいいです。
サーバーサイドのJavaならいざ知らず、ローカルのJavaアプリケーションは全てFlex、AIRにとって変わる時代がくるかもしれません。
#同じスタートラインならどう考えてもAIRですが、Javaのシェア、Javaエンジニアの数を考えるとまだJavaの時代は続きそう
Comment投稿






