Image as An Button

There isn't an automatic way to create all the states that a button has from an image but it's not difficult to do manually. Just select you image and open the States panel. Then add the following states you want, e.g. Hover, Down, Selected, Disabled, Visited, etc. (these are built in). Next alter you image for each state as desired. It's pretty simple actually.

Hello AHme,

To get the same states as a normal button you can use the wonderful option: FORMAT PAINTER. In my example I added a button to my screen where I placed my image. 

Steps:

1. Select the button
2. Under HOME, click on Format Painter
   
3. Click on the image

Now you can select STATES (next to TIMELINE) and see that your image now has the same states as your button. 

Of course, you will want to change the way each state is visually presented. To do so, use the EDIT STATES option, select a state and format the image until you are satisfied with the result.

Greetings,

Thanks guys,

Actually my issue is I have a triggers under button and I just need to replace Image with the button exactly... so don't not need to write triggers again:)

Hi AHme,

You can copy and paste triggers as described here. 

I have a custom button image I designed in PowerPoint.  I created 5 versions of the button image, one for each Storyline button state.  I copied them over to a Storyline slide. I've also save each image as a .png file. How do I get each of the states in Storyline to show the corresponding image version? 

Or in simpler terms, how can I get each state of a button to use a different image?

Thank you,

John

HI John

if you add the image to your slide - this will be the normal state.  Highlight the image, click the states tab > edit states and create a new state called 'hover', right click format shape and then fill use 'picture' navigate to the image you want. Rinse and repeat for the other states you want to create.

HI John

if you create a button and then right click format shape on the normal state and picture fill - this will change the normal state and all other states to the image. Then go into the states tab > edit states click on the  'hover', right click format shape and then fill use 'picture' navigate to the image you want. Rinse and repeat for the other states you want to create.

See quick sample attached.

Thank you, Wendy!

5 years later I know....but this is hugely helpful - will save me a massive amount of time thank you.

So glad that you found this beneficial as well, Matthew. 

Welcome to E-Learning Heroes!