３．SpriteをaddChildしたい！
mxmlでSpriteをaddChildしたい
SpriteやTextFieldのように、flash.〜のパッケージにあるクラス（flash.displayやflash.textですね）を今までよく使ってきたのですが、これらも普通に使えるんだろうな、と思ったので試してみました。
まず、動作確認を兼ねて、、、前ページの最後に書いたmxmlファイルで読み込むasファイルに次のように書いてみました。
import mx.controls.*;
public function init():void {
var myLabel:Label = new Label();
myLabel.text="表示テストだよ";
addChild(myLabel);
}
public function init():void {
var myLabel:Label = new Label();
myLabel.text="表示テストだよ";
addChild(myLabel);
}
これ、意図通り実行されます（以下のような感じです）。
なるほど、こんな感じで表示されるんだ、と背景がFlexっぽいのに感動しつつ、同じようにSpriteもaddChildしてみました。
import mx.controls.*;
public function init():void {
var myLabel:Label = new Label();
myLabel.text="表示テストだよ";
addChild(myLabel);
//以下追加
var mySprite:Sprite = new Sprite();
mySprite.graphics.lineStyle(1, 0xFF0000);
mySprite.graphics.drawCircle(0 , 0, 10);
addChild(mySprite);
}
public function init():void {
var myLabel:Label = new Label();
myLabel.text="表示テストだよ";
addChild(myLabel);
//以下追加
var mySprite:Sprite = new Sprite();
mySprite.graphics.lineStyle(1, 0xFF0000);
mySprite.graphics.drawCircle(0 , 0, 10);
addChild(mySprite);
}
単に、赤い円を描いただけですね。
で、この実行結果は、というと、、、上と変わらず、円は表示されません！
ちなみに、Flex2 SDKではコンパイル時に警告もエラーも出ません。実行時にエラー等の表示も出ません。
タチの悪いことに、このラベル表示部分とSprite表示部分の順を入れ替えると、Label部分が表示されません。つまり、処理が止まっているようです。
だったら、警告かなにか出してくれてもいいのに、、、とか思ったりするのですが、ここでぼやいてても仕方ないですね。
UIComponentを使ってみる
最初、Flex2でSpriteの表示ができなかったら、、、と思うとぞっとしたのですが、ネットで調べるとUIComponentなるものを使えばよい、との記述を見ました。
ということで、以下のように書いてみます。
Spriteの前に、UIComponentをかませるような感じですね。
import mx.controls.*;
public function init():void {
var myLabel:Label = new Label();
myLabel.text="UIComponentを使ってみる！";
addChild(myLabel);
//UIComponentを使う！
var myUIComponent:UIComponent = new UIComponent();
addChild(myUIComponent);
var mySprite:Sprite = new Sprite();
mySprite.graphics.lineStyle(1, 0xFF0000);
mySprite.graphics.drawCircle(0 , 0, 10);
myUIComponent.addChild(mySprite);//myUIComponentにaddChildする！
}
public function init():void {
var myLabel:Label = new Label();
myLabel.text="UIComponentを使ってみる！";
addChild(myLabel);
//UIComponentを使う！
var myUIComponent:UIComponent = new UIComponent();
addChild(myUIComponent);
var mySprite:Sprite = new Sprite();
mySprite.graphics.lineStyle(1, 0xFF0000);
mySprite.graphics.drawCircle(0 , 0, 10);
myUIComponent.addChild(mySprite);//myUIComponentにaddChildする！
}
表示位置なんかはとりあえずおいといて、とりあえず表示してくれることを確認。
あーよかった。