Question

I am trying to create a Colorpicker control for my application. I prefer pure actionscript. Does someone know how to create a picker like this: http://parasolarchives.com/tools/colorpicker/
Most interestingly I am interested how to draw the gradient because the gradient has a saturation,

Answer 1

this is a picker i use myself, hope it’ll be useful:

package lazylib.ui.generated
{
    import flash.display.Bitmap;
    import flash.display.BitmapData;
    import flash.display.Sprite;
    import flash.display.GradientType;
    import flash.events.MouseEvent;
    import flash.geom.ColorTransform;
    import flash.geom.Matrix;
    import lazylib.broadcast.evts.ColorEvent;
    import lazylib.broadcast.Radio;
    /**
     * ...
     * @author www0z0k
     */
    public class Picker extends Sprite
    {
        private var bmpc: Bitmap;
        private var bmp:BitmapData;
        private var id:String;
        private var w:int;
        private var h:int;
        public static const COLOR_PICKED_EVT_TYPE: String = 'picked by picker';
        public function Picker(_id:String, _w:int = 256, _h:int = 256, _x:int = 0, _y:int = 0) 
        {
            id = _id;
            w = _w;
            h = _h;
            x = _x;
            y = _y;
            bmp = new BitmapData(w, h);
            bmpc = new Bitmap(bmp);
            addChild(bmpc);
            refillBmp(0x7f7f7f);

        }

        public function get ID():String { return id; }

        private function refillBmp(overColor:int = 0x7f7f7f, alphaStep:Number = 0.006):void {
            var rtspr:Sprite = new Sprite();
            var spr:Sprite = new Sprite();
            var colors:Array = new Array(0xff0000,0xff7f00,0xffff00,0x7fff00,0x00ff00, 0x00ff7f, 0x00ffff,0x007fff,0x0000ff, 0x7f00ff,0xff00ff, 0xff007f, 0xff0000);
            var alphas: Array = new Array(1,         1,      1,          1,         1,      1,    1,        1,         1,       1,       1,        1,        1);
            var ratios: Array = new Array(10,        30,    50,          70,        90,     110,   130,      150,       170,    190,    210,      230,       250);
            var matrix:Matrix = new Matrix();
            matrix.createGradientBox(w, h);
            spr.graphics.beginGradientFill(GradientType.LINEAR, colors, alphas, ratios, matrix);
            spr.graphics.drawRect(0, 0, w, h);
            spr.graphics.endFill();
            rtspr.addChild(spr);
            var spr2:Sprite = new Sprite();
            rtspr.addChild(spr2);
            var startA: Number = 1;
            for (var i:int = 0; startA > 0; i++) {
                startA -= alphaStep;//orig 0.004!!!
                spr2.graphics.lineStyle(1, overColor, startA);
                spr2.graphics.moveTo(0, h - i);
                spr2.graphics.lineTo(w, h - i);
            }
            bmp.draw(rtspr, new Matrix());  
            graphics.beginFill(0, 0);
            graphics.drawRect(0, 0, w, h);
            graphics.endFill();
            buttonMode = true;
            addEventListener(MouseEvent.CLICK, onClick);
        }

        public function adjustDarkness(percent:int):void {
            var colorValue: int = int(255 * percent / 100);
            var currentGray:int = colorValue + colorValue << 8 + colorValue << 16;
            refillBmp(colorValue);

        }

        private function onClick(e:MouseEvent):void {
            var col: int = bmp.getPixel(e.localX, e.localY);
            Radio.broadcast(new ColorEvent(COLOR_PICKED_EVT_TYPE + id, col));
            dispatchEvent(new ColorEvent(COLOR_PICKED_EVT_TYPE + id, col));
        }

    }

}

Radio is a global dispatcher class (posted here if you need it), ColorEvent is just an event with an int color field, adjustDarkness is usually called from an external scrollbar. Let me know if a working example is needed.