Search for code snippets directly inside of Flex Builder with Blueprint. Download Blueprint.
-
http://blog.flexexamples.com/category/halo/button/
The following example shows how you can set the fill colors on a Halo Button control (with default Spark skin) in Flex 4 by creating a custom skin and setting the gradient colors in the fill layer:
<!-- layer 2: fill --> <s :Rect left="1" right="1" top="1" bottom="1" radiusX="2" radiusY="2"> </s><s :fill> </s><s :LinearGradient rotation="90"> <s :GradientEntry color="red" color.overStates="haloGreen" alpha="0.85" alpha.selectedOver="1" /> <s :GradientEntry color="haloOrange" color.overStates="haloBlue" alpha="0.85" alpha.selectedOver="1" /> </s>
-
http://cookbooks.adobe.com/post_Applying_custom_images_to_Buttons-282.html
The solution below results in a button that uses custom images as the button’s background for its various states. In this case we are setting the upSkin, overSkin, downSkin, and disabledSkin directly on the Button instance.
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="horizontal" backgroundColor="#FFFFFF"> <mx:Button label="" upSkin="@Embed('images/text_button_up.png')" overSkin="@Embed('images/text_button_over.png')" downSkin="@Embed('images/text_button_down.png')" disabledSkin="@Embed('images/text_button_disabled.png')" /> </mx:Application>
-
http://cookbooks.adobe.com/post_Applying_custom_images_to_Buttons-282.html
If you would like Flex to display a text label on your custom button, and you’d like the button images to scale to accommodate label text of varying length, you can include scale grid information in your skin attribute values. The scale grid values you use will depend on the size and design of your button images. Below is one example. Note, in this example we’re setting the skin attributes in a CSS style definition and then applying that style to multiple Button instances via the styleName attribute. Also note that when we use the Embed directive in a CSS declaration no " @ " is used.
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="horizontal" backgroundColor="#FFFFFF"> <mx:Style> .customButton { color: #FFFFFF; text-roll-over-color: #FFFFBB; text-selected-color: #9999FF; disabled-color: #333333; up-skin: Embed( source="images/button_up.png", scaleGridTop="15", scaleGridBottom="20", scaleGridLeft="15", scaleGridRight="28"); over-skin: Embed( source="images/button_over.png", scaleGridTop="15", scaleGridBottom="20", scaleGridLeft="15", scaleGridRight="28"); down-skin: Embed( source="images/button_down.png", scaleGridTop="15", scaleGridBottom="20", scaleGridLeft="15", scaleGridRight="28"); disabled-skin: Embed( source="images/button_disabled.png", scaleGridTop="15", scaleGridBottom="20", scaleGridLeft="15", scaleGridRight="28"); } </mx:Style> <mx:Button label="This button is enabled" styleName="customButton" /> <mx:Button label="This button is disabled" styleName="customButton" enabled="false" /> </mx:Application>
-
http://www.asfusion.com/blog/entry/stateful-skins-in-flex-3e-color-transitions-in-buttons-now-possible
Sexy Button As an example, to create this button, I would have this code in my application:
height= "200" > <mx:Style source= "assets/styles/Main.css" /> <mx:Button label= "Sexy Flex Button" x= "50" y= "50" /> </mx:Application> -
http://www.asfusion.com/blog/entry/stateful-skins-in-flex-3e-color-transitions-in-buttons-now-possible
The code of the ButtonSkin is the following:
import mx.controls.Button; import mx.core.UITextField; use namespace mx_internal;
- « Previous results
- Next results »
