博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
[Windows Phone]AnimationHelper管理分散的Storyboard
阅读量:6851 次
发布时间:2019-06-26

本文共 4166 字,大约阅读时间需要 13 分钟。

问题描述:

在Windows Phone开发时候,可能存在这样的问题:

某一个控件需要一个特定的展现(这里假定是一个特定动画),那么我们会这么解决这个问题呢?

打开Blend,根据需求需求给控件添加动画,Building,Runing,任务完成。

过了一段时间,在另外一个地方,同样的控件需要同样的动画展现。

此时会有两个做法:

(1).到之前已经完成实现的.xaml中,Copy xaml代码,粘贴到当下需要它的地方,然后做适当修改之后即可使用。

(2).对此需求进行封装,使用UserControl或者自定义控件都可以实现。

显然第一种方法必须坚决杜绝,而要使用第二种方法,让代码可复用,易维护。

现在介绍第三种方法,使用AnimationHelper

 

简介:

AnimationHelper其实只是使用XamlReader加载xaml,生成Storyboard,然后执行.

 

如何使用:

1.使用Blend创建我们需要的Storyboard

 

Storyboard的XAML描述如下:

(显然以上的XAML描述的Storyboard是我们通过Blend创建的满足需求的Storyboard,为了方便维护和重用,我们把它复制到AnimationHelper中)

 

2.创建AnimationHelper类,定义相关方法

a).添加方法,返回值为Storyboard。(如果需要控制动画的执行时间,可以通过参数传入,对XAML稍作修改,通过string.Format拼接到正确的地方)

 

1     public class AnimationHelper 2     { 3         public static Storyboard BtnAnimation(UIElement uiElement) 4         { 5             Storyboard sb = null; 6  7             // Storyboard的XAML描述 8             string templateString = string.Format(@" 9             XAML描述");10 11             // 如果涉及到形状变换,则UIElement的RenderTransform属性需要被赋值,12             // 为了避免在前段XAML忘记定义RenderTransform,所以在这里每一次13             // 都创建RenderTransform14             uiElement.RenderTransform = new CompositeTransform();15 16             // 设置动画锚点17             uiElement.RenderTransformOrigin = new Point(0.5, 0.5);18 19             // 加载XAML20             sb = XamlReader.Load(templateString) as Storyboard;21 22             // 为Storyboard的Children设置作用对象23             foreach (var t in sb.Children)24                 Storyboard.SetTarget(t, uiElement);25 26             return sb;27         }28       }
View Code

 

  

 

b).复制Blend生成的Storyboard,替换上述代码中的"XAML描述"

注意:

(下面把Blend生成的XAML称作原XAML)

<1>把原XAML中的Storyboard.TargetName="xxxx"部分去掉。因为我们将通过方法参数出入Target

<2>正确解析双引号。(在原XAML中,每逢碰到双引号,就在之前再加一个双引号)

<3>加入XAML名字空间。解析XAML时,需要知道它的名字空间,所以我们需要在原XAML中加入它的名字空间。把xmlns=""http://schemas.microsoft.com/winfx/2006/xaml/presentation""加入到Storyboard标签中作为其属性

 

1 public static Storyboard BtnAnimation(UIElement uiElement) 2         { 3             Storyboard sb = null; 4  5             // Storyboard的XAML描述 6             string templateString = string.Format(@" 7         
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
");34 35 // 如果涉及到形状变换,则UIElement的RenderTransform属性需要被赋值,36 // 为了避免在前段XAML忘记定义RenderTransform,所以在这里每一次37 // 都创建RenderTransform38 uiElement.RenderTransform = new CompositeTransform();39 40 // 设置动画锚点41 uiElement.RenderTransformOrigin = new Point(0.5, 0.5);42 43 // 加载XAML44 sb = XamlReader.Load(templateString) as Storyboard;45 46 // 为Storyboard的Children设置作用对象47 foreach (var t in sb.Children)48 Storyboard.SetTarget(t, uiElement);49 50 return sb;51 }
View Code

 

 

3.使用AnimationHelper

在我们需要执行的地方,调用刚定义的方法,传入UI元素

 

1         void button2_Click(object sender, RoutedEventArgs e)2         {3             var sb = AnimationHelper.BtnAnimation(this.button2);4             if (sb != null)5             {6                 sb.Begin();7             }8         }
View Code

 

 

 

 

AnimationHelper优劣分析:

优势:

1.折中的管理零散的Storyboard,无需封装控件,把Storyboard紧紧耦合在控件内,复用简单。

 

不足:

1.把UI逻辑引入了业务逻辑中,违背了MVVM模式设计理念。

2.对于复杂的Storyboard则不太适用(因为双引号太多... 哈哈)

3.调试困难。(那里漏了一个双引号则很难发现)

4.使用XamlReader实时解析XAML,效率较低

 

总结:

从优劣分析中可以看出,不足之处多余优点,所以使用这种方法的时候需要慎重考虑,但是如果用对地方或者用法巧妙也许能规避此解决方案的不足而得到出奇的效果

 

Demo下载:

 

The End.

转载于:https://www.cnblogs.com/hellenism/p/3511448.html

你可能感兴趣的文章
你离BAT之间,只差这一套Java面试题
查看>>
laravel package 推荐,数据备份
查看>>
Synchronized锁在Spring事务管理下,为啥还线程不安全?
查看>>
环境变量PATH cp命令 mv命令 文档查看cat/more/less/head/tail
查看>>
阿里云亮相2019联通合作伙伴大会,边缘计算等3款云产品助力5G时代产业数字化转型...
查看>>
dubbo源码分析-服务端发布流程-笔记
查看>>
阿里云发布Apsara SA系列混合云存储阵列
查看>>
GoJS教程:链接模版
查看>>
QListWidget方式显示缩略图
查看>>
金三银四:蚂蚁金服JAVA后端面试题及答案之二面
查看>>
Ubuntu 外网不通解决方案
查看>>
OSChina 周六乱弹 —— 历史总是惊人的相似
查看>>
MySQL 大小写
查看>>
Lync 2013部署图片赏析-证书服务安装配置
查看>>
HTML5 本地缓存 (web存储)
查看>>
tomcat redis session共享(包含redis安全设置)
查看>>
iptables中DNAT、SNAT和MASQUERADE的作用
查看>>
kvm命令学习记录
查看>>
小菜鸡进阶之路-First week
查看>>
ORACLE 10g SYSAUX表空间快速增长之WRH$_ACTIVE_SESSION_HISTORY篇
查看>>