Andy De George
da363692ff
* Reset branch for WPF changes * Convert BMP to PNG; fix link-out-of-scope err * Add snippets for WPF... 6794 files!!!! * Add missing snippets * update file updated between migration * Fix paths to include * update breadcrumb and toc * fix index links * fix index links * fix index links * fix markdown
3.4 KiB
title, ms.date, helpviewer_keywords, ms.assetid
| title | ms.date | helpviewer_keywords | ms.assetid | ||||
|---|---|---|---|---|---|---|---|
| How to: Make a UIElement Transparent or Semi-Transparent | 03/30/2017 |
|
a49fc8d6-7b32-4f28-9122-39b632a19b4b |
How to: Make a UIElement Transparent or Semi-Transparent
This example shows how to make a xref:System.Windows.UIElement transparent or semi-transparent. To make an element transparent or semi-transparent, you set its xref:System.Windows.UIElement.Opacity%2A property. A value of 0.0 makes the element completely transparent, while a value of 1.0 makes the element completely opaque. A value of 0.5 makes the element 50% opaque, and so on. An element's xref:System.Windows.UIElement.Opacity%2A is set to 1.0 by default.
Example
The following example sets the xref:System.Windows.UIElement.Opacity%2A of a button to 0.25, making it and its contents (in this case, the button's text) 25% opaque.
[!code-xamlbrushsamples_snip#2]
[!code-csharpbrushsamples_procedural_snip#2]
If an element's contents have their own xref:System.Windows.UIElement.Opacity%2A settings, those values are multiplied against the containing elements xref:System.Windows.UIElement.Opacity%2A.
The following example sets a button's xref:System.Windows.UIElement.Opacity%2A to 0.25, and the xref:System.Windows.UIElement.Opacity%2A of an xref:System.Windows.Controls.Image control contained with in the button to 0.5. As a result, the image appears 12.5% opaque: 0.25 * 0.5 = 0.125.
[!code-xamlbrushsamples_snip#3]
[!code-csharpbrushsamples_procedural_snip#3]
Another way to control the opacity of an element is to set the opacity of the xref:System.Windows.Media.Brush that paints the element. This approach enables you to selectively alter the opacity of portions of an element, and provides performance benefits over using the element's xref:System.Windows.UIElement.Opacity%2A property. The following example sets the xref:System.Windows.Media.Brush.Opacity%2A of a xref:System.Windows.Media.SolidColorBrush used to paint the button's xref:System.Windows.Controls.Control.Background%2A is set to 0.25. As a result, the brush's background is 25% opaque, but its contents (the button's text) remain 100% opaque.
[!code-xamlbrushsamples_snip#4]
[!code-csharpbrushsamples_procedural_snip#4]
You may also control the opacity of individual colors within a brush. For more information about colors and brushes, see Painting with Solid Colors and Gradients Overview. For an example showing how to animate an element's opacity, see Animate the Opacity of an Element or Brush.