Flex Examples
Here’s a quick post on converting some colors from strings to integers, and splitting colors into separate red/green/blue values, and formatting colors using Flex.
Full code after the jump.
<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2007/08/13/converting-and-formatting-colors/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical"
verticalAlign="middle"
backgroundColor="white">
<mx:Script>
<![CDATA[
private function fixedInt(value:int, mask:String):String {
return String(mask + value.toString(16)).substr(-mask.length).toUpperCase();
}
private function rChannel(value:int):int {
return value >> 16 & 0xFF;
}
private function gChannel(value:int):int {
return value >> 8 & 0xFF;
}
private function bChannel(value:int):int {
return value >> 0 & 0xFF;
}
private function rgbToInt(r:int, g:int, b:int):int {
return r << 16 | g << 8 | b << 0;
}
]]>
</mx:Script>
<mx:Model id="colorObj">
<root>
<color>{colorPicker.selectedColor}</color>
<red>{rChannel(colorObj.color)}</red>
<green>{gChannel(colorObj.color)}</green>
<blue>{bChannel(colorObj.color)}</blue>
</root>
</mx:Model>
<mx:Form>
<mx:FormItem label="Color:" direction="horizontal">
<mx:ColorPicker id="colorPicker" />
<mx:Label text="0x{fixedInt(colorPicker.selectedColor, '000000')}" width="100" />
</mx:FormItem>
<mx:FormItem label="Red:" direction="horizontal">
<mx:Label text="{colorObj.red}" />
<mx:Label text="(0x{fixedInt(colorObj.red, '00')})" />
</mx:FormItem>
<mx:FormItem label="Green:" direction="horizontal">
<mx:Label text="{colorObj.green}" />
<mx:Label text="(0x{fixedInt(colorObj.green, '00')})" />
</mx:FormItem>
<mx:FormItem label="Blue:" direction="horizontal">
<mx:Label text="{colorObj.blue}" />
<mx:Label text="(0x{fixedInt(colorObj.blue, '00')})" />
</mx:FormItem>
<mx:FormItem label="Color:" direction="horizontal">
<mx:Label text="{colorObj.color}" />
<mx:Label text="(0x{fixedInt(rgbToInt(colorObj.red, colorObj.green, colorObj.blue), '000000')})" />
</mx:FormItem>
</mx:Form>
<mx:Label text="{int(0xFF00FF)}" />
</mx:Application>
View source is enabled in the following example.
Peter deHaan
Peter deHaan currently works for Adobe on the Flex SDK QA team. While not working on Flex, Flash, and ColdFusion applications, Peter enjoys making up bios and writing in 3rd person. Peter's rarely updated blog can be found at blogs.adobe.com/pdehaan/, actionscriptexamples.com, airexamples.com, and coldfusionexamples.com.
Share
Here are a few more methods:
/* Convert r/g/b values (255,0,255) to a fixed string ('FF00FF'). */ private function rgbToStr(r:int, g:int, b:int):String { return fixedInt(rgbToInt(r, g, b), "000000"); } /* Convert a string ('0xFF00FF') to an integer (16711935). */ private function strToInt(value:String):int { return int(value); } /* Convert a string ('0xFF00FF') to an object containing an 'r', 'g', and 'b' property. */ private function strToRGB(value:String):Object { var temp:int = strToInt(value); return {r:rChannel(temp), g:gChannel(temp), b:bChannel(temp)}; }This is very good example.
Hi,
is there any way to set the selectedColor-property from a value fed in from an XML (=HTTPservice)? Tried with this,
and
but this just keeps me giving an error.
Thanks for your help!
Christoph
Thanks for the example. A very simple way to convert a string color to uint.