1. <Window
  2. x:Class="WpfApp5.MainWindow"
  3. xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  4. xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  5. xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
  6. xmlns:local="clr-namespace:WpfApp5"
  7. xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
  8. xmlns:sys="clr-namespace:System;assembly=mscorlib"
  9. Name="UI"
  10. Title="MainWindow"
  11.  
  12. Background="White"
  13. mc:Ignorable="d" Height="350"
  14. Width="525">
  15. <Window.Resources>
  16.  
  17. <!-- Marching Ants -->
  18. <Storyboard x:Key="MarchingAnts">
  19. <DoubleAnimation BeginTime="00:00:00"
  20. Storyboard.TargetName="AlertBox"
  21. Storyboard.TargetProperty="StrokeThickness"
  22. To="4"
  23. Duration="0:0:0.25" />
  24. <!-- If you want to run counter-clockwise, just swap the 'From' and 'To' values. -->
  25. <DoubleAnimation BeginTime="00:00:00" RepeatBehavior="Forever" Storyboard.TargetName="AlertBox" Storyboard.TargetProperty="StrokeDashOffset"
  26. Duration="0:3:0" From="1000" To="0"/>
  27. </Storyboard>
  28.  
  29. <!-- Pulse -->
  30. <Storyboard x:Key="Pulse" RepeatBehavior="Forever">
  31. <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)" Storyboard.TargetName="PulseBox">
  32. <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="1.15"/>
  33. <EasingDoubleKeyFrame KeyTime="0:0:1" Value="1"/>
  34. </DoubleAnimationUsingKeyFrames>
  35. <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)" Storyboard.TargetName="PulseBox">
  36. <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="1.15"/>
  37. <EasingDoubleKeyFrame KeyTime="0:0:1" Value="1"/>
  38. </DoubleAnimationUsingKeyFrames>
  39. </Storyboard>
  40.  
  41. <!-- Flipper -->
  42. <Storyboard x:Key="Flipper" RepeatBehavior="Forever">
  43. <PointAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransformOrigin)" Storyboard.TargetName="FlipperBox">
  44. <EasingPointKeyFrame KeyTime="0:0:1" Value="0.5,0.5"/>
  45. <EasingPointKeyFrame KeyTime="0:0:2" Value="0.5,0.5"/>
  46. </PointAnimationUsingKeyFrames>
  47. <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)" Storyboard.TargetName="FlipperBox">
  48. <EasingDoubleKeyFrame KeyTime="0:0:1" Value="-1"/>
  49. <EasingDoubleKeyFrame KeyTime="0:0:2" Value="1"/>
  50. </DoubleAnimationUsingKeyFrames>
  51. </Storyboard>
  52.  
  53. <!-- Elasic Lines -->
  54. <Storyboard x:Key="ElasticLines" RepeatBehavior="Forever" AutoReverse="True">
  55. <PointAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Fill).(LinearGradientBrush.EndPoint)" Storyboard.TargetName="ElasticBox">
  56. <EasingPointKeyFrame KeyTime="0:0:4" Value="12,8"/>
  57. </PointAnimationUsingKeyFrames>
  58. </Storyboard>
  59.  
  60. <!-- Knight Rider -->
  61. <Storyboard x:Key="KnightRider" RepeatBehavior="Forever" AutoReverse="True">
  62. <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" Storyboard.TargetName="KRBox">
  63. <EasingDoubleKeyFrame KeyTime="0:0:1" Value="-50"/>
  64. <EasingDoubleKeyFrame KeyTime="0:0:2" Value="50"/>
  65. <EasingDoubleKeyFrame KeyTime="0:0:3" Value="0"/>
  66. </DoubleAnimationUsingKeyFrames>
  67. </Storyboard>
  68.  
  69. </Window.Resources>
  70. <Window.Triggers>
  71. <EventTrigger RoutedEvent="FrameworkElement.Loaded">
  72. <BeginStoryboard Storyboard="{StaticResource Pulse}"/>
  73. <BeginStoryboard Storyboard="{StaticResource MarchingAnts}"/>
  74. <BeginStoryboard Storyboard="{StaticResource Flipper}"/>
  75. <BeginStoryboard Storyboard="{StaticResource ElasticLines}"/>
  76. <BeginStoryboard Storyboard="{StaticResource KnightRider}"/>
  77. </EventTrigger>
  78. </Window.Triggers>
  79.  
  80. <Grid HorizontalAlignment="Center" VerticalAlignment="Center">
  81. <Grid.Resources>
  82. <Style TargetType="{x:Type TextBlock}">
  83. <Setter Property="Foreground" Value="White"/>
  84. <Setter Property="FontWeight" Value="Bold"/>
  85. <Setter Property="FontSize" Value="35"/>
  86. <Setter Property="HorizontalAlignment" Value="Center"/>
  87. <Setter Property="VerticalAlignment" Value="Center"/>
  88. <Setter Property="Text" Value="ALERT"/>
  89. </Style>
  90. <Style TargetType="{x:Type Grid}">
  91. <Setter Property="Margin" Value="0,10"/>
  92. </Style>
  93. <Style TargetType="{x:Type Rectangle}">
  94. <Setter Property="Height" Value="50"/>
  95. <Setter Property="Width" Value="150"/>
  96. </Style>
  97. </Grid.Resources>
  98.  
  99. <StackPanel>
  100.  
  101. <!-- Marching Ants -->
  102. <Grid>
  103.  
  104. <Rectangle x:Name="AlertBox"
  105. Stroke="Red"
  106. StrokeDashOffset="2" StrokeDashArray="5" Margin="5">
  107. <Rectangle.Fill>
  108. <LinearGradientBrush StartPoint="0,0" EndPoint="6,4" MappingMode="Absolute" SpreadMethod="Repeat">
  109. <GradientStop Color="Red" Offset="0.25"/>
  110. <GradientStop Color="#00000000" Offset="0.15"/>
  111. </LinearGradientBrush>
  112. </Rectangle.Fill>
  113. </Rectangle>
  114.  
  115. <TextBlock/>
  116.  
  117. </Grid>
  118. <!-- End Marching Ants -->
  119.  
  120. <!-- Pulse : Will not skew other elements location like width/height animations would. -->
  121. <Grid>
  122. <Border x:Name="PulseBox"
  123. Background="Red" RenderTransformOrigin="0.5,0.5">
  124. <Border.RenderTransform>
  125. <TransformGroup>
  126. <ScaleTransform/>
  127. <SkewTransform/>
  128. <RotateTransform/>
  129. <TranslateTransform/>
  130. </TransformGroup>
  131. </Border.RenderTransform>
  132.  
  133. <TextBlock/>
  134.  
  135. </Border>
  136. </Grid>
  137. <!-- End Pulse -->
  138.  
  139. <!-- Flipper -->
  140. <Grid>
  141. <Border x:Name="FlipperBox"
  142. Background="Red">
  143. <Border.RenderTransform>
  144. <TransformGroup>
  145. <ScaleTransform/>
  146. <SkewTransform/>
  147. <RotateTransform/>
  148. <TranslateTransform/>
  149. </TransformGroup>
  150. </Border.RenderTransform>
  151.  
  152. <TextBlock/>
  153.  
  154. </Border>
  155. </Grid>
  156. <!-- End Flipper -->
  157.  
  158. <!-- Elastic Lines -->
  159. <Grid>
  160. <Rectangle x:Name="ElasticBox"
  161. Stroke="Red" StrokeThickness="5" Margin="5">
  162. <Rectangle.Fill>
  163. <LinearGradientBrush StartPoint="0,0" EndPoint="6,4" MappingMode="Absolute" SpreadMethod="Repeat">
  164. <GradientStop Color="Red" Offset="0.25"/>
  165. <GradientStop Color="#00000000" Offset="0.15"/>
  166. </LinearGradientBrush>
  167. </Rectangle.Fill>
  168. </Rectangle>
  169.  
  170. <TextBlock/>
  171.  
  172. </Grid>
  173. <!-- End Elastic Box -->
  174.  
  175. <!-- Knight Rider -->
  176. <Grid>
  177. <Rectangle Fill="Red"/>
  178. <Rectangle x:Name="KRBox" Width="50" Fill="White" RenderTransformOrigin="0.5,0.5">
  179. <Rectangle.RenderTransform>
  180. <TransformGroup>
  181. <ScaleTransform/>
  182. <SkewTransform/>
  183. <RotateTransform/>
  184. <TranslateTransform/>
  185. </TransformGroup>
  186. </Rectangle.RenderTransform>
  187. </Rectangle>
  188.  
  189. <TextBlock Foreground="Red"/>
  190.  
  191. </Grid>
  192. <!-- End Knight Rider -->
  193.  
  194. </StackPanel>
  195.  
  196. </Grid>
  197. </Window>

XAML 特效的更多相关文章

  1. 基于<MediaElement>的WPF视频播放器(带部分特效)【2】

    一.前言       上回说到需要做放视频的使用向导,这两天公司里的老司机一直帮我答疑解惑,让这个任务变得挺顺的,真心感谢他们! 这次与[1]中的不同之处在于: (1)播放和暂停按钮集成在<Me ...

  2. Windows Store App 偏移特效

    通过前面讲解的内容,读者已经了解了如何在三维空间中使旋转对象绕指定的旋转中心旋转一定的角度.接下来在这个基础上进一步讲解如何对旋转对象进行平移.下面首先介绍一下用到的几个属性. q  LocalOff ...

  3. Windows Store App 旋转特效

    使用Projection类可以实现界面元素的三维效果,它可以使界面上的元素在三维空间中沿着X轴.Y轴或者Z轴旋转一定的角度,在透视转换中此类又称为元素的Projection属性,用于对元素使用3D特效 ...

  4. winrt 上的翻书特效组件 源码分享 转载请说明

    http://blog.csdn.net/wangrenzhu2011/article/details/10207413 (转) [TemplatePart(Name = A_PARTNAME, Ty ...

  5. WPF制作QQ列表(仿qq列表特效)

    先看效果图:这个是折叠特效. 代码结构:      model是我们的数据模型,定义了在列表显示的人物名称   图片   简介    . Resource是我们的图片资源  和 存储图片资源路径.名称 ...

  6. Silverlight & Blend动画设计系列六:动画技巧(Animation Techniques)之对象与路径转化、波感特效

    当我们在进行Silverlight & Blend进行动画设计的过程中,可能需要设计出很多效果不一的图形图像出来作为动画的基本组成元素.然而在设计过程中可能会出现许多的问题,比如当前绘制了一个 ...

  7. wpf利用线程制作初始界面和关闭窗体特效

    1.首先定义初始窗体,和主窗体. 初始窗体(StartWindow) 主窗体(MainWindow): 2.在主窗体界面中,加载初始窗体.注意在线程中操作UI元素需要使用BeginInvoke或者In ...

  8. xaml可扩展应用程序标记语言

    xaml 类似于 html,但不是html,它是基于xml语言的:’html可以呈现在浏览器中而xaml 可以现实 3d动画等特效. xaml  是强类型语言,  是解释性语言,虽然他可以被编译.

  9. 浅谈WPF中对控件的位图特效(WPF Bitmap Effects)

    原文:浅谈WPF中对控件的位图特效(WPF Bitmap Effects) -------------------------------------------------------------- ...

随机推荐

  1. 理解 Python 语言中的 defaultdict

    众所周知,在Python中如果访问字典中不存在的键,会引发KeyError异常(JavaScript中如果对象中不存在某个属性,则返回undefined).但是有时候,字典中的每个键都存在默认值是非常 ...

  2. 正确而又严谨得ajax原生创建方式

    自己去封装一个xhr对象是一件比较麻烦的事情.其实也不麻烦,注意逻辑和一个ie6兼容方案(可无),和一个304 其他2开头的status都可以就好了 <!DOCTYPE html> < ...

  3. cookie记录

    登录页面引用: <script src="/jquery.cookie.js"></script> 登录页面jq: var telphone = $('[n ...

  4. jQ-点击查看更多

    <style type="text/css"> .hi { width: 200px; height: 18vw; background-color: pink; fo ...

  5. springmvc java程序文件保存地址的路径问题

    会保存为这种斜杠 不论之前填写的是什么样

  6. python元祖和列表

    下面讲到的分别有: 列表:元祖 列表的定义 list(列表)是python中使用最频繁的数据类型,在其他语言中叫做数组 专门储存一串信息 列表[  ]定义,数据之间有逗号分隔 列表的索引是从0开始的 ...

  7. java-静态-单例-继承

    概要图 一.静态 1.1 静态方法 创建对象就是为了产生实例,并进行数据的封装. 而调用功能时,确没有用到这些对象中封装的数据. 该对象的创建有意义吗?虽然可以编译并运行,但是在堆内存中空间较为浪费. ...

  8. Java中用JXL导出Excel代码详解

    jxl是一个韩国人写的java操作excel的工具, 在开源世界中,有两套比较有影响的API可供使用,一个是POI,一个是jExcelAPI.其中功能相对POI比较弱一点.但jExcelAPI对中文支 ...

  9. Leetcode661.Image Smoother图片平滑器

    包含整数的二维矩阵 M 表示一个图片的灰度.你需要设计一个平滑器来让每一个单元的灰度成为平均灰度 (向下舍入) ,平均灰度的计算是周围的8个单元和它本身的值求平均,如果周围的单元格不足八个,则尽可能多 ...

  10. idea 创建properties配置文件

    [转载]原文链接:https://blog.csdn.net/caoPengFlying/article/details/78660379 我们在j2ee当中,连接数据库的时候经常会用到propert ...