彩票走势图

Dundas Dashboard的Animator控件介绍

原创|其它|编辑:郝浩|2012-08-31 16:31:30.000|阅读 173 次

概述:Animator控件可以让你在仪表盘上定义动画,可以动态的调整目标控件(比如一个图表或椭圆)的属性值。举个例子,你可以使用animator控件让你的图表实现淡入显示,这可以通过设置图表的Opacity属性实现。

# 慧都年终大促·界面/图表报表/文档/IDE等千款热门软控件火热促销中 >>

Animator控件可以让你在仪表盘上定义动画,可以动态的调整目标控件(比如一个图表或椭圆)的属性值。举个例子,你可以使用animator控件让你的图表实现淡入显示,这可以通过设置图表的Opacity属性实现。

用法

Getting started!

要使用这个插件,需将它安装在Dundas Dashboard服务器上,然后重启IIS。一旦安装以后,Animator就会出现在Dundas Dashboard工具栏中。和其他控件一样,可以拖拽Animator项到仪表盘画板上。Animator可以让你在设计时创建和管理动画(如时间线)对象,但在预览或查看仪表盘时它不会出现。

DundasDashboard,仪表盘,附加组件,动画

使用DoubleAnimation

DashboardDoubleAnimation项可以让你为仪表盘控件加上一个double类型的动画属性。

下面这个例子展示了当仪表盘被预览和查看时,如何设置一个图表为淡入的效果:

1.选择图表控件 (BarChart1),到它的属性窗口,然后设置高级属性Opacity为0.2;
2.拖放一个animator控件到画板上,然后将它放在图表的旁边;
3.选择动画控件然后到属性窗口。找到Children属性,单击ellipsis按钮。

DundasDashboard,仪表盘,附加组件,动画

4.Children属性对话框里没有动画显示,所以单击列表左下角的Add按钮,添加一个DashboardDoubleAnimation实例。动画的属性就会显示在右边。

DundasDashboard,仪表盘,附加组件,动画

5.设置动画的属性:

  • 设置Duration为00:00:05(表示持续时间为5秒);
  • 设置End Value为1.0(表示最终透明度值);
  • 设置Increment By为0.8(表示透明度值的总体增长量);
  • 设置Start Value为0.2(表示初始透明度值);
  • 设置Target Name为 BarChart1(表示动画控件的名字);
  • 设置Target Property Name为Opacity(表示动画属性)。

6.Name属性给出了一个默认值(比如“DoubleAnimation1”),但是你可以选择一个更有意义的名字来描述动画,例如"FadeIn"或"FadeOut"。

Animator对象现在已经配置好了,但没有显示出来,直到动画通过一行脚本启动时才会显示。你可以从任何交互中调用这行脚本,比如单击某个按钮。在下面这个例子中,仪表盘被查看时动画将会启动:

1.选择仪表盘(画板),然后到属性窗口;
2.找到On Load Interactions属性,单击它的ellipsis按钮;
3.在On Load Interactions属性窗口,单击列表左下角的Add按钮,那么一个DundasScript交互就添加完成;
4.找到Script属性,单击它的ellipsis按钮。

DundasDashboard,仪表盘,附加组件,动画

5.在Script Editor窗口,添加以下一行代码,然后单击Save:

Animator1.Begin("DoubleAnimation1");

你可以保存并预览你的仪表盘,会看到条形图的淡入动画效果为我们设定的5秒钟。除了Opacity,其他可以做成动画的double属性有: Height, HoverDelay, Left, MaxHeight, MaxWidth, MinHeight, MinWidth, RotationAngle, Top和Width。

重用动画

如果你已经定义了一个动画,你可以将它重用到另一个目标控件或属性上,通过调用动画控件不同版本的Begin方法。

举个例子,假设你已经定义了一个名为DoubleAnimation1的动画,使Rectangle1的Height属性动起来。要启动这个动画,只需调用以下脚本:

Animator1.Begin("DoubleAnimation1");

或者,使用以下脚本应用同样的动画到另一个同样有Height属性的控件:

Animator1.Begin("DoubleAnimation1", Ellipse1);

使用以下脚本应用同样的动画到另一个同样是double类型的控件或属性:

Animator1.Begin("DoubleAnimation1", Ellipse1, "Width");

使用Storyboard

DashboardStoryboard对象让你创建一个包含子DashboardDoubleAnimation和子DashboardStoryboard实体的复合动画。

创建一个Storyboard动画:

1.选择animator控件,到属性窗口,找到 Children属性单击它的ellipsis按钮。
2.在Children属性窗口,单击Add按钮的下拉菜单,从这个菜单中,选择Storyboard。

DundasDashboard,仪表盘,附加组件,动画

3.Storyboard动画添加到左边列表之后,它的属性会显示在右边。

DundasDashboard,仪表盘,附加组件,动画

4.使用storyboard的Children属性定义一个或多个double animations 或 storyboards作为child实体。
5.Name属性给出了一个默认值(如 Storyboard1),但你可以自己选择一个更有意义的可以描述整个动画的名字。

小提示:对于一个storyboard动画来说, Duration属性通常设置为Automatic,因为整个动画的时间是由它的子动画来决定的。

交互

DashboardTimeline对象比如double animations和storyboards有以下高级交互属性:

  • Begin Interactions-这些是动画启动前开始执行的脚本。
  • Completed Interactions -这些是动画播放完后执行的脚本。

用法实例:

  • 假设你已经定义了一个淡入动画,增加了目标控件的透明度,最开始这个控件不可见,那么你可以添加一个开始交互以确保目标控件在淡入效果开始前是可见的。
  • 假设你已经定义了一个淡出动画,降低了目标控件的透明度,那么你可以添加一个完成交互以确保目标控件淡出效果完成以后不可见(如隐藏)。

标签:

本站文章除注明转载外,均为本站原创或翻译。欢迎任何形式的转载,但请务必注明出处、不得修改原文相关链接,如果存在内容上的异议请邮件反馈至chenjj@pclwef.cn

文章转载自:慧都控件

为你推荐

  • 推荐视频
  • 推荐活动
  • 推荐产品
  • 推荐文章
  • 慧都慧问
扫码咨询


添加微信 立即咨询

电话咨询

客服热线
023-68661681

TOP