UIElement.Opacity Property

Microsoft Silverlight will reach end of support after October 2021. Learn more.

Gets or sets the degree of the object's opacity.

Namespace:  System.Windows
Assembly:  System.Windows (in System.Windows.dll)

Syntax

'Declaration
Public Property Opacity As Double
public double Opacity { get; set; }
<uiElement Opacity="double" .../>

Property Value

Type: System.Double
A value between 0 and 1.0 that declares the opacity factor, with 1.0 meaning full opacity and 0 meaning transparent. The default value is 1.0.

Remarks

Dependency property identifier field: OpacityProperty

An Opacity value of 0 does not exclude an object from hit testing. This behavior can be useful for creating imagemap-style overlays of Canvas, Rectangle or other shapes to capture hits on objects that exist at z-orders greater than other visible objects underneath. In order to exclude an object from hit testing, you should set IsHitTestVisible to false.

When Opacity is set on objects that are nested, the effective opacity is the product of all applicable opacity factors. For instance, if an object that has Opacity=0.5 is contained in a Canvas that is also Opacity=0.5, the effective Opacity value is 0.25.

Opacity values greater than 1.0 are treated as 1.0 when the value is used, although obtaining the property value will still give you the original greater-than-one value. Opacity values less than 0 are treated as 0 when the value is used. For instance, setting an Opacity to 2 to cancel out the effects of being contained by an object with 0.5 Opacity does not work; the 2 value is treated as 1.0 even before the nested-object factoring is calculated.

The following illustration shows a TextBlock displayed as a windowless plug-in on a Microsoft Virtual Earth mash-up. The Background value of the plug-in is #00000000, which is totally transparent. In addition, the Opacity of the TextBlock is set to 0.7, which allows the map underneath to partially show through the text.

TextBlock with partial opacity

Sample output

Examples

The following XAML sets Opacity to 0 on a MediaElement. The scenario here is that the MediaElement is used as a source for a VideoBrush, rather than an intentional part of the UI. In addition to being painted invisible as an element, the MediaElement should not be active for input events (so sets IsHitTestVisible to false).

<Grid x:Name="LayoutRoot" Background="White">
  <Grid.ColumnDefinitions>
    <ColumnDefinition Width="*" />
    <ColumnDefinition Width="*" />
    <ColumnDefinition Width="*"/>
  </Grid.ColumnDefinitions>
  <Grid.RowDefinitions>
    <RowDefinition Height="Auto" />
    <RowDefinition Height="*" />
  </Grid.RowDefinitions>

  <MediaElement 
    x:Name="butterflyMediaElement" 
    Source="Butterfly.wmv" IsMuted="True"
    Opacity="0.0" IsHitTestVisible="False" />

  <TextBlock Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="3"  
    FontFamily="Verdana" FontSize="120" 
    FontWeight="Bold" TextWrapping="Wrap"
    Text="Video">

    <!-- Paint the text with video. -->
    <TextBlock.Foreground>
      <VideoBrush SourceName="butterflyMediaElement" Stretch="UniformToFill" />
    </TextBlock.Foreground>
  </TextBlock>

  <!-- Play -->
  <Button Click="PlayMedia" Grid.Row="1" Grid.Column="0" 
    Width="120" Height="20" Content="Play" />

  <!-- Pause -->
  <Button Click="PauseMedia" Grid.Row="1" Grid.Column="1" 
    Width="120" Height="20" Content="Pause" />

  <!-- Stop -->
    <Button Click="StopMedia" Grid.Row="1" Grid.Column="2" 
      Width="120" Height="20" Content="Stop" />

</Grid>

Version Information

Silverlight

Supported in: 5, 4, 3

Silverlight for Windows Phone

Supported in: Windows Phone OS 7.1, Windows Phone OS 7.0

Platforms

For a list of the operating systems and browsers that are supported by Silverlight, see Supported Operating Systems and Browsers.