So geht's: Ein UIElement transparent machen oder Semi-Transparent

In diesem Beispiel wird gezeigt, wie sie ein UIElement transparentes oder semitransparentes Format erstellen. Um ein Element transparent oder semitransparent zu machen, legen Sie dessen Opacity Eigenschaft fest. Ein Wert von 0.0 macht das Element vollständig transparent, während ein Wert von 1.0 das Element komplett undurchsichtig macht. Mit einem Wert 0.5 wird das Element 50% undurchsichtig usw. Ein Element Opacity ist standardmäßig auf 1.0 festgelegt.

Beispiel

Im folgenden Beispiel wird die Opacity Schaltfläche so 0.25festgelegt, dass sie und deren Inhalt (in diesem Fall der Text der Schaltfläche) 25% undurchsichtig sind.

<!-- Both the button and its text are made 25% opaque. -->
<Button Opacity="0.25">A Button</Button>

//
// Both the button and its text are made 25% opaque.
//
Button myTwentyFivePercentOpaqueButton = new Button();
myTwentyFivePercentOpaqueButton.Opacity = new Double();
myTwentyFivePercentOpaqueButton.Opacity = 0.25;
myTwentyFivePercentOpaqueButton.Content = "A Button";

Wenn der Inhalt eines Elements über eigene Opacity Einstellungen verfügt, werden diese Werte mit den enthaltenden Elementen Opacitymultipliziert.

Im folgenden Beispiel wird festgelegt, dass eine Schaltfläche Opacity auf 0.25 gesetzt wird, und dass das Steuerelement Opacity, das der in der Schaltfläche enthalten ist, auf Image gesetzt wird. Daher wird das Bild 12,5% undurchsichtig angezeigt: 0,25 * 0,5 = 0,125.

<!-- The image contained within this button has an effective
     opacity of 0.125 (0.25 * 0.5 = 0.125). -->
<Button Opacity="0.25">
  <StackPanel Orientation="Horizontal">
    <TextBlock VerticalAlignment="Center" Margin="10">A Button</TextBlock>
    <Image Source="sampleImages\berries.jpg" Width="50" Height="50"
      Opacity="0.5"/>
  </StackPanel>
</Button>

//
// The image contained within this button has an
// effective opacity of 0.125 (0.25*0.5 = 0.125);
//
Button myImageButton = new Button();
myImageButton.Opacity = new Double();
myImageButton.Opacity = 0.25;

StackPanel myImageStackPanel = new StackPanel();
myImageStackPanel.Orientation = Orientation.Horizontal;

TextBlock myTextBlock = new TextBlock();
myTextBlock.VerticalAlignment = VerticalAlignment.Center;
myTextBlock.Margin = new Thickness(10);
myTextBlock.Text = "A Button";
myImageStackPanel.Children.Add(myTextBlock);

Image myImage = new Image();
BitmapImage myBitmapImage = new BitmapImage();
myBitmapImage.BeginInit();
myBitmapImage.UriSource = new Uri("sampleImages/berries.jpg",UriKind.Relative);
myBitmapImage.EndInit();
myImage.Source = myBitmapImage;
ImageBrush myImageBrush = new ImageBrush(myBitmapImage);
myImage.Width = 50;
myImage.Height = 50;
myImage.Opacity = 0.5;
myImageStackPanel.Children.Add(myImage);
myImageButton.Content = myImageStackPanel;

Eine weitere Möglichkeit zum Steuern der Deckkraft eines Elements besteht darin, die Deckkraft des Brush festzulegen, das das Element zeichnet. Dieser Ansatz ermöglicht es Ihnen, die Deckkraft von Teilen eines Elements selektiv zu ändern und bietet im Vergleich zur Verwendung der Opacity-Eigenschaft des Elements Leistungsvorteile. Im folgenden Beispiel wird der Opacity einer SolidColorBrush festgelegt, die zum Zeichnen des Background der Schaltfläche verwendet wird, und wird auf 0.25 gesetzt. Daher ist der Hintergrund des Pinsels 25% undurchsichtig, der Inhalt (der Text der Schaltfläche) bleibt jedoch 100% undurchsichtig.

<!-- This button's background is made 25% opaque, but its
     text remains 100% opaque. -->
<Button>
  <Button.Background>
    <SolidColorBrush Color="Gray" Opacity="0.25" />
  </Button.Background>
  A Button
</Button>

//
//  This button's background is made 25% opaque,
// but its text remains 100% opaque.
//
Button myOpaqueTextButton = new Button();
SolidColorBrush mySolidColorBrush = new SolidColorBrush(Colors.Gray);
mySolidColorBrush.Opacity = 0.25;
myOpaqueTextButton.Background = mySolidColorBrush;
myOpaqueTextButton.Content = "A Button";

Sie können auch die Deckkraft einzelner Farben innerhalb eines Pinsels steuern. Weitere Informationen zu Farben und Pinsel finden Sie unter "Painting with Solid Colors and Gradients Overview". Ein Beispiel zum Animieren der Deckkraft eines Elements finden Sie unter Animieren der Deckkraft eines Elements oder Pinsels.