需求:实现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>

效果展示

WPF自定义控件二:Border控件与TextBlock控件轮播动画的更多相关文章

  1. WPF自定义控件与样式(5)-Calendar/DatePicker日期控件自定义样式及扩展

    一.前言 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要内容: 日历控 ...

  2. 【转】WPF自定义控件与样式(5)-Calendar/DatePicker日期控件自定义样式及扩展

    一.前言 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等. 本文主要内容: 日历控件Calendar自定义样式: 日期控件DatePicker自定 ...

  3. [WPF自定义控件库]简单的表单布局控件

    1. WPF布局一个表单 <Grid Width="400" HorizontalAlignment="Center" VerticalAlignment ...

  4. WPF自定义控件与样式(7)-列表控件DataGrid与ListView自定义样式

    一.前言 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要内容: Dat ...

  5. WPF自定义控件与样式(8)-ComboBox与自定义多选控件MultComboBox

    一.前言 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要内容: 下拉选 ...

  6. WPF自定义控件与样式(9)-树控件TreeView与菜单Menu-ContextMenu

    一.前言 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要内容: 菜单M ...

  7. WPF自定义控件与样式(10)-进度控件ProcessBar自定义样

    一.前言 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要内容: Pro ...

  8. WPF自定义控件与样式(11)-等待/忙/正在加载状态-控件实现

    一.前言 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要有三种实现方式 ...

  9. Qt编写自定义控件24-图片轮播控件

    一.前言 上一篇文章写的广告轮播控件,采用的传统widget堆积设置样式表做的,这次必须要用到更高级的QPainter来绘制了,这个才是最高效的办法,本控件参考雨田哥的轮播控件,经过大规模的改造而成, ...

随机推荐

  1. 其他:压力测试Jmeter工具使用

    下载路径: http://yd01.siweidaoxiang.com:8070/jmeter_52z.com.zip 配置汉化中文: 找到jmeter的安装目录:打开 \bin\jmeter.pro ...

  2. charles证书导入系统信任区(Android7.0以上)

    打开charles,跟着下图来,下载好charles的证书 后缀是pem的格式,挺方便的了,burp的证书是der的,还需要再进一步转化成pem,这里就不再多说, 利用openssl来计算出文件名 加 ...

  3. mysql binlog恢复数据实战

    在前面,我们了解了mysql binlog日志的作用以及使用方法:  http://www.php20.cn/article/237 在后面讲到了,可以通过binlog进行恢复数据,那么,具体步骤是怎 ...

  4. php安裝7.3版本

    CentOS 安装 EPEL 源: yum install epel-release 安装 REMI 源: CentOS 7: yum install http://rpms.remirepo.net ...

  5. 计算机网络体系结构整理-第九单元移动IP

    第九章 移动IP 什么是移动:移动指的是用户连接位置的改变,而不是设备物理位置的改变 移动可以是离散的或连续的 移动IP的基本要求:1.IP地址不变 2.宿地址路由 3.信息量和交互简化 4.安全 5 ...

  6. 打开设置windows10内置linux功能-启用linux子系统

    第一步设置开发者模式 步骤:windows+s打开娜娜,输入设置,并点击. 点击更新与安全 点击开发者选项,选择开发者模型,弹出的对话框选确定之后等待安装完毕. 第二步:安装linux 点击确定后等待 ...

  7. netcore3.1 + vue (前后端分离) IIS 部署

    1.安装 aspnetcore-runtime-3.1.1-win-x64.exe 2.安装dotnet-hosting-3.1.1-win.exe 3.安装urlrewrite和applicatio ...

  8. 【论文小综】基于外部知识的VQA(视觉问答)

    ​ 我们生活在一个多模态的世界中.视觉的捕捉与理解,知识的学习与感知,语言的交流与表达,诸多方面的信息促进着我们对于世界的认知.作为多模态领域的一个典型场景,VQA旨在结合视觉的信息来回答所提出的问题 ...

  9. python使用笔记26--多线程、多进程

    1.概念 线程.进程 进程是资源的集合,也就是一个程序 线程是一个程序运行的最小单位 线程是在进程里面的 默认,一个进程就只有一个线程 一个电脑有几核CPU就只能同时运行几个任务,比如4核CPU只能同 ...

  10. python使用笔记22--mock接口开发

    1.mock接口开发 mock是模拟一个接口的意思 为了不阻止测试,开发一个接口,返回你想要的数据,模拟各种场景 需要安装第三方模块flask,flask是web轻量级开发框架 1.1 flask p ...