WPF仿win10加载动画 可用于loading加载
直接上xaml 没有cs代码 (自己琢磨了好久感觉这样能接受)
<UserControl x:Class="WpfApp1.Loading"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Name="uclLoad" Width="50" Height="50">
<UserControl.Resources>
<Storyboard x:Key="stb1" BeginTime="0:0:0" Duration="0:0:05.43" RepeatBehavior="Forever">
<DoubleAnimation Storyboard.TargetName="rot1" Storyboard.TargetProperty="Angle" Duration="0:0:2.00" From="0" To="180">
<DoubleAnimation.EasingFunction>
<QuadraticEase EasingMode="EaseOut"/>
</DoubleAnimation.EasingFunction>
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="rot1" Storyboard.TargetProperty="Angle" BeginTime="0:0:1.80" Duration="0:0:2.00" From="180" To="540">
<DoubleAnimation.EasingFunction>
<QuadraticEase EasingMode="EaseInOut"/>
</DoubleAnimation.EasingFunction>
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="rot1" Storyboard.TargetProperty="Angle" BeginTime="0:0:3.75" Duration="0:0:1.00" From="540" To="720">
<DoubleAnimation.EasingFunction>
<QuadraticEase EasingMode="EaseIn"/>
</DoubleAnimation.EasingFunction>
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="grd1" Storyboard.TargetProperty="Opacity" BeginTime="0:0:0.00" Duration="0:0:0.00" From="0" To="1"/>
<DoubleAnimation Storyboard.TargetName="grd1" Storyboard.TargetProperty="Opacity" BeginTime="0:0:4.75" Duration="0:0:0.00" From="1" To="0"/>
</Storyboard>
<Storyboard x:Key="stb2" BeginTime="0:0:0.17" Duration="0:0:05.43" RepeatBehavior="Forever">
<DoubleAnimation Storyboard.TargetName="rot2" Storyboard.TargetProperty="Angle" Duration="0:0:2.00" From="-25" To="155">
<DoubleAnimation.EasingFunction>
<QuadraticEase EasingMode="EaseOut"/>
</DoubleAnimation.EasingFunction>
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="rot2" Storyboard.TargetProperty="Angle" BeginTime="0:0:1.80" Duration="0:0:2.00" From="155" To="515">
<DoubleAnimation.EasingFunction>
<QuadraticEase EasingMode="EaseInOut"/>
</DoubleAnimation.EasingFunction>
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="rot2" Storyboard.TargetProperty="Angle" BeginTime="0:0:3.75" Duration="0:0:1.00" From="515" To="720">
<DoubleAnimation.EasingFunction>
<QuadraticEase EasingMode="EaseIn"/>
</DoubleAnimation.EasingFunction>
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="grd2" Storyboard.TargetProperty="Opacity" BeginTime="0:0:0.00" Duration="0:0:0.00" From="0" To="1"/>
<DoubleAnimation Storyboard.TargetName="grd2" Storyboard.TargetProperty="Opacity" BeginTime="0:0:4.75" Duration="0:0:0.00" From="1" To="0"/>
</Storyboard>
<Storyboard x:Key="stb3" BeginTime="0:0:0.34" Duration="0:0:05.43" RepeatBehavior="Forever">
<DoubleAnimation Storyboard.TargetName="rot3" Storyboard.TargetProperty="Angle" Duration="0:0:2.00" From="-50" To="130">
<DoubleAnimation.EasingFunction>
<QuadraticEase EasingMode="EaseOut"/>
</DoubleAnimation.EasingFunction>
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="rot3" Storyboard.TargetProperty="Angle" BeginTime="0:0:1.80" Duration="0:0:2.00" From="130" To="490">
<DoubleAnimation.EasingFunction>
<QuadraticEase EasingMode="EaseInOut"/>
</DoubleAnimation.EasingFunction>
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="rot3" Storyboard.TargetProperty="Angle" BeginTime="0:0:3.75" Duration="0:0:1.00" From="490" To="720">
<DoubleAnimation.EasingFunction>
<QuadraticEase EasingMode="EaseIn"/>
</DoubleAnimation.EasingFunction>
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="grd3" Storyboard.TargetProperty="Opacity" BeginTime="0:0:0.25" Duration="0:0:0.00" From="0" To="1"/>
<DoubleAnimation Storyboard.TargetName="grd3" Storyboard.TargetProperty="Opacity" BeginTime="0:0:4.75" Duration="0:0:0.00" From="1" To="0"/>
</Storyboard>
<Storyboard x:Key="stb4" BeginTime="0:0:0.51" Duration="0:0:05.43" RepeatBehavior="Forever">
<DoubleAnimation Storyboard.TargetName="rot4" Storyboard.TargetProperty="Angle" Duration="0:0:2.00" From="-75" To="105">
<DoubleAnimation.EasingFunction>
<QuadraticEase EasingMode="EaseOut"/>
</DoubleAnimation.EasingFunction>
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="rot4" Storyboard.TargetProperty="Angle" BeginTime="0:0:1.80" Duration="0:0:2.00" From="105" To="465">
<DoubleAnimation.EasingFunction>
<QuadraticEase EasingMode="EaseInOut"/>
</DoubleAnimation.EasingFunction>
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="rot4" Storyboard.TargetProperty="Angle" BeginTime="0:0:3.75" Duration="0:0:1.00" From="465" To="720">
<DoubleAnimation.EasingFunction>
<QuadraticEase EasingMode="EaseIn"/>
</DoubleAnimation.EasingFunction>
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="grd4" Storyboard.TargetProperty="Opacity" BeginTime="0:0:0.50" Duration="0:0:0.00" From="0" To="1"/>
<DoubleAnimation Storyboard.TargetName="grd4" Storyboard.TargetProperty="Opacity" BeginTime="0:0:4.75" Duration="0:0:0.00" From="1" To="0"/>
</Storyboard>
<Storyboard x:Key="stb5" BeginTime="0:0:0.68" Duration="0:0:05.43" RepeatBehavior="Forever">
<DoubleAnimation Storyboard.TargetName="rot5" Storyboard.TargetProperty="Angle" Duration="0:0:2.00" From="-100" To="80">
<DoubleAnimation.EasingFunction>
<QuadraticEase EasingMode="EaseOut"/>
</DoubleAnimation.EasingFunction>
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="rot5" Storyboard.TargetProperty="Angle" BeginTime="0:0:1.80" Duration="0:0:2.00" From="80" To="440">
<DoubleAnimation.EasingFunction>
<QuadraticEase EasingMode="EaseInOut"/>
</DoubleAnimation.EasingFunction>
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="rot5" Storyboard.TargetProperty="Angle" BeginTime="0:0:3.75" Duration="0:0:1.00" From="440" To="720">
<DoubleAnimation.EasingFunction>
<QuadraticEase EasingMode="EaseIn"/>
</DoubleAnimation.EasingFunction>
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="grd5" Storyboard.TargetProperty="Opacity" BeginTime="0:0:0.75" Duration="0:0:0.00" From="0" To="1"/>
<DoubleAnimation Storyboard.TargetName="grd5" Storyboard.TargetProperty="Opacity" BeginTime="0:0:4.75" Duration="0:0:0.00" From="1" To="0"/>
</Storyboard>
</UserControl.Resources>
<UserControl.Triggers>
<EventTrigger RoutedEvent="Loaded">
<BeginStoryboard Storyboard="{StaticResource stb1}"/>
<BeginStoryboard Storyboard="{StaticResource stb2}"/>
<BeginStoryboard Storyboard="{StaticResource stb3}"/>
<BeginStoryboard Storyboard="{StaticResource stb4}"/>
<BeginStoryboard Storyboard="{StaticResource stb5}"/>
</EventTrigger>
</UserControl.Triggers>
<Grid>
<Grid x:Name="grd1" Width="50" Height="50" Opacity="0">
<Grid.RenderTransform>
<TransformGroup>
<RotateTransform x:Name="rot1" Angle="0" CenterX="25" CenterY="25"/>
</TransformGroup>
</Grid.RenderTransform>
<Ellipse Width="6" Height="6" Fill="{Binding ElementName=uclLoad,Path=Foreground}">
<Ellipse.RenderTransform>
<TransformGroup>
<TranslateTransform X="0" Y="18"/>
</TransformGroup>
</Ellipse.RenderTransform>
</Ellipse>
</Grid>
<Grid x:Name="grd2" Width="50" Height="50" Opacity="0">
<Grid.RenderTransform>
<TransformGroup>
<RotateTransform x:Name="rot2" Angle="0" CenterX="25" CenterY="25"/>
</TransformGroup>
</Grid.RenderTransform>
<Ellipse Width="6" Height="6" Fill="{Binding ElementName=uclLoad,Path=Foreground}">
<Ellipse.RenderTransform>
<TransformGroup>
<TranslateTransform X="0" Y="18"/>
</TransformGroup>
</Ellipse.RenderTransform>
</Ellipse>
</Grid>
<Grid x:Name="grd3" Width="50" Height="50" Opacity="0">
<Grid.RenderTransform>
<TransformGroup>
<RotateTransform x:Name="rot3" Angle="0" CenterX="25" CenterY="25"/>
</TransformGroup>
</Grid.RenderTransform>
<Ellipse Width="6" Height="6" Fill="{Binding ElementName=uclLoad,Path=Foreground}">
<Ellipse.RenderTransform>
<TransformGroup>
<TranslateTransform X="0" Y="18"/>
</TransformGroup>
</Ellipse.RenderTransform>
</Ellipse>
</Grid>
<Grid x:Name="grd4" Width="50" Height="50" Opacity="0">
<Grid.RenderTransform>
<TransformGroup>
<RotateTransform x:Name="rot4" Angle="0" CenterX="25" CenterY="25"/>
</TransformGroup>
</Grid.RenderTransform>
<Ellipse Width="6" Height="6" Fill="{Binding ElementName=uclLoad,Path=Foreground}">
<Ellipse.RenderTransform>
<TransformGroup>
<TranslateTransform X="0" Y="18"/>
</TransformGroup>
</Ellipse.RenderTransform>
</Ellipse>
</Grid>
<Grid x:Name="grd5" Width="50" Height="50" Opacity="0">
<Grid.RenderTransform>
<TransformGroup>
<RotateTransform x:Name="rot5" Angle="0" CenterX="25" CenterY="25"/>
</TransformGroup>
</Grid.RenderTransform>
<Ellipse Width="6" Height="6" Fill="{Binding ElementName=uclLoad,Path=Foreground}">
<Ellipse.RenderTransform>
<TransformGroup>
<TranslateTransform X="0" Y="18"/>
</TransformGroup>
</Ellipse.RenderTransform>
</Ellipse>
</Grid>
</Grid>
</UserControl>
直接放到STA线程去不怕主线程卡顿了 美滋滋
WPF仿win10加载动画 可用于loading加载的更多相关文章
- jquery加载数据时显示loading加载动画特效
插件下载:http://www.htmleaf.com/jQuery/Layout-Interface/201505061788.html 插件使用: 使用该loading加载插件首先要引入jQuer ...
- CSS动画实例：Loading加载动画效果（一）
一些网站或者APP在加载新东西的时候,往往会给出一个好看有趣的Loading图,大部分的Loading样式都可以使用CSS3制作出来,它不仅比直接使用gif图简单方便,还能节省加载时间和空间.下面介绍 ...
- CSS动画实例：Loading加载动画效果（三）
3．小圆型Loading 这类Loading动画的基本思想是:在呈现容器中定义1个或多个子层,再对每个子层进行样式定义,使得其均显示为一个实心圆形,最后编写关键帧动画控制,使得各个实心圆或者大小发生改 ...
- 页面加载完成前的loading加载效果
/*loading.js*/ // 加载HTML图 var _LoadingHtml = '<div id="loadingDiv" style="position ...
- 原生JS+ CSS3创建loading加载动画；
效果图: js创建loading show = function(){ //loading dom元素 var Div = document.createElement("div" ...
- WPF动画 - Loading加载动画
存在问题: 最近接手公司一个比较成熟的产品项目开发(WPF桌面端),其中,在登陆系统加载时,60张图片切换,实现loading闪烁加载,快有密集恐惧症了!!! 代码如下: private void L ...
- CoreThink开发（十三）增加页面加载动画
效果: 加载动画是由jquery和fakeloader这个js库实现的. 其实这个也可以做成一个插件,用数据库记录是否开启,选择动画的样式,那样扩展性会更好. 源码资源已经上传在我的csdn下载中. ...
- 网页图表Highcharts实践教程之标签组与加载动画
网页图表Highcharts实践教程之标签组与加载动画 Highcharts标签组 在图表的大部分元素都提供了标签功能.但非常多时候,我们须要额外说明一些信息.这个时候借助原有的图表元素的标签功能就 ...
- 自定义动画（仿Win10加载动画）
一.源代码 源代码及demo 二.背景 先看看Win10的加载动画(找了很久才找到): CPA推广甲爪广告联盟满30日结 [点击进入] 甲爪广告联盟,提供各类高单价CPA广告 单价高 收益好 日付广告 ...
- 纯 HTML/CSS 高仿 Win10 加载动画
自己做的超高仿Win10加载动画(应该是全网最像的 HTML 实现了),自己想用就拿去用吧 转圈加载 在线演示 HTML: <div class="loading"> ...
随机推荐
- 解决python报错：ModuleNotFoundError: No module named '_sysconfigdata_x86_64_conda_linux_gnu'
技术背景 在上一篇博客中执行过conda的更新以及用conda安装了gxx_linux-64之后,再执行pip的一些指令时,就会给出如下所示的报错: $ python3 -m pip list Tra ...
- Java开发者的Python进修指南：JSON利器之官方json库、demjson和orjson的实用指南
JSON JSON作为目前最流行的传输格式,在Python中也有相应的实现方式.由于JSON格式的文本可以跨平台并且简单易用,因此被广泛传播.因此,我们今天的主要讨论内容是如何熟练地应用Python的 ...
- [转帖]总结：shell中的if条件判断
一.if 的基本语法 if [ command ];then xxx elif [ command ];then xxx else xxx fi 二.常见的一些写法案例 1.if [ "x$ ...
- kafka的学习之一_带SASL鉴权的集群安装与启动
kafka的学习之一_带SASL鉴权的集群安装与启动 背景 想开始一段新的里程. 可能会比现在累, 可能会需要更多的学习和努力. kafka可能就是其中之一. 自己之前总是畏缩不前. 不想面对很多压力 ...
- [转帖]聊聊我对 GraphQL 的一些认知
https://www.modb.pro/db/139451 作者简介:haohongfan 是 Apache Dubbogo Committer,目前就职于京东,擅长高并发架构设计.公众号 HHFC ...
- [转帖]一行Python代码实现同一局域网内的文件共享
在不同的设备之间传输文件除了数据线,网盘传输外是否还有其他优雅的方法?我们可以使用一行Python代码使局域网内的所有设备都可以访问并下载文件夹内的文件. 要求: 电脑中安装配置好python 访问的 ...
- [转帖]Linux中最全shell命令&常用注意事项
在编辑linux脚本中不断的会用到复杂的脚本编辑,写文章记录. Linux命令大全(手册) – 真正好用的Linux命令在线查询网站 目录 推荐书籍: Linux常用命令 Linux 常用命令 在li ...
- [转帖]浅谈Armv8-A处理器
https://www.elecfans.com/emb/dsp/202208291886182.html 众所周知,ARM是一家设计并授权处理器和相应IP(比如互连总线,中断处理器,图像处理器等等) ...
- [转帖]jar启动指定JDK/JRE 安装路径教程
https://blog.csdn.net/weixin_40986713/article/details/128136777 前言 因为疫情在家办公的缘故,有个老项目,需要改个接口,然后需要前端联调 ...
- locust+python性能测试库
一.简介 locust官网介绍:Locust 是一个用于 HTTP 和其他协议的开源性能/负载测试工具.其对开发人员友好的方法允许您在常规 Python 代码中定义测试.Locust测试可以从命令行运 ...