Silverlight动画显示Line线

时间:2022-05-28 03:43:57

目的:在silverlight中显示两点之间的连线,要求动画显示连线效果。

如果需实现动画效果不得不了解,Storyborad对象:

Storyboard

Silverlight
 

通过时间线控制动画,并为其子动画提供对象和属性目标信息。

 
<Storyboard   ...>
oneOrMoreChildTimelines
</Storyboard>
 

描述

oneOrMoreChildTimelines

从 Timeline 派生的以下对象元素中的一个或多个:Storyboard、ColorAnimationColorAnimationUsingKeyFramesDoubleAnimationDoubleAnimationUsingKeyFramesPointAnimation或 PointAnimationUsingKeyFrames。 在运行时访问 Children 属性时,此处定义的对象元素成为 Children 集合的成员。

从微软官网上定义,我们可以知道这个Storyborad正是实现动画的一个重要的元素。

备注
 

在对象加载或要启动、暂停、继续和停止动画时,可以使用 Storyboard 对象的交互式方法来自动启动演示图板。

Storyboard 是 Resources 属性唯一支持的资源类型。

从微软官网上我们得到这个东西需要可以定义一些诶设置在Canvas.Resources节点下,官网给出了一个Rectangle颜色变化的一个例子:

 <Canvas
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Rectangle
x:Name="MyAnimatedRectangle"
Width="100"
Height="100"
Fill="Blue">
<Rectangle.Triggers> <!-- Animates the rectangle's opacity. -->
<EventTrigger RoutedEvent="Rectangle.Loaded">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation
Storyboard.TargetName="MyAnimatedRectangle"
Storyboard.TargetProperty="Opacity"
From="1.0" To="0.0" Duration="0:0:5" AutoReverse="True" RepeatBehavior="Forever" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Rectangle.Triggers>
</Rectangle>
</Canvas>

示例解读:

在Canvas下有一个长100px宽100px的的Rectangle对象,在Rectangle的Targegers节点下,定义了一个动画规则,该动画是用来修改Rectangle的透明度(Opacity)属性的,

设置透明度在5秒内按照DoubleAnimation的方式从1.0变化到0.0,且不重复播放。

有了这样的一个例子,我们知道我们要实现Line动态显示效果,就必不可少要用到的对象有Storyboard对象,且要在该对象下制定一个修改X2,Y2的方式(是按照DoubleAnnimation还是ColorAnimation,还是其他方式)

下边我们定一个额Line让他初始化的点在500,500处,当开始启动播放时,从500,500一直画到(200,200)处:

 private void myButton_Click(object sender, RoutedEventArgs e)
{
Line myLine = new Line(); myLine.X1 = ;
myLine.Y1 = ;
myLine.X2 = ;
myLine.Y2 = ; myLine.Stroke = new SolidColorBrush(Color.FromArgb(, , , ));
myLine.Fill = new SolidColorBrush(Color.FromArgb(, , , )); // 把矩形加入到Canvas中
this.cnsDesignerContainer.Children.Add(myLine); // 创建二个double型的动画,并设定播放时间为2秒
Duration duration = new Duration(TimeSpan.FromSeconds());
DoubleAnimation myDoubleAnimation1 = new DoubleAnimation();
DoubleAnimation myDoubleAnimation2 = new DoubleAnimation(); myDoubleAnimation1.Duration = duration;
myDoubleAnimation2.Duration = duration; // 创建故事版,并加入上面的二个double型动画
Storyboard sb = new Storyboard();
sb.Duration = duration; sb.Children.Add(myDoubleAnimation1);
sb.Children.Add(myDoubleAnimation2); // 设置动画的Target目标值
Storyboard.SetTarget(myDoubleAnimation1, myLine);
Storyboard.SetTarget(myDoubleAnimation2, myLine); // 设置动画的变化属性
Storyboard.SetTargetProperty(myDoubleAnimation1, new PropertyPath("(X2)"));
Storyboard.SetTargetProperty(myDoubleAnimation2, new PropertyPath("(Y2)")); myDoubleAnimation1.To = ;
myDoubleAnimation2.To = ; if (!cnsDesignerContainer.Resources.Contains("unique_id"))
{
// 将动画版加入Canvas资源,注意:这里的unique_id必须是资源中没有的唯一键
cnsDesignerContainer.Resources.Add("unique_id", sb);
sb.Completed += new EventHandler(sb_Completed); // 播放
sb.Begin();
}
else
{
sb = null;
cnsDesignerContainer.Children.Remove(myLine);
}
} void sb_Completed(object sender, EventArgs e)
{
// 播放完成后,移除资源,否则再次点击时将报错
cnsDesignerContainer.Resources.Remove("unique_id");
}

显示的效果正是画线的动画显示方式。

Silverlight动画显示Line线的更多相关文章

  1. Silverlight 动画详解

    Animation规则 基于时间:你设置动画的初始状态,最终状态,及持续时间,Silverlight会计算帧速率. 作用于属性(properties):一个Silverlight动画只能做一件事情,在 ...

  2. cocos2dx 动画显示异常

    最近遇到一个问题 好多cocostudio导出的动画 显示都会有异常 很明显的融合方式 把混合方式里面的 src 改成one dst 改成 one-src alpha 解决 后面附上同行的文章 浅显易 ...

  3. Js&lowbar;动画显示背景图片

    jAni是一个可以动画显示背景图片的jQuery插件.这个插件基本上是GIF动画的一个替代品,但是他有他的好处.所有浏览器都支持GIF形式的动画格式,而且也不需要额外的javaScript代码和标记. ...

  4. notepad&plus;&plus;搜索结果不显示line XX的方法

    在使用notepad++如果多次搜索,得到的结果中会出现多次line xx: line xx:,造成文件大量垃圾信息的存在,不利于找寻所需的内容,如下图.                对于这种情况, ...

  5. 基于css3的鼠标经过动画显示详情特效

    之前为大家分享过一款基于jquery的手风琴显示详情,今天给大家分享基于css3的鼠标经过动画显示详情特效.这款实例鼠标经过的时候基于中间动画放大,效果非常不错,效果图如下: 在线预览   源码下载 ...

  6. silverlight DataGrid 显示篇

    silverlight DataGrid 显示篇 分类: Silverlight2012-05-12 21:55 693人阅读 评论(0) 收藏 举报 datagridsilverlightbindi ...

  7. js进阶 13-3 jquery动画显示隐藏,滑动,淡入淡出的本质是什么

    js进阶 13-3 jquery动画显示隐藏,滑动,淡入淡出的本质是什么 一.总结 一句话总结:分别改变display,高度,opacity透明度这三种属性. 1.fade系列函数有哪四个? fade ...

  8. WPF 动画显示控件

    当我们要显示一个控件的时候,不仅仅要显示这个控件,还要有动画的效果. 主要用到了DoubleAnimation类. public static void ShowAnimation(object co ...

  9. 可以正确显示表格线的Grid item view

    Android上要显示一个表格,没有Swing那么专门的JTable可用. 搜了下,一般用GridView,有诸多不便和需要自己实现的地方: 跟ListView一样的Adapter,getView的时 ...

随机推荐

  1. 【java基础学习二】 数组相互转换&comma;转成用逗号隔开的字符串等

    /** * int[],Integer[],List,List<Integer>,HashSet<Integer>相互转换,转成用逗号隔开的字符串 */ public stat ...

  2. &lbrack;转&rsqb;Ubuntu 16&period;04建议安装

    Ubuntu 16.04发布了,带来了很多新特性,同样也依然带着很多不习惯的东西,所以装完系统后还要进行一系列的优化. 1.删除libreoffice libreoffice虽然是开源的,但是Java ...

  3. Ubuntu 查看&sol;修改文件编码

    使用enca工具可以查看和修改文件编码 1.安装 sudo apt-get install enca 2.使用 查看文件编码 enca –L zh_CN file_name 修改文件编码 enca – ...

  4. C&plus;&plus;编译器的函数名修饰规则

    我们知道在C++中有函数重载这样一个东西,当我们定义了几个功能类似且函数名是一样的函数的时候,只要它的参数列表不同,编译是可以通过的,但是在C中是不可以的. double add(double a, ...

  5. 新安装的mysql必须调整的10项配置

    还在为新安装的mysql服务,不知道修改哪些默认配置而发愁吗?mysql可调整参数有100多个,到底要立即!马上!调整哪些最重要的参数? 网络神贴答复你: 这篇文章主要介绍了MySQL优化必须调整的1 ...

  6. oc 是否允许远程通知

    UIUserNotificationSettings *setting = [[UIApplication sharedApplication] currentUserNotificationSett ...

  7. 理解OAuth2&period;0认证

    一.什么是OAuth协议 OAuth 协议为用户资源的授权提供了一个安全的.开放而又简易的标准.与以往的授权方式不同之处是 OAuth的授权不会使第三方触及到用户的帐号信息(如用户名与密码),即第三方 ...

  8. Java实现生产者与消费者模式

    生产者不断向队列中添加数据,消费者不断从队列中获取数据.如果队列满了,则生产者不能添加数据:如果队列为空,则消费者不能获取数据.借助实现了BlockingQueue接口的LinkedBlockingQ ...

  9. Windows system 在python文件操作时的路径表示方法

    file_path =(r'i:\vacpy\ch10\pi_digits.txt') #将文件路径存储在变量file_path中with open (file_path) as file_objec ...

  10. C语言setjmp用法解析

    https://www.cnblogs.com/hbiner/p/3261437.html