WPF之TextBlock控件实现字体霓虹灯的渐变动画效果

一只毛驴成长记

已于 2024-09-11 10:38:57 修改

阅读量138

点赞数 2

分类专栏： WPF 文章标签： wpf

于 2024-09-11 10:31:43 首次发布

本文链接：https://blog.csdn.net/xl296336767/article/details/142132399

版权

WPF 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

效果图：

实现思路：

TextBlock字体背景添加渐变颜色；

再给字体颜色添加一个动画效果。

写在最后：大佬们，都是收费的，没办法，只好自己研究自己写。记得点赞与收藏哦！！！

实现代码：

<TextBlock Text="HOMS" FontSize="96" Margin="0" FontWeight="ExtraLight"  TextWrapping="Wrap" HorizontalAlignment="Center" TextAlignment="Center">
    <TextBlock.Triggers>
        <EventTrigger RoutedEvent="TextBlock.Loaded">
            <BeginStoryboard>
                <Storyboard RepeatBehavior="Forever">
                    <DoubleAnimation Storyboard.TargetName="LinearGradientBrushTranslate" Storyboard.TargetProperty="X" From="0" To="270" Duration="0:0:2" />
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
    </TextBlock.Triggers>
    <TextBlock.Foreground>
        <LinearGradientBrush SpreadMethod="Repeat" StartPoint="0,0" EndPoint="1,0">
            <LinearGradientBrush.Transform>
                <TranslateTransform x:Name="LinearGradientBrushTranslate"/>
            </LinearGradientBrush.Transform>
            <LinearGradientBrush.GradientStops>
                <GradientStop Offset="0.00" Color="LawnGreen"/>
                <GradientStop Offset="0.25" Color="GreenYellow"/>
                <GradientStop Offset="0.50" Color="Yellow"/>
                <GradientStop Offset="0.75" Color="SkyBlue"/>
                <GradientStop Offset="1.00" Color="DeepSkyBlue"/>
            </LinearGradientBrush.GradientStops>
        </LinearGradientBrush>
    </TextBlock.Foreground>
</TextBlock>