Практическое руководство. Анимация прозрачности элемента или кисти

Чтобы сделать это элемент платформы исчезновения и появления, можно анимировать его Opacity можно анимировать свойство или вы Opacity свойство Brush (или кисти) используется для рисования. Анимация прозрачности элемента делает его исчезновения и появления его дочерних элементов, но анимация кисть, которая используется для рисования элемента дает возможность более точного Плавное какая часть элемента. Например можно анимировать непрозрачность кисти, используемый для рисования фона кнопки. Это приведет к фона кнопки для и исчезновения представления, оставив его текст полной непрозрачности.

Note

Анимация Opacity из Brush дает выигрыш в производительности, чем анимация Opacity свойства элемента.

В следующем примере две кнопки, применяется анимация, таким образом, чтобы они исчезновения и появления. Непрозрачность первый Button анимируется от 1.0 для 0.0 через Duration 5 секунд. Вторая кнопка также анимируется, но непрозрачность SolidColorBrush используется для закрашивания его Background анимируется вместо того, чтобы вся кнопка прозрачность. При выполнении примера первая кнопка полностью исчезает и появляется, хотя исчезает и появляется только фон второй кнопки. Текст и границы остаются полностью непрозрачными.

Пример

<!-- OpacityAnimationExample.xaml
     This example shows how to animate the opacity of objects, 
     making them fade in and out of view. -->
<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  WindowTitle="Opacity Animation Example" Background="White">
  <StackPanel Margin="20">

    <!-- Clicking this button animates its opacity. -->
    <Button Name="opacityAnimatedButton">
      A Button
      <Button.Triggers>
        <EventTrigger RoutedEvent="Button.Click">
          <BeginStoryboard>
            <Storyboard>
              <DoubleAnimation 
                Storyboard.TargetName="opacityAnimatedButton"
                Storyboard.TargetProperty="(Button.Opacity)" 
                From="1" To="0" Duration="0:0:5" AutoReverse="True"  /> 
            </Storyboard>
          </BeginStoryboard>
        </EventTrigger>
      </Button.Triggers>
    </Button>

    <!-- Clicking this button animates the opacity of the brush
         used to paint its background. -->
    <Button>
      A Button
      <Button.Background>
        <SolidColorBrush x:Name="MyAnimatedBrush" Color="Orange" />
      </Button.Background>
      <Button.Triggers>
        <EventTrigger RoutedEvent="Button.Click">
          <BeginStoryboard>
            <Storyboard>
              <DoubleAnimation 
                Storyboard.TargetName="MyAnimatedBrush"
                Storyboard.TargetProperty="(Brush.Opacity)" 
                From="1" To="0" Duration="0:0:5" AutoReverse="True"  />  
            </Storyboard>
          </BeginStoryboard>
        </EventTrigger>
      </Button.Triggers>         
    </Button>
  </StackPanel>
</Page>

В этом примере отсутствует код. Полный пример также показано, как анимация прозрачности Color в LinearGradientBrush. Полный пример см. в разделе Анимация прозрачности элемента-пример.