• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 310
  • Last Modified:

Need help in showing different images for a single button in flex3?

Need help in showing different images for a single button in flex3?
t should show different images when the mouse pointer is over the button and out of the button.

Provide me with sample code.
0
alamflex
Asked:
alamflex
  • 5
  • 4
  • 2
1 Solution
 
deepanjandasCommented:
use skinning properties like this:
upSkin="@Embed(source='assets/buttonUp.gif')"
overSkin="@Embed(source='assets/buttonOver.gif')"
downSkin="@Embed(source='assets/buttonDown.gif')"
disabledSkin="@Embed(source='assets/buttonDisabled.gif')"

http://livedocs.adobe.com/flex/3/html/help.html?content=skinning_3.html

Warm Regards
Deepanjan Das
0
 
deepanjandasCommented:
0
 
alamflexAuthor Commented:
Thanks for your reply,
But here i need to apply for Image control not for Button control.
It should show different images when the mouse pointer is over the button and out of the button.
Below is the link which i got but not understanding.
http://stackoverflow.com/questions/5213981/flex-4-change-image-on-mouseover-mouseout-function-fails-when-i-mouseover-quick
If possible provide me some sample code.

Thanks,
Alam.

Thanks,
Alam.
0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 
deepanjandasCommented:
Image control should be simple I guess.
 
//within script tags
[Bindable]
private var imagePath:String = "images/up.jpg";
private function onRollOverOutHandler(event:MouseEvent):void
{
     swicth( event.type ){
          case "MouseEvent.ROLL_OVER":
               imagePath = "images/over.jpg";
               break;
          default:
               imagePath = "images/up.jpg";
               break;
     }
}


//mxml tag
<mx:Image source="images/logout.jpg"  
          left="0"
          top="350"
          source="{imagePath}" />

<mx:Button
      rollOver="onRollOverOutHandler(event)" 
      rollOut="onRollOverOutHandler(event)"
      />

Open in new window


Warm Regards
Deepanjan Das
0
 
alamflexAuthor Commented:
Could you provide me the full source code with images if possible.
I guess this code should show different images when the mouse pointer is over the button and mouse pointer is out of the button.

Thanks,
Alam.
0
 
alamflexAuthor Commented:
In your code for Image tag there is two source code exists. Can you provide me some running example.
0
 
deepanjandasCommented:
sorry for that Alam, thats a typo, remove the first one and use the bindable property.

Warm Regards
Deepanjan Das
0
 
alamflexAuthor Commented:
can you share me your code with necessary changes.
0
 
deepanjandasCommented:
All the code necessary is above at @35719101, please view properly with the change mentioned in @35719305

Warm Regards
Deepanjan Das
0
 
dgofmanCommented:
In Flex 3

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" width="100%" height="100%">
	<mx:Script>
		<![CDATA[
			[Embed(source="Images/box.png")]
			[Bindable] private var defaultImg:Class;
			[Embed(source="Images/rectangle.png")]
			[Bindable] private var overImg:Class;
			
			[Bindable] private var isOver:Boolean = false;
		]]>
	</mx:Script>
	<mx:Image source="{isOver ? overImg : defaultImg}" buttonMode="true" 
			  mouseOver="isOver = true"  mouseOut="isOver = false"/>
	<!-- OR -->
	<mx:Image source="{defaultImg}" buttonMode="true" 
			  mouseOver="event.currentTarget.source = overImg"  mouseOut="event.currentTarget.source = defaultImg"/>
</mx:Application>

Open in new window

0
 
dgofmanCommented:
Are you still waiting an answer?
0

Featured Post

Prep for the ITIL® Foundation Certification Exam

December’s Course of the Month is now available! Enroll to learn ITIL® Foundation best practices for delivering IT services effectively and efficiently.

  • 5
  • 4
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now