Starling+FeathersのButtonGroup をテンプレートにして作成 :: NJF Wiki

開始行:
UIの作成では、同様の機能を持ったボタンを並べる事が多い。 そんなときに役立つのがButtonGroup。名前の通りボタンをグル... var group:ButtonGroup = new ButtonGroup(); baseSp.addChild(group); group.dataProvider = new ListCollection( [ { label: "One",id:1}, { label: "Two",id:2}, { label: "Three",id:3} ]); これで一つずつボタンを初期化しなくてもラベルがついたボタ... イベントの取得もグループ単位でできるのでとても便利。 group.addEventListener(Event.TRIGGERED, triggeredHandler); ここで、 function triggeredHandler( event:Event):void { trace( "button triggered:",event.data.id); } dataプロパティを使うと、dataProviderの該当データが取得で... ボタンのデザインを変えるには、buttonFactoryプロパティを使... group.buttonFactory = function():Button { var button:Button = new Button(); button.defaultSkin = new Quad(StarlingWrapper.STAGE_WID... button.downSkin = new Quad(StarlingWrapper.STAGE_WIDTH,... button.labelFactory = function():ITextRenderer { var labelRenderer:TextFieldTextRenderer=new TextFieldT... labelRenderer.textFormat = new TextFormat(null, 32,0x0... return labelRenderer; } return button; }; buttonInitializerプロパティを使うとボタンの初期化を制御で... group.buttonInitializer = function( button:Button, item:... { if (item.id == 1) { button.defaultIcon = new Quad(10, 10, 0xff0000); } button.label = item.label; }; とする。 レイアウトの調整もできる。 group.direction = ButtonGroup.DIRECTION_VERTICAL; group.gap = 5; group.lastGap = 20; 実行結果はこちら。 &ref(buttonGroup.png,mw:480,mh:360); ソースはこちら。 &ref(ButtonGroupTest.as); StarlingWrapper.STAGE_WIDTHとかは適当に書きかえてください。

終了行:
UIの作成では、同様の機能を持ったボタンを並べる事が多い。 そんなときに役立つのがButtonGroup。名前の通りボタンをグル... var group:ButtonGroup = new ButtonGroup(); baseSp.addChild(group); group.dataProvider = new ListCollection( [ { label: "One",id:1}, { label: "Two",id:2}, { label: "Three",id:3} ]); これで一つずつボタンを初期化しなくてもラベルがついたボタ... イベントの取得もグループ単位でできるのでとても便利。 group.addEventListener(Event.TRIGGERED, triggeredHandler); ここで、 function triggeredHandler( event:Event):void { trace( "button triggered:",event.data.id); } dataプロパティを使うと、dataProviderの該当データが取得で... ボタンのデザインを変えるには、buttonFactoryプロパティを使... group.buttonFactory = function():Button { var button:Button = new Button(); button.defaultSkin = new Quad(StarlingWrapper.STAGE_WID... button.downSkin = new Quad(StarlingWrapper.STAGE_WIDTH,... button.labelFactory = function():ITextRenderer { var labelRenderer:TextFieldTextRenderer=new TextFieldT... labelRenderer.textFormat = new TextFormat(null, 32,0x0... return labelRenderer; } return button; }; buttonInitializerプロパティを使うとボタンの初期化を制御で... group.buttonInitializer = function( button:Button, item:... { if (item.id == 1) { button.defaultIcon = new Quad(10, 10, 0xff0000); } button.label = item.label; }; とする。 レイアウトの調整もできる。 group.direction = ButtonGroup.DIRECTION_VERTICAL; group.gap = 5; group.lastGap = 20; 実行結果はこちら。 &ref(buttonGroup.png,mw:480,mh:360); ソースはこちら。 &ref(ButtonGroupTest.as); StarlingWrapper.STAGE_WIDTHとかは適当に書きかえてください。

ページ名: