Comment : rendre un UIElement transparent ou semi-transparent

Cet exemple montre comment créer un UIElement transparent ou semi-transparent. Pour rendre un élément transparent ou semi-transparent, vous définissez sa Opacity propriété. Une valeur de 0.0 rend l’élément complètement transparent, tandis qu’une valeur de 1.0 rend l’élément complètement opaque. La valeur de l’élément 0.5 est 50 % opaque, et ainsi de suite. L’élément Opacity est défini 1.0 par défaut.

Exemple

L’exemple suivant définit le Opacity bouton sur 0.25, le rendant ainsi que son contenu (dans ce cas, le texte du bouton) 25 % opaque.

<!-- 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";

Si le contenu d’un élément a ses propres Opacity paramètres, ces valeurs sont multipliées par rapport aux éléments Opacitycontenants.

L’exemple suivant définit la valeur d’un Opacity0.25Image bouton et le Opacity contrôle contenu dans le bouton 0.5sur . Par conséquent, l’image apparaît opaque de 12,5 % : 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;

Une autre façon de contrôler l’opacité d’un élément consiste à définir l’opacité de l’élément Brush qui peint l’élément. Cette approche vous permet de modifier de manière sélective l’opacité des parties d’un élément et offre des avantages en matière de performances sur l’utilisation de la propriété de l’élément Opacity . L’exemple suivant montre comment définir l’élément Opacity0.25Background utilisé SolidColorBrush pour peindre les boutons . Par conséquent, l’arrière-plan du pinceau est opaque de 25 %, mais son contenu (le texte du bouton) reste opaque de 100 %.

<!-- 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";

Vous pouvez également contrôler l’opacité des couleurs individuelles au sein d’un pinceau. Pour plus d’informations sur les couleurs et les pinceaux, consultez Vue d’ensemble de la peinture avec des couleurs unie et des dégradés. Pour obtenir un exemple montrant comment animer l’opacité d’un élément, consultez Animer l’opacité d’un élément ou d’un pinceau.