/**
 * http://blog.flexexamples.com/2008/06/09/setting-a-border-color-on-the-combobox-control-in-flex/
 */
package comps {
    import mx.containers.ApplicationControlBar;
    import mx.containers.Canvas;
    import mx.containers.Form;
    import mx.containers.FormItem;
    import mx.controls.ColorPicker;
    import mx.controls.ComboBox;
    import mx.core.Application;
    import mx.events.ColorPickerEvent;

    public class MyComp extends Canvas {
        private var arr:Array;
        private var appControlBar:ApplicationControlBar;
        private var colorPicker:ColorPicker;
        private var comboBox:ComboBox;

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

        private function init():void {
            arr = [];
            arr.push({label:"One"});
            arr.push({label:"Two"});
            arr.push({label:"Three"});
            arr.push({label:"Four"});
            arr.push({label:"Five"});
            arr.push({label:"Six"});

            colorPicker = new ColorPicker();
            colorPicker.addEventListener(ColorPickerEvent.CHANGE, colorPicker_change);

            var formItem:FormItem = new FormItem();
            formItem.label = "borderColor:";
            formItem.addChild(colorPicker);

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

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

            comboBox = new ComboBox();
            comboBox.dataProvider = arr;
            addChild(comboBox);
        }

        private function colorPicker_change(evt:ColorPickerEvent):void {
            comboBox.setStyle("borderColor", evt.color);
        }
    }
}