Export (0) Print
Expand All
Key
M11
M12
M21
M22
Tag
Uri
X1
X2
Y1
Y2
Expand Minimize

OpacityMask

Silverlight

Gets or sets the brush that is used to alter the opacity of select regions of this object.

<object ...>
  <object.OpacityMask>
    singleBrush
  </object.OpacityMask>
</object>
value = object.OpacityMask
object.OpacityMask = value

Value

Description

singleBrush

Exactly one object element for an object that derives from Brush. This can be one of the following: <LinearGradientBrush ... />, <RadialGradientBrush ... />, or <ImageBrush ... />.

SolidColorBrush is technically permitted, but you could more easily obtain the same effect with Opacity (UIElement).

VideoBrush is technically permitted, but videos generally do not carry alpha information.

Type: Brush

A Brush that describes the opacity of this object.

This property is read/write. The default value is null.

This property uses the alpha channel value for the supplied Brush. The other channels of the brush content (Red, Green, or Blue) are ignored.

The most typical Brush for this purpose is an ImageBrush, which can be used for a variety of photo masking techniques such as vignettes. However, any defined Brush (such as LinearGradientBrush) can be used. All brushes require a Brush-derived object element to fill property element syntax in XAML, as shown in the XAML syntax earlier in this topic.

The following example creates a RadialGradientBrush with three gradient stops in the implicit GradientStopCollection. The three gradient stops specify a brush with a varying transparency, which is then applied as the OpacityMask for an Image.

<Canvas  
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> 

  <Image Source="sampleImages/forest.jpg" Height="100">
    <Image.OpacityMask>
      <RadialGradientBrush Center="0.5,0.5">
        <!-- This gradient stop is partially transparent. -->
        <GradientStop Color="#00000000" Offset="1" />
        <!-- This gradient stop is partially transparent. -->
        <GradientStop Color="#20000000" Offset="0.8" />
        <!-- This gradient stop is fully opaque. -->
        <GradientStop Color="#FF000000" Offset="0" />
      </RadialGradientBrush>
    </Image.OpacityMask>
  </Image> 
</Canvas>

The following illustration shows the rendered result of the preceding code.

RadialGradientBrush applied to OpacityMask of an image

Image with an OpacityMask applied to it.

Community Additions

ADD
Show:
© 2014 Microsoft