原文:[WPF] 圆形等待效果

自己做着玩儿的，留着以后用，效果类似下面的 GIF 动画。

<Grid Width="35" Height="35">

    <Grid.Resources>

        <DrawingBrush x:Key="brush" Stretch="None" AlignmentX="Center" AlignmentY="Top">

            <DrawingBrush.Drawing>

                <GeometryDrawing Brush="Black">

                    <GeometryDrawing.Geometry>

                        <EllipseGeometry RadiusX="2" RadiusY="5"/>

                    </GeometryDrawing.Geometry>

                </GeometryDrawing>

            </DrawingBrush.Drawing>

        </DrawingBrush>

    </Grid.Resources>

    <Rectangle x:Name="r01" Fill="{StaticResource brush}" Opacity="0.2" RenderTransformOrigin="0.5,0.5">

        <Rectangle.RenderTransform>

            <RotateTransform Angle="0"/>

        </Rectangle.RenderTransform>

    </Rectangle>

    <Rectangle x:Name="r02" Fill="{StaticResource brush}" Opacity="0.2" RenderTransformOrigin="0.5,0.5">

        <Rectangle.RenderTransform>

            <RotateTransform Angle="30"/>

        </Rectangle.RenderTransform>

    </Rectangle>

    <Rectangle x:Name="r03" Fill="{StaticResource brush}" Opacity="0.2" RenderTransformOrigin="0.5,0.5">

        <Rectangle.RenderTransform>

            <RotateTransform Angle="60"/>

        </Rectangle.RenderTransform>

    </Rectangle>

    <Rectangle x:Name="r04" Fill="{StaticResource brush}" Opacity="0.2" RenderTransformOrigin="0.5,0.5">

        <Rectangle.RenderTransform>

            <RotateTransform Angle="90"/>

        </Rectangle.RenderTransform>

    </Rectangle>

    <Rectangle x:Name="r05" Fill="{StaticResource brush}" Opacity="0.2" RenderTransformOrigin="0.5,0.5">

        <Rectangle.RenderTransform>

            <RotateTransform Angle="120"/>

        </Rectangle.RenderTransform>

    </Rectangle>

    <Rectangle x:Name="r06" Fill="{StaticResource brush}" Opacity="0.2" RenderTransformOrigin="0.5,0.5">

        <Rectangle.RenderTransform>

            <RotateTransform Angle="150"/>

        </Rectangle.RenderTransform>

    </Rectangle>

    <Rectangle x:Name="r07" Fill="{StaticResource brush}" Opacity="0.2" RenderTransformOrigin="0.5,0.5">

        <Rectangle.RenderTransform>

            <RotateTransform Angle="180"/>

        </Rectangle.RenderTransform>

    </Rectangle>

    <Rectangle x:Name="r08" Fill="{StaticResource brush}" Opacity="0.2" RenderTransformOrigin="0.5,0.5">

        <Rectangle.RenderTransform>

            <RotateTransform Angle="210"/>

        </Rectangle.RenderTransform>

    </Rectangle>

    <Rectangle x:Name="r09" Fill="{StaticResource brush}" Opacity="0.2" RenderTransformOrigin="0.5,0.5">

        <Rectangle.RenderTransform>

            <RotateTransform Angle="240"/>

        </Rectangle.RenderTransform>

    </Rectangle>

    <Rectangle x:Name="r10" Fill="{StaticResource brush}" Opacity="0.2" RenderTransformOrigin="0.5,0.5">

        <Rectangle.RenderTransform>

            <RotateTransform Angle="270"/>

        </Rectangle.RenderTransform>

    </Rectangle>

    <Rectangle x:Name="r11" Fill="{StaticResource brush}" Opacity="0.2" RenderTransformOrigin="0.5,0.5">

        <Rectangle.RenderTransform>

            <RotateTransform Angle="300"/>

        </Rectangle.RenderTransform>

    </Rectangle>

    <Rectangle x:Name="r12" Fill="{StaticResource brush}" Opacity="0.2" RenderTransformOrigin="0.5,0.5">

        <Rectangle.RenderTransform>

            <RotateTransform Angle="330"/>

        </Rectangle.RenderTransform>

    </Rectangle>

    <Grid.Triggers>

        <EventTrigger RoutedEvent="Grid.Loaded">

            <BeginStoryboard>

                <Storyboard RepeatBehavior="Forever">

                    <DoubleAnimation Storyboard.TargetName="r01" Storyboard.TargetProperty="Opacity" AutoReverse="True" Duration="0:0:0.08333" BeginTime="0:0:0.00000" To="0"/>

                    <DoubleAnimation Storyboard.TargetName="r02" Storyboard.TargetProperty="Opacity" AutoReverse="True" Duration="0:0:0.08333" BeginTime="0:0:0.08333" To="0"/>

                    <DoubleAnimation Storyboard.TargetName="r03" Storyboard.TargetProperty="Opacity" AutoReverse="True" Duration="0:0:0.08333" BeginTime="0:0:0.16666" To="0"/>

                    <DoubleAnimation Storyboard.TargetName="r04" Storyboard.TargetProperty="Opacity" AutoReverse="True" Duration="0:0:0.08333" BeginTime="0:0:0.24999" To="0"/>

                    <DoubleAnimation Storyboard.TargetName="r05" Storyboard.TargetProperty="Opacity" AutoReverse="True" Duration="0:0:0.08333" BeginTime="0:0:0.33332" To="0"/>

                    <DoubleAnimation Storyboard.TargetName="r06" Storyboard.TargetProperty="Opacity" AutoReverse="True" Duration="0:0:0.08333" BeginTime="0:0:0.41665" To="0"/>

                    <DoubleAnimation Storyboard.TargetName="r07" Storyboard.TargetProperty="Opacity" AutoReverse="True" Duration="0:0:0.08333" BeginTime="0:0:0.49998" To="0"/>

                    <DoubleAnimation Storyboard.TargetName="r08" Storyboard.TargetProperty="Opacity" AutoReverse="True" Duration="0:0:0.08333" BeginTime="0:0:0.58331" To="0"/>

                    <DoubleAnimation Storyboard.TargetName="r09" Storyboard.TargetProperty="Opacity" AutoReverse="True" Duration="0:0:0.08333" BeginTime="0:0:0.66664" To="0"/>

                    <DoubleAnimation Storyboard.TargetName="r10" Storyboard.TargetProperty="Opacity" AutoReverse="True" Duration="0:0:0.08333" BeginTime="0:0:0.74997" To="0"/>

                    <DoubleAnimation Storyboard.TargetName="r11" Storyboard.TargetProperty="Opacity" AutoReverse="True" Duration="0:0:0.08333" BeginTime="0:0:0.83330" To="0"/>

                    <DoubleAnimation Storyboard.TargetName="r12" Storyboard.TargetProperty="Opacity" AutoReverse="True" Duration="0:0:0.08333" BeginTime="0:0:0.91663" To="0"/>

                </Storyboard>

            </BeginStoryboard>

        </EventTrigger>

    </Grid.Triggers>

</Grid>

[WPF] 圆形等待效果的更多相关文章

  1. WPF 实现的等待效果界面

    这个界面的效果是从WinForm 转变过来,可以实现等待的效果,操作完成以后就自动关掉. 效果图如下 有一个动态的手机等待效果的样式,中间的文字可以自己定义,提供了方法可以修改中间"正在加载 ...

  2. WPF圆形环绕的Loading动画

    原文:WPF圆形环绕的Loading动画 版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/yangyisen0713/article/details/ ...

  3. [原译]一步步教你制作WPF圆形玻璃按钮

    原文:[原译]一步步教你制作WPF圆形玻璃按钮 图1 1.介绍 从我开始使用vista的时候,我就非常喜欢它的圆形玻璃按钮.WPF最好的一个方面就是允许自定义任何控件的样式.用了一段时间的Micros ...

  4. C#.Net网页加载等待效果漂亮并且简单

    最近网页加载数据比较多,点击后给用户就是白板很不友好,想了很久找了些资料,在网页加载中显示等待画面给客户,页面加载完成自动隐藏等待效果. 在网页后台cs代码:    protected void Pa ...

  5. WPF提示框效果

    WPF提示框效果 1,新建WPF应用程序 2,添加用户控件Message 3,在Message中编写如下代码 <Border x:Name="border" BorderTh ...

  6. wpf 模拟3D效果(和手机浏览图片效果相似)（附源码）

    原文 wpf 模拟3D效果(和手机浏览图片效果相似)(附源码) pf的3D是一个很有意思的东西,类似于ps的效果,类似于电影动画的效果,因为动画的效果,(对于3D基础的摄像机,光源,之类不介绍,对于依 ...

  7. 手机站全局的html+css加载等待效果

    本文只提供思路,CSS神马的自己定制吧,JS是可以优化的,比如,输出图片的JS也可以放到showdiv()里面,我没有做优化,只是实现,别笑话我,我比较懒... 基本思路:由于Html的解析是从上到下 ...

  8. js加载等待效果

    demo01: 加载首页的时候,可能会很缓慢,放一张等待图片. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN ...

  9. WPF实现射线效果动画

    原文:WPF实现射线效果动画 最近的一个项目中有个需求是:从一个点向其它多个点发出射线,要求这些射线同时发出,同时到达. 我就想到了用WPF的动画来实现.WPF中有Line类用于绘制直线,但这个类中好 ...

随机推荐

  1. LOJ——#2256. 「SNOI2017」英雄联盟

    https://loj.ac/problem/2256 题目描述 正在上大学的小皮球热爱英雄联盟这款游戏,而且打的很菜,被网友们戏称为「小学生」.现在,小皮球终于受不了网友们的嘲讽,决定变强了,他变强 ...

  2. myeclipse集成svn

    svn安装 这个我在博客中的代码管理里面有些,也是一直next.svn代码管理版本号管理器安装好之后. myeclipse的svn插件 方法一: 然后配置MyEclipse的SVN插件,将插件下载下来 ...

  3. Eclipse中高效的快捷键、调试及Junit

    Eclipse中高效的快捷键 当我知道了这些快捷键的用法之后,感觉真的非常兴奋,没想到Eclipse中还有这么多令人惊喜的功能,真的能够提高效率. 内容提示 Alt+/ 用于输入标准库或者keywor ...

  4. 请用Java设计一个Least Recently Used (LRU) 缓存

    LRU介绍:LRU是Least Recently Used的缩写,即最少使用页面置换算法,是为虚拟页式存储管理服务的, 思路介绍: 能够使用两个标准的数据结构来实现.Map和Queue.由于须要支持多 ...

  5. Java Secret: Using an enum to build a State machine（Java秘术：用枚举构建一个状态机）

    近期在读Hadoop#Yarn部分的源代码.读到状态机那一部分的时候,感到enmu的使用方法实在是太灵活了,在给并发编程网翻译一篇文章的时候,正好碰到一篇这种文章.就赶紧翻译下来,涨涨姿势. 原文链接 ...

  6. FOJ题目Problem 2082 过路费 （link cut tree边权更新）

    Problem 2082 过路费 Accept: 382    Submit: 1279 Time Limit: 1000 mSec    Memory Limit : 32768 KB Proble ...

  7. POJ - 3257 Cow Roller Coaster （背包）

    题目大意:要用N种材料建一条长为L的路,如今给出每种材料的长度w.起始地点x.发费c和耐久度f 问:在预算为B的情况下,建好这条路的最大耐久度是多少 解题思路:背包问题 dp[i][j]表示起始地点为 ...

  8. Linux以下基于TCP多线程聊天室（client）

    不怎么会弄这个博客的排版,就直接将代码附上: 主要是使用多线程去等待接受数据和发送数据.以下是client的代码: tcpsed.h文件 1 2 3 4 5 6 7 8 9 10 11 12 13 1 ...

  9. UVA 11728 - Alternate Task 数学

    Little Hasan loves to play number games with his friends. One day they were playing a game whereone ...

  10. Gradle for Android 第三篇( 依赖管理 )

    依赖管理 这会是一个系列,所以如果你还没有看我之前的几篇文章,请先查看以下文章: Gradle for Android 第一篇( 从 Gradle 和 AS 开始 ) Gradle for Andro ...