Search Flex Samples

Displaying RadioButton controls using the Repeater in Flex (redux)







xmlns:comps="comps.*"
layout="vertical"
verticalAlign="middle"
backgroundColor="white">






package comps {
import flash.events.Event;

import mx.containers.ApplicationControlBar;
import mx.containers.Canvas;
import mx.containers.Form;
import mx.containers.FormItem;
import mx.containers.HBox;
import mx.controls.Alert;
import mx.controls.Label;
import mx.controls.RadioButton;
import mx.controls.RadioButtonGroup;
import mx.core.Application;
import mx.core.Repeater;
import mx.core.UIComponentDescriptor;
import mx.styles.CSSStyleDeclaration;
import mx.styles.StyleManager;

public class MyComp extends Canvas {
private var arr:Array;
private var appControlBar:ApplicationControlBar;
private var form:Form;
private var formItem:FormItem;
private var lbl:Label;
private var hBox:HBox;
private var radioGroup:RadioButtonGroup;
private var radioRepeater:Repeater;

public function MyComp() {
super();
init();
}

private function init():void {
var alertCSS:CSSStyleDeclaration;
alertCSS = StyleManager.getStyleDeclaration("Alert");
alertCSS.setStyle("backgroundAlpha", 0.8);
alertCSS.setStyle("backgroundColor", "black");
alertCSS.setStyle("borderAlpha", 0.8);
alertCSS.setStyle("borderColor", "black");

arr = [];
arr.push({label:"Red", data:"red"});
arr.push({label:"Orange", data:"haloOrange"});
arr.push({label:"Yellow", data:"yellow"});
arr.push({label:"Green", data:"haloGreen"});
arr.push({label:"Blue", data:"haloBlue"});

radioGroup = new RadioButtonGroup();

lbl = new Label();

formItem = new FormItem();
formItem.label = "selectedValue:";
formItem.addChild(lbl);

form = new Form();
form.styleName = "plain";
form.addChild(formItem);

appControlBar = new ApplicationControlBar();
appControlBar.dock = true;
appControlBar.addChild(form);
Application.application.addChildAt(appControlBar, 0);

hBox = new HBox();
hBox.setStyle("horizontalGap", 60);
addChild(hBox);

var descriptorProps:Object = {};
descriptorProps.type = RadioButton;
descriptorProps.document = this;
descriptorProps.propertiesFactory = radioPropFac;
descriptorProps.events = {change:"radioButton_change"};

var radioDescriptor:UIComponentDescriptor = new UIComponentDescriptor(descriptorProps);

radioRepeater = new Repeater();
radioRepeater.dataProvider = arr;
radioRepeater.childDescriptors = [radioDescriptor];
radioRepeater.initializeRepeater(hBox, true);
}

private function radioPropFac():Object {
var obj:Object = {};
obj.label = radioRepeater.currentItem.label;
obj.group = radioGroup;
return obj;
}

public function radioButton_change(evt:Event):void {
var radio:RadioButton = RadioButton(evt.currentTarget);
var item:Object = radio.getRepeaterItem();
var cssObj:CSSStyleDeclaration;
cssObj = StyleManager.getStyleDeclaration("Alert");
cssObj.setStyle("modalTransparencyColor", item.data);
cssObj.setStyle("themeColor", item.data);
Alert.show(item.label, "getRepeaterItem()");

callLater(updateSelectedValue, [evt]);
}

private function updateSelectedValue(evt:Event):void {
lbl.text = radioGroup.selectedValue.toString();
}
}
}




8:37 AM | |

This entry was posted on 8:37 AM You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.

 

0 comments:

Post a Comment

Subscribe to: Post Comments (Atom)

Related Flex Samples

Loading...

Learn Flex: Flex Samples | Flex Video Tutorials Flex Examples