feathers:Radioボタンのテスト
2012/10/17
category: Feathers | tag: ActionScript, AIR, FlashBuilder, Starling | no comments
画像とフォントを用意して、radioボタンを実装してみました。
サンプルコード：
※とりあえず動作を見るためのベタ打ちコードです。奇麗じゃないです。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
package { import flash.display.Sprite; import starling.core.Starling; [SWF(frameRate="60", width="320", height="240", backgroundColor="#f0f0f0")] public class FeathersRadio extends Sprite { private var myStarling:Starling; public function FeathersRadio() { myStarling = new Starling(Main, stage); myStarling.start(); } } } |
いつものコード。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 |
package { import flash.display.Bitmap; import flash.utils.Dictionary; import starling.text.BitmapFont; import starling.text.TextField; import starling.textures.Texture; import starling.textures.TextureAtlas; public class Assets { public function Assets() { } [Embed(source="../assets/images/sprites2x.png")] public static const AppTextureAtlas:Class; [Embed(source="../assets/images/sprites2x.xml", mimeType="application/octet-stream")] public static const AppTextureXML:Class; private static var appTextureAtlas:TextureAtlas; private static var appTextures:Dictionary = new Dictionary(); public static function getTexture(name:String):Texture { if (appTextures[name] == undefined) { var bitmap:Bitmap = new Assets[name](); appTextures[name] = Texture.fromBitmap(bitmap); } return appTextures[name]; } public static function getAtlas():TextureAtlas { if (appTextureAtlas == null) { var texture:Texture = getTexture("AppTextureAtlas"); var xml:XML = XML(new AppTextureXML()); appTextureAtlas = new TextureAtlas(texture, xml); } return appTextureAtlas; } [Embed(source="../assets/images/font.png")] public static const FontTexture:Class; [Embed(source="../assets/images/font.xml", mimeType="application/octet-stream")] public static const FontXML:Class; private static var appFont:BitmapFont; public static function getFont():BitmapFont { var fontTexture:Texture = Texture.fromBitmap(new FontTexture()); var fontXML:XML = XML(new FontXML()); var font:BitmapFont = new BitmapFont(fontTexture, fontXML); TextField.registerBitmapFont(font); return font; } } } |
画像とビットマップフォントはテクスチャアトラスを作成して読み込んでいます。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 |
package { import feathers.controls.Button; import feathers.controls.Label; import feathers.controls.Radio; import feathers.core.ToggleGroup; import feathers.display.Image; import feathers.text.BitmapFontTextFormat; import flashx.textLayout.elements.IConfiguration; import starling.display.Sprite; import starling.events.Event; import starling.textures.TextureSmoothing; public class Main extends Sprite { private var _group:ToggleGroup; private var _radio1:Radio; private var _radio2:Radio; private var _label:Label; public function Main() { this.addEventListener(Event.ADDED_TO_STAGE, onAddedToStage); } private function onAddedToStage(e:Event):void { _label = new Label(); _label.textRendererProperties.textFormat = new BitmapFontTextFormat(Assets.getFont()); _label.textRendererProperties.smoothing = TextureSmoothing.NONE; _label.textRendererProperties.textFormat.color = 0xFF6600; _label.textRendererProperties.textFormat.size = 26; _label.text = "TEST"; _label.x = 40; _label.y = 160; this.addChild(_label); _group = new ToggleGroup(); _group.onChange.add(group_onChange); _radio1 = new Radio(); _radio1.defaultLabelProperties.textFormat = new BitmapFontTextFormat(Assets.getFont()); _radio1.defaultLabelProperties.smoothing = TextureSmoothing.NONE; _radio1.defaultLabelProperties.textFormat.color = 0x333333; _radio1.defaultLabelProperties.textFormat.size = 26; _radio1.defaultSelectedIcon = new Image(Assets.getAtlas().getTexture("radio03.png")); _radio1.selectedDownIcon = new Image(Assets.getAtlas().getTexture("radio04.png")); _radio1.defaultIcon = new Image(Assets.getAtlas().getTexture("radio01.png")); _radio1.downIcon = new Image(Assets.getAtlas().getTexture("radio02.png")); _radio1.label = "ONE"; _radio1.toggleGroup = _group; _radio1.x = 30; _radio1.y = 60; this.addChild(_radio1); _radio2 = new Radio(); _radio2.defaultLabelProperties.textFormat = new BitmapFontTextFormat(Assets.getFont()); _radio2.defaultLabelProperties.smoothing = TextureSmoothing.NONE; _radio2.defaultLabelProperties.textFormat.color = 0x333333; _radio2.defaultLabelProperties.textFormat.size = 26; _radio2.defaultSelectedIcon = new Image(Assets.getAtlas().getTexture("radio03.png")); _radio2.selectedDownIcon = new Image(Assets.getAtlas().getTexture("radio04.png")); _radio2.defaultIcon = new Image(Assets.getAtlas().getTexture("radio01.png")); _radio2.downIcon = new Image(Assets.getAtlas().getTexture("radio02.png")); _radio2.label = "TWO"; _radio2.toggleGroup = _group; _radio2.x = 170; _radio2.y = 60; this.addChild(_radio2); } private function group_onChange(group:ToggleGroup):void { switch(group.selectedIndex) { case 0: { _label.text = "SELECTED : ONE"; break; } case 1: { _label.text = "SELECTED : TWO"; break; } default: { _label.text = "SELECTED : UNKNOWN"; break; } } } } } |
各種画像の設定
defaultSelectedIcon : 選択状態の画像
selectedDownIcon : 選択状態でマウスが押された状態の画像
defaultIcon : 非選択状態の画像
downIcon : 非選択状態でマウスが押された状態の画像
実行結果：
This movie requires Flash Player 11
グループのイベント(onChange)に設定したハンドラが、ラジオボタンをクリックしなくても最初に１度呼ばれている模様。
どのタイミングで呼ばれているかは未確認。
コメントを残す
コメントを投稿するにはログインしてください。