【Main.as(AS3)】

package{
    …省略…
    //
    import sketchbook.colors.ColorSB;
    //
    import my.Log;
    import my.FlexDefaultComponents;
    //========================================================================//
    public class Main extends Application{
        private const HUE_MAX:int = 360; // 色相の最大値
        private const HUE_STEP:int = 4;  // 色相の刻み値
        private const S_B_MAX:int = 100; // 明度＆彩度の最大値
        private const S_B_STEP:int = 10; // 明度＆彩度の刻み値
        //
        private var hue_cpicker:ColorPicker, s_b_cpicker:ColorPicker;
        //--------------------------------------------------------------------//
        public function Main() {
            super();
            FlexDefaultComponents.stylesInit();
            Log.trace("i Main");
            //
            this.layout = "absolute";
            this.setStyle("backgroundColor", 0xDEE2E2);
            this.addEventListener(FlexEvent.APPLICATION_COMPLETE, app_complete);
        }
        //--------------------------------------------------------------------//
        private function app_complete(a_event:FlexEvent):void{
            Log.trace("i app_complete:" + a_event);
            //
            var acbar:ApplicationControlBar = new ApplicationControlBar();
            acbar.dock = true;
            var label:Label = new Label();
            label.text = "HSVカラーピッカー(左が色相、右が明度＆彩度)";
            acbar.addChild(label);
            //
            var root_layout:HBox = new HBox();
            root_layout.setStyle("paddingLeft", 8);
            root_layout.setStyle("paddingTop", 8);
            root_layout.setStyle("paddingRight", 8);
            root_layout.setStyle("paddingBottom", 8);
            root_layout.y = 8;
            root_layout.percentWidth = root_layout.percentHeight = 100;
            //色相カラーピッカー
            hue_cpicker = new ColorPicker();
            hue_cpicker.width = hue_cpicker.height = 80;
            hue_cpicker.showTextField = false;
            hue_cpicker.setStyle("openDuration", 70);
            hue_cpicker.setStyle("closeDuration", 30);
            var hue_css:CSSStyleDeclaration = new CSSStyleDeclaration();
            hue_css.defaultFactory = function ():void{
                this.columnCount = HUE_MAX / HUE_STEP / 6;
                this.swatchHeight = this.swatchWidth = 40;
                this.swatchBorderSize = this.swatchHighlightSize = 2;
                this.swatchGridBorderSize = 1;
                this.previewWidth = this.previewHeight = 0;
            };
            StyleManager.setStyleDeclaration(".cpicker_hue", hue_css, true);
            hue_cpicker.setStyle("swatchPanelStyleName", "cpicker_hue");
            hue_cpicker.addEventListener(ColorPickerEvent.CHANGE, hue_change);
            hue_cpicker.addEventListener(DropdownEvent.CLOSE, hue_close);
            //明度＆彩度カラーピッカー
            s_b_cpicker = new ColorPicker();
            s_b_cpicker.width = s_b_cpicker.height = 80;
            s_b_cpicker.showTextField = false;
            s_b_cpicker.setStyle("openDuration", 70);
            s_b_cpicker.setStyle("closeDuration", 30);
            var s_b_css:CSSStyleDeclaration = new CSSStyleDeclaration();
            s_b_css.defaultFactory = function ():void{
                this.columnCount = S_B_MAX / S_B_STEP + 1;
                this.swatchHeight = this.swatchWidth = 40;
                this.swatchBorderSize = this.swatchHighlightSize = 2;
                this.swatchGridBorderSize = 1;
                this.previewWidth = this.previewHeight = 0;
            };
            StyleManager.setStyleDeclaration(".cpicker_s_b", s_b_css, true);
            s_b_cpicker.setStyle("swatchPanelStyleName", "cpicker_s_b");
            s_b_cpicker.addEventListener(DropdownEvent.CLOSE, s_b_close);
            //色相のパレットデータを作って登録
            var hsb:ColorSB = new ColorSB();
            var hue_palette:Array = [];
            for (var hue:int=0; hue<HUE_MAX; hue+=HUE_STEP) {
                hsb.setHSB(hue, S_B_MAX, S_B_MAX);
                hue_palette.push(hsb.value);
            }
            hue_cpicker.dataProvider = hue_palette;
            hue_cpicker.selectedColor = hue_palette[0];
            //配置
            root_layout.addChild(hue_cpicker);
            root_layout.addChild(s_b_cpicker);
            this.addChild(acbar);
            this.addChild(root_layout);
            //色相カラーピッカーへCHANGEイベント送出
            hue_cpicker.dispatchEvent(new ColorPickerEvent(ColorPickerEvent.CHANGE));
        }
        //--------------------------------------------------------------------//
        private function hue_change(a_event:ColorPickerEvent):void{
            Log.trace("i hue_change:" + a_event);
            //選ばれた色相から、明度＆彩度のパレットデータを作って登録
            var hsb:ColorSB = new ColorSB();
            var s_b_palette:Array = [];
            var s:int, b:int;
            for (b=0; b<=S_B_MAX; b+=S_B_STEP) {
                for (s=0; s<=S_B_MAX; s+=S_B_STEP) {
                    hsb.setHSB(a_event.index*HUE_STEP, S_B_MAX-s, S_B_MAX-b);
                    s_b_palette.push(hsb.value);
                }
            }
            s_b_cpicker.dataProvider = s_b_palette;
            s_b_cpicker.selectedColor = s_b_palette[0];
        }
        //--------------------------------------------------------------------//
        private function hue_close(a_event:DropdownEvent):void{
            Log.trace("i hue_close:" + a_event);
            //
            s_b_cpicker.open();
        }
        private function s_b_close(a_event:DropdownEvent):void{
            Log.trace("i s_b_close:" + a_event);
            //
            hue_cpicker.open();
        }
        //--------------------------------------------------------------------//
    }
}