WPF自定义控件二:Border控件与TextBlock控件轮播动画

需求:实现Border轮播动画与TextBlock动画

XAML代码如下:

 <Window.Resources>
        <Storyboard x:Key="OnLoaded1" RepeatBehavior="Forever">
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.BorderBrush).(Brush.RelativeTransform).(TransformGroup.Children)[0].(RotateTransform.Angle)" Storyboard.TargetName="border">
                <EasingDoubleKeyFrame KeyTime="0:0:2" Value="360"/>
            </DoubleAnimationUsingKeyFrames>
        </Storyboard>
        <Storyboard x:Key="OnloadText" RepeatBehavior="Forever">
            <DoubleAnimation  From="-2" To="2" Duration="0:0:3"  Storyboard.TargetProperty="(TextBlock.Foreground).(Brush.RelativeTransform).(TransformGroup.Children)[0].(TranslateTransform.X)" Storyboard.TargetName="border1">
            </DoubleAnimation>
            <DoubleAnimation  From="2" To="-2" BeginTime="0:0:3" Duration="0:0:3" Storyboard.TargetProperty="(TextBlock.Foreground).(Brush.RelativeTransform).(TransformGroup.Children)[0].(TranslateTransform.X)"  Storyboard.TargetName="border1"></DoubleAnimation>
        </Storyboard>
        <LinearGradientBrush x:Key="dddd" EndPoint="0.5,1" StartPoint="0.5,0">
            <LinearGradientBrush.RelativeTransform>
                <TransformGroup>
                    <RotateTransform Angle="0" CenterX="0.5" CenterY="0.5"/>
                </TransformGroup>
            </LinearGradientBrush.RelativeTransform>
            <GradientStop Color="#11374c" Offset="0.2"/>
            <GradientStop Color="White" Offset="4"/>
        </LinearGradientBrush>
        <LinearGradientBrush  x:Key="eeee" StartPoint="0,0" EndPoint="1,0.001">
            <LinearGradientBrush.RelativeTransform>
                <TransformGroup>
                    <TranslateTransform X="-0.5" ></TranslateTransform>
                </TransformGroup>
            </LinearGradientBrush.RelativeTransform>
            <LinearGradientBrush.GradientStops>
                <GradientStopCollection>
                    <GradientStop Color="White" Offset="0.0"></GradientStop>
                    <GradientStop Color="LightBlue" Offset="0"></GradientStop>
                    <GradientStop Color="#11374c" Offset="1"></GradientStop>
                </GradientStopCollection>
            </LinearGradientBrush.GradientStops>
        </LinearGradientBrush>
    </Window.Resources>
    <Window.Triggers>
        <EventTrigger RoutedEvent="FrameworkElement.Loaded">
            <BeginStoryboard Storyboard="{StaticResource OnLoaded1}"/>
            <BeginStoryboard Storyboard="{StaticResource OnloadText}"/>
        </EventTrigger>
    </Window.Triggers>
    <Grid Background="Black">
        <TextBlock x:Name="border1" Foreground="{StaticResource eeee}" Text="Hymson" Width="130"  Height="55" FontSize="42"  FontFamily="宋体" FontWeight="Black" />
        <Border x:Name="border" Width="200" Height="60" BorderBrush="{StaticResource dddd}" BorderThickness="2" CornerRadius="5">
        </Border>
    </Grid>

效果展示

原文地址:https://www.cnblogs.com/zt199510/p/14037492.html