Reader Level:

Brushes with Opacity Mask in WPF

By Raj Kumar Beniwal on Aug 28, 2008
In this sample i will describe how to use Brushes with Opacity Mask in WPF(Windows Presentation Foundation).
  • 0
  • 0
  • 36982
Download Files:

This articles describes that how to use brushes as Opacity Mask in WPF. All drawing group have Opacity property that affects the entire object evenly they also have an OpacityMask that can be used to apply custom opacity effects. 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. 

<Window x:Class="WpfApplication7.Window1"



    Title="LinearGradientBrush with OpacityMask" Height="300" Width="300">



            <GradientStop Offset="0" Color="Red"></GradientStop>

            <GradientStop Offset="1" Color="Green"></GradientStop>



    <Button Margin="40" FontSize="80">RAJ


            <LinearGradientBrush EndPoint="0.1,0.1" SpreadMethod="Reflect">

                <GradientStop Offset="0" Color="Gray"></GradientStop>

                <GradientStop Offset="1" Color="Transparent"></GradientStop>






Output looks like this:

Figure 1. A Button with LinearGradientBrush applied to OpacityMask

<Window x:Class="WpfApplication7.Window2"



    Title="Window2" Height="300" Width="300">


        <Image Source="ais245a.jpg" Height="200">


                <RadialGradientBrush Center="0.5,0.5">

                    <GradientStop Color="#00000000" Offset="1" />

                    <GradientStop Color="#20000000" Offset="0.8" />

                    <GradientStop Color="#FF000000" Offset="0" />







Figure 2. RadialGradientBrush applied to OpacityMask of an image

Raj Kumar Beniwal

Raj Kumar Beniwal is two time Microsoft MVP(Client App Dev) and four time C# Corner MVP,  working as project manager with lots of hands on experience using ASP.NET 2.0/3.5, AJAX, MVC, C#, Visual Basic .NET, SQL Serv... Read more