Hello,
I created a StackPanel containing some Buttons in vertical order. The StackPanel has a specific background picture. The Buttons within the StackPanel contain images (PNG) with a symbol and transparent background. If I show the image on the button using the Image element, the background of the image is not made transparent. I can set the "Opacity" attribute of the button to true, but then the whole button becomes transparent, which is not my intention. I already converted the image to gif, but that didn’t work either. Isn’t Xaml able to determine transparency within pictures and to render it correctly or where is my fault
Code:
<StackPanel DockPanel.Dock="Left" Width="116" Height="768">
<StackPanel.Background>
<ImageBrush ImageSource="C:\Workspace\sp_background.png"/>
</StackPanel.Background>
<!-- First button with transparent image-->
<Button Width="80" Height="80">
<Image Source="C:\Workspace\button1.png"/>
</Button>
<!-- Second button with transparent image-->
<Button Width="80" Height="80" Opacity="0.0">
<Image Source="C:\Workspace\button2.png"/>
</Button>
</StackPanel>
Thank you very much,
Benni
Display transparent button image
Hot Topic
- Application.GetRemoteStream() break in RC1
- the filename selected is not recognized as legal.
- Command Line Pin/Unpin, VS 2005 not updating
- Guidelines for WPF Forum
- HyperLink for a number of rows
- Word: Add picture (VSTO2005)
- How to debug a Class
- Custom code snippet functions
- Getting Error when try to publish the exe with XML file.
- CommandBarButton Click event is not raised
Visual Studio
- WCF Client Behind ISA: HTTP Error 407
- Getting Relationship Schema Data from CdmEntityType
- How to turn off anti aliasing for small text?
- Major problem with Crystal Reports
- VirtualizingStackPanel and TreeView
- TreeView and several HierarchicalDataTemplate
- Hosting WPF Designer
- Infinite loop trick
- 3d shape inside 3d shape
- Feature request: Referencing Code Samples
Display transparent button image
Ofir Epstein
We do support alpha in image formats which supply it, such as PNG, so this should work. Note that since you're placing the Image as the Button's content, I'd expect that the PNG will draw - transparency and all - on top of an opaque Button background (the background will be dependent upon your theme). If you want to see through the Button, you may want to experiment with a few things:
Set the Button's Background to "Transparent"
If that doesn't do what you want, set the Button's Background to an ImageBrush of your Pngs, and then don't have any content (you'll need to explicitly size the Buttons)
If that doesn't do what you want, you may need to override the Button's Template to remove all of the default appearance. If you get to this, post back since it's a little more involved.
Let us know what works (or doesn't),
-Adam Smith [MS]
Alpehans
<Button Width="80" Height="80">
<Button.Background>
<SolidColorBrush Color="Gray" Opacity="0.0" />
</Button.Background>
<Image Source="C:\Workspace\button.png"/>
</Button>
Best regards,
Benjamin
mdrelyea
Excellent.
I would also note that there is a difference between a transparent Brush (such as the one you're providing) and a null Brush in that a transparent Brush it hit testable, while a null Brush isn't. So, if you want the entire rectangular area to be hittable, keep what you have. If instead you only want the area covered by the Image Element to be hittable, change the brush to {x:Null}.
-Adam Smith [MS]