So I’ve been getting pretty fancy with my GUI development, and today I wanted to design a button that would appear as just flat text until you hovered over it with the mouse, at which point it would “pop up” and look like an actual button.
The ‘Flat’ Pop Up Button was achieved by simply setting the background and border to transparent. Here’s the XAML:
<Button Content="Click Me!" Background="Transparent" BorderBrush="Transparent"/>The next step was to make it so that when the mouse hovers over the button it “pops up” visually and looks more like a button. So I tried several methods for accomplishing this using triggers to set the style of the button which were all turning out to be a little ugly since I’m not the best graphical design person.
But luckily I realized that in this case I didn’t have to do anything special at all. I could just leave the button as it is in this state and the baked in triggers for the Button would still kick in and change the appearance when the mouse hovered over the button.
Here’s the what it looks like:
It looks pretty cool in spots where you want a nice button, but if the user isn’t activating you don’t want all those pixels distracting from the clean whiteness that is your polished application.
