Change Button Image On Hover or Click

Question

How do I change the background image of a Button on Hover and on Click? The Visual Studio\'s UI does not seem to provide any easy way of doing it. Currently the default beha

Answer 1

You're pretty much there. You can always apply a semi-transparent colour on top of your picture below your text/content but since you asked for changing the entire image, here's what you can do:

In Visual Studio 2012, if you already have a button mostly styled/configured to what you want, right click it, Edit Template -> Edit a Copy. Choose where you want to put the new style/template. It's like picking where to put the CSS. Could be in a global file (App.xaml or StandardStyle.xaml) or in the header (page resources) or inline (control resources).

The below XAML might be over-simplified and not work but it's the idea of it:

    
        
            
                
                
                    
                        
                            
                        
                    
                
                
                    
                        
                            
                        
                    
                
                [...]
            
            
                [...]
            
        
        
            
                
                
                
                
            
        
        [...]
    

Now you can place your 3 images in the 3 tags and since the ContentPresenter is on top, when you use the template with , you can still put content in and it will appear on top of your background image. Or you can just have a fully graphical button with the images too.