Flex Examples » downIcon http://blog.flexexamples.com Just a bunch of Adobe Flex Examples Wed, 26 Jan 2011 18:09:51 +0000 en hourly 1 Setting a custom icon on the MX Button control in Flex http://blog.flexexamples.com/2010/11/08/setting-a-custom-icon-on-the-mx-button-control-in-flex/ http://blog.flexexamples.com/2010/11/08/setting-a-custom-icon-on-the-mx-button-control-in-flex/#comments Mon, 08 Nov 2010 20:27:35 +0000 Peter deHaan http://blog.flexexamples.com/?p=3427 The following example shows how you can use the MX TitleWindow container’s close button for an MX Button control icon and skin by setting the skinClass style.

<?xml version="1.0" encoding="utf-8"?> <!-- http://blog.flexexamples.com/2010/11/08/setting-a-custom-icon-on-the-mx-button-control-in-flex/ --> <mx:Application name="MX_Button_upIcon_test" xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" verticalAlign="middle" backgroundColor="white">   <mx:Style> .titleWindowIconAsIcon { upIcon: Embed("Assets.swf#CloseButtonUp"); overIcon: Embed("Assets.swf#CloseButtonOver"); downIcon: Embed("Assets.swf#CloseButtonDown"); disabledIcon: Embed("Assets.swf#CloseButtonDisabled"); }   .titleWindowIconAsSkin [...]]]> The following example shows how you can use the MX TitleWindow container’s close button for an MX Button control icon and skin by setting the skinClass style.

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2010/11/08/setting-a-custom-icon-on-the-mx-button-control-in-flex/ -->
<mx:Application name="MX_Button_upIcon_test"
        xmlns:mx="http://www.adobe.com/2006/mxml"
        layout="vertical"
        verticalAlign="middle"
        backgroundColor="white">
 
    <mx:Style>
        .titleWindowIconAsIcon {
            upIcon: Embed("Assets.swf#CloseButtonUp");
            overIcon: Embed("Assets.swf#CloseButtonOver");
            downIcon: Embed("Assets.swf#CloseButtonDown");
            disabledIcon: Embed("Assets.swf#CloseButtonDisabled");
        }
 
        .titleWindowIconAsSkin {
            upSkin: Embed("Assets.swf#CloseButtonUp");
            overSkin: Embed("Assets.swf#CloseButtonOver");
            downSkin: Embed("Assets.swf#CloseButtonDown");
            disabledSkin: Embed("Assets.swf#CloseButtonDisabled");
        }
    </mx:Style>
 
    <mx:Button styleName="titleWindowIconAsIcon" label="Button" />
    <mx:Button styleName="titleWindowIconAsSkin" />
 
</mx:Application>
 
]]> http://blog.flexexamples.com/2010/11/08/setting-a-custom-icon-on-the-mx-button-control-in-flex/feed/ 1 Adding your own custom CheckBox control icons in Flex http://blog.flexexamples.com/2007/09/29/adding-your-own-custom-checkbox-control-icons-in-flex/ http://blog.flexexamples.com/2007/09/29/adding-your-own-custom-checkbox-control-icons-in-flex/#comments Sun, 30 Sep 2007 03:53:23 +0000 Peter deHaan http://blog.flexexamples.com/2007/09/29/adding-your-own-custom-checkbox-control-icons-in-flex/ The following example shows how you can override the default icon in the Adobe Flex CheckBox control and replace it with a custom embedded graphic.

Full code after the jump.

View MXML

<?xml version="1.0" encoding="utf-8"?> <!-- http://blog.flexexamples.com/2007/09/29/adding-your-own-custom-checkbox-control-icons-in-flex/ --> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" verticalAlign="middle" backgroundColor="white"> <mx:Style> CheckBox { /* Unselected icons */ upIcon: Embed(source="assets/bullet_red.png"); [...]]]> The following example shows how you can override the default icon in the Adobe Flex CheckBox control and replace it with a custom embedded graphic.

Full code after the jump.

View MXML

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2007/09/29/adding-your-own-custom-checkbox-control-icons-in-flex/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
        layout="vertical"
        verticalAlign="middle"
        backgroundColor="white">

    <mx:Style>
        CheckBox {
            /* Unselected icons */
            upIcon: Embed(source="assets/bullet_red.png");
            overIcon: Embed(source="assets/bullet_red.png");
            downIcon: Embed(source="assets/bullet_yellow.png");
            /* Selected icons */
            selectedUpIcon: Embed(source="assets/bullet_green.png");
            selectedOverIcon: Embed(source="assets/bullet_green.png");
            selectedDownIcon: Embed(source="assets/bullet_yellow.png");
        }
    </mx:Style>

    <mx:CheckBox id="cheezburger"
            label="I can has cheezburger?"
            fontSize="12"
            fontWeight="bold" />

</mx:Application>

View source is enabled in the following example.

 
]]> http://blog.flexexamples.com/2007/09/29/adding-your-own-custom-checkbox-control-icons-in-flex/feed/ 5