views:

3974

answers:

4

I'm trying to create a button that has an image in it and no border - just like the fire fox toolbar buttons before you hover over them and see the full button.

I've tried setting the borderbrush to Transparent, BorderThickness to 0, and also tried BorderBrush={x:NUll} - but you can still see the outline of the button.

Any ideas?

Thanks

A: 

After you assign

BorderBrush = "{x:Null}"

asign

Background="{x:Null}"

It works ;)

full XAML

<Button  Background="{x:Null}" BorderBrush="{x:Null}">Click Here!</Button>
Prashant
Nope, at least in Aero, you still see second thin border around the button...
Tomáš Kafka
did not work for me
Simon
+1  A: 

You may already know that putting your Button inside of a ToolBar gives you this behavior, but if you want something that will work across ALL current themes with any sort of predictability, you'll need to create a new ControlTemplate.

Prashant's solution does not work with a Button not in a toolbar when the Button has focus. It also doesn't work 100% with the default theme in XP -- you can still see faint gray borders when your container Background is white.

micahtan
+2  A: 

Try this

<Button BorderThickness="0"  
    Style="{StaticResource {x:Static ToolBar.ButtonStyleKey}}" >...
Simon
+2  A: 

What you have to do is something like this:

<Button Name="MyFlatImageButton"
        Background="Transparent"
        BorderBrush="Transparent"
        BorderThickness="0" 
        Padding="-4">
   <Image Source="MyImage.png"/>
</Button>

Hope this is what you were looking for.

Edit: Sorry, forgot to mention that if you want to see the button-border when you hover over the image, all you have to do is skip the Padding="-4".

Alfred B. Thordarson