Skip navigation
Currently Being Moderated

Button With Icon

May 25, 2010 4:33 AM

                        How to create a button with icon, the icon class should be a url like ("assets/Button.png") according to the url want change the image,

 

[Bindable]

private var _url:String="";

public function set url(value:String):void{

_url=value;

}

public function get url():String{

return _url;

}

 

var butt:Button=new Button();

but.label="my Button";

but.setStyle("icon",url) ----------------------- is it possible... Thanks in advance...,

 
Replies
  • Currently Being Moderated
    May 25, 2010 6:18 AM   in reply to vasanthmss

    Yes it's quite possible....Have you checked it..?

     

     

    Thanks,

    Bhasker Chari

     
    |
    Mark as:
  • Currently Being Moderated
    May 25, 2010 6:59 AM   in reply to vasanthmss

    Yes sure...Use the below code...

     

    <?xml version="1.0" encoding="utf-8"?>
    <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="setButtonIcon();">
        <mx:Script>
            <![CDATA[
                import mx.controls.Button;
       
                [Embed(source='assets/Button.png')]
                private var _icon:Class;
                       
                private function setButtonIcon():void
                {
                    var butt:Button = new Button();
                    butt.label="my Button";
                    butt.setStyle("icon",_icon)
                    addChild(butt);
                }
            ]]>
        </mx:Script>
       
    </mx:Application>

     


    If this post answers your question or helps, please kindly mark it as such.

     


    Thanks,

     

    Bhasker Chari

     
    |
    Mark as:
  • Currently Being Moderated
    May 25, 2010 10:18 PM   in reply to vasanthmss

    Hi ,

     

    You cannot dynamically assign the button icon using the url ...but you can change the icon dyncamically provided your all the urls images should be statically embedded in the application and you can change the icons by using the setStyle method dynamically....But to change the icons without embedding the images statically its not possible to change them. So inorder to change the button icons you need to first dynamically embed the images using a class variable and assign them at run time as shown below.

     

    <?xml version="1.0" encoding="utf-8"?>

    <mx:Application

     

     

    xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">

     

     

    <mx:Script>

    <![CDATA[

     

     

    import mx.controls.Button;

     

    [

    Embed(source='assets/icon0.jpg')]

     

    private var icon0:Class;

     

    [

    Embed(source='assets/icon1.png')]

     

    private var icon1:Class;

     

    [

    Embed(source='assets/icon2.jpg')]

     

    private var icon2:Class;

     

    [

    Embed(source='assets/icon3.jpg')]

     

    private var icon3:Class;

     

     

    private function updateIcon():void

    {

     

     

    var iconNum:int = Math.round(Math.random() * 3);

    butt.setStyle(

    "icon", this["icon" + iconNum]);

    }

    ]]>

     

    </mx:Script>

     

     

     

    <mx:Button id="butt" top="100" left="100" icon="@Embed(source='assets/icon0.jpg')" label="My Button" click="updateIcon();"/>

    </mx:Application>

     

    If this post answers your question or helps, please kindly mark it as such.

     

    Thanks,

    Bhasker Chari

     
    |
    Mark as:
  • Currently Being Moderated
    May 25, 2010 10:47 PM   in reply to vasanthmss

    As I said its not possible to dynamically assign the url to change the button icon unless and until the images are embedded into the application.

     

     

    Thanks,

     
    |
    Mark as:
  • Currently Being Moderated
    May 25, 2010 10:57 PM   in reply to vasanthmss

    Yes its possible with images but I am not sure that we can do it with icons as we

    ll...may be if possible give it  a try and let me know if it works.....:)

     

     

    Thanks,

    Bhasker Chari

     
    |
    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points