Jan 30
I was doing programmic skinning yesterday and was wondering how i can make a gradient goes from a lighter tone to a darker tone if a user choose 1 color. for example, if the user choose a blue color, I want the skin to goes from light blue to dark blue, from top to bottom. Initially, I though I will have to do some hexidecimal calculation and when to google about it. Then, I though I should just check out Color related class in Flex and I found the ColorUtil class. That do the job!
So the codes goes like this if you want to take a look:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 | //This class extends BorderSkin [Bindable]public var color:uint = 0xffcc00; protected override function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void { super.updateDisplayList(unscaledWidth, unscaledHeight); this.graphics.clear() var matrix:Matrix = new Matrix(); matrix.createGradientBox(unscaledWidth,unscaledHeight, Math.PI/2); // using ColorUtil, adjustBrightness increase brightness by 40 (you can use -255 to 255) this.graphics.beginGradientFill(GradientType.LINEAR, [ColorUtil.adjustBrightness( color, 40), color ], [1, 1], [0x00,0xff], matrix); this.graphics.drawRoundRect(0,0, unscaledWidth, unscaledHeight, 10) this.grahpics.endFill() } |
The Changing of Color brightness in Flex by expertria.com, unless otherwise expressly stated, is licensed under a Creative Commons Attribution-Noncommercial 3.0 Unported License.
