今天有人问我想实现一个流光效果。我简单的录了一下他想实现效果的GIF。

实际效果如下:因为今天有事情,只是大概实现了一个效果。主要使用PointAnimationUsingKeyFrames动画效果来实现。以后有空了会写一些更好看的。

代码如下:

<Window x:Class="StreamerEffect.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:StreamerEffect"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<Window.Resources> <Storyboard x:Key="Storyboard1" RepeatBehavior="Forever">
<PointAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Stroke).(LinearGradientBrush.StartPoint)"
Storyboard.TargetName="rectangle">
<EasingPointKeyFrame KeyTime="0:0:0.5" Value="0.855,0.148"/>
<EasingPointKeyFrame KeyTime="0:0:1" Value="0.852,0.855"/>
<EasingPointKeyFrame KeyTime="0:0:1.5" Value="0.148,0.855"/>
<EasingPointKeyFrame KeyTime="0:0:2" Value="0.144,0.149"/>
<EasingPointKeyFrame KeyTime="0:0:2.5" Value="0,0"/> </PointAnimationUsingKeyFrames>
<PointAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Stroke).(LinearGradientBrush.EndPoint)"
Storyboard.TargetName="rectangle">
<EasingPointKeyFrame KeyTime="0:0:0.5" Value="0.145,0.852"/>
<EasingPointKeyFrame KeyTime="0:0:1" Value="0.148,0.145"/>
<EasingPointKeyFrame KeyTime="0:0:1.5" Value="0.852,0.145"/>
<EasingPointKeyFrame KeyTime="0:0:2" Value="0.856,0.851"/>
<EasingPointKeyFrame KeyTime="0:0:2.5" Value="0,1"/> </PointAnimationUsingKeyFrames>
</Storyboard>
</Window.Resources>
<Window.Triggers>
<EventTrigger RoutedEvent="FrameworkElement.Loaded">
<BeginStoryboard Storyboard="{StaticResource Storyboard1}"/>
</EventTrigger>
</Window.Triggers>
<Grid>
<Rectangle x:Name="rectangle" Width="100" Height="100"
StrokeThickness="3">
<Rectangle.Stroke>
<LinearGradientBrush Opacity="0.6">
<GradientStop Color="Transparent" Offset="0"/>
<GradientStop Color="Violet" Offset="1"/>
</LinearGradientBrush>
</Rectangle.Stroke> </Rectangle>
</Grid>
</Window>

WPF特效:流光动画效果的更多相关文章

  1. WPF特效-粒子动画

    原文:WPF特效-粒子动画 WPF实现泡泡龙小游戏效果.     /// -Ball to Ball Collision - Detection and Handling    /// http:// ...

  2. WPF 有趣的动画效果

    WPF 有趣的动画效果         这一次我要呈上一个简单的文章,关于给你的WPF apps加入美丽的光线动画,可是我对动画这东西可能有点入迷了.         实际上.我对动画如此的入迷,以至 ...

  3. WPF 画线动画效果实现

    原文:WPF 画线动画效果实现 弄了将近三天才搞定的,真是艰辛的实现. 看了很多博客,都太高深了,而且想要实现的功能都太强大了,结果基础部分一直实现不了,郁闷啊~ 千辛万苦终于找到了一个Demo,打开 ...

  4. 【WPF】两则动画效果

    原文:[WPF]两则动画效果 引言 利用WPF的动画可以轻而易举的实现各种各样的特效,如擦除,滑动进入等,先看两个效果图 第一个效果 这个动画其实利用了OpacityMask和LinearGradie ...

  5. WPF特效-鱼游动动画3

    原文:WPF特效-鱼游动动画3 WPF不支持骨骼,故使用3DMax导出了序列模型文件(.mtl;.obj). 方法1: 使用Blend 2013打开所有obj文件,拖动排列一下即可在usercontr ...

  6. WPF特效-鱼游动动画

    原文:WPF特效-鱼游动动画   实现思路:           通过VisualBrush Binding方式获取鱼局部图像,在Viewport3D中创建ModelVisual3D块并把获取到的局部 ...

  7. WPF特效-鱼游动动画2

    原文:WPF特效-鱼游动动画2           纯代码撸动画实践2:           原图:(png格式)                                            ...

  8. 用CSS3动画特效实现弹窗效果

    提示:如果大家觉得本篇实现的弹窗效果有用,可持续关注.接下会添加更多效果并且封装成插件,这样使用就方便了.效果查看: https://heavis.github.io/hidialog/index.h ...

  9. jQuery 特效:盒子破碎和移动动画效果

    今天,我们将创建一个使用 jQuery 制作的非常甜蜜的动画效果.我们的想法是在网站的顶部有小盒子,当一个菜单项被点击时,箱子动画形成的主要内容区域分散在各处.我们会用一些不同的动画效果,我们将为菜单 ...

随机推荐

  1. 开源月刊《HelloGitHub》第 62 期

    兴趣是最好的老师,HelloGitHub 让你对编程感兴趣! 简介 分享 GitHub 上有趣.入门级的开源项目. 这里有实战项目.入门教程.黑科技.开源书籍.大厂开源项目等,涵盖多种编程语言 Pyt ...

  2. TODO不实现会报错

    kotlin.NotImplementedError: An operation is not implemented: Not yet implemented 会发生--当你 override fu ...

  3. Spring Mvc Long类型精度丢失

    背景 在使用Spring Boot Mvc的项目中,使用Long类型作为id的类型,但是当前端使用Number类型接收Long类型数据时,由于前端精度问题,会导致Long类型数据转换为Number类型 ...

  4. 书列荐书 |《至关重要的关系》 【美】里德&#183;霍夫曼

    本书的内容不算多,堪称精辟,有些东西甚至可以作为指导思想.括号内为书列君书评. 经典语录: 每个人都是企业家!(否则你无法最大化努力!) 创业和做人是相通的.我们要有计划,要执着,但是也要有弹性,懂得 ...

  5. 自动驾驶传感器比较:激光雷达(LiDAR) vs. 雷达(RADAR)

    自动驾驶传感器比较:激光雷达(LiDAR) vs. 雷达(RADAR) 据麦姆斯咨询报道,2032年全球范围内自动驾驶汽车的产量将高达2310万辆,未来该市场的复合年增长率(CAGR)高达58%.届时 ...

  6. ISP_DPC坏点矫正

    ISP_DPC坏点矫正 1. 坏点介绍 图像坏点(Bad pixel) : 图像传感器上光线采集点(像素点)所形成的阵列存在工艺上的缺陷,或光信号进行转化为电信号的过程中出现错误,从而会造成图像上像素 ...

  7. 解决redis集群版本不一致导致RDB同步失败的问题

    某天,运维反馈某两个机房的出口流量和入口流量过大,并且持续了好一段时间. 再仔细排查后发现是 redis 集群的几台服流量问题,于是开始查日志. 在日志中发现出现大量的 Can't handle RD ...

  8. 1-3. SpringBoot基础,Java配置(全注解配置)取代xml配置

    最近突发奇想,整合一下以前一些学习笔记,分享自己这几年爬过的坑,逐步更新文章,谢谢大家的关注和支持. 这节讲一下SpringBoot的学习必须的一些基础,Java配置.其实在Spring2.0时代就已 ...

  9. .NET平台系列27:在 Linux 上安装 .NET Core/.NET5/.NET6

    系列目录     [已更新最新开发文章,点击查看详细] .NET 在不同的 Linux 发行版上可用. 大多数 Linux 平台和发行版每年都有一个主要版本,并提供用于安装 .NET 的包管理器. 本 ...

  10. Redis 5种数据结构及对应使用场景

    本文案例收录在 https://github.com/chengxy-nds/Springboot-Notebook 也当过面试官,面试过不少应聘者,因为是我自己招人自己用,所以我不会看应聘者造火箭的 ...