动画效果

我们还是使用前面例子的代码

代码
1 <chart caption='月度销售额' xAxisName='月度' yAxisName='单位(台)' showValues='0' decimals='0' formatNumberScale='0' useRoundEdges='0' baseFont='宋体' baseFontSize='12' >
2 <set label='一月' value='462' />
3 <set label='二月' value='857' />
4 <set label='三月' value='671' alpha='20' />
5 <set label='四月' value='494' />
6 <set label='五月' value='761' />
7 <set label='六月' value='960' />
8


在这里,我们想要实现的效果是,让背景渐变显示出来。那我们需要在上面的代码后面增加如下的代码;
代码
<styles>
<definition>
<style name='testAnim' type='ANIMATION' duration='1' start='0' param="_alpha" />
</definition>
<application>
<apply toObject='Canvas' styles=' testAnim ' />
</application>
</styles>

那好,这个效果是什么呢,就是画布渐变显示,时间为1秒。
那,我如果想让背景从左侧滑入,然后同时是渐变呢,代码又应该怎么写呢?
那我们需要在定义一个样式,比如叫testAnim2,完整的代码如下
代码
1 <styles>
2 <definition>
3 <style name='testAnim2' type='ANIMATION' duration='1' start=' $canvasStartX-30 ' param="_x" />
4 <style name='testAnim' type='ANIMATION' duration='1' start='0' param="_alpha" />
5 </definition>
6 <application>
7 <apply toObject='Canvas' styles='testAnim2,testAnim' />
8 </application>
9 </styles>
10

注意这里我们用了一个宏参数$canvasStartX,大家可以复习一下

2. 自定义动画
我们除了对背景可以进行自定义动画外,我们还可以对图表的任何对象实施动画效果,这里,我们以标题为例。

代码
1 <styles>
2 <definition>
3 <style name='testAnim3' type='ANIMATION' duration='1' start='30' param="_x" Easing="elastic" />
4 </definition>
5 <application>
6 <apply toObject='caption' styles='testAnim3' />
7 </application>
8 </styles>
9

大家可以看到这里的动画效果是弹性的效果-- Easing="elastic" 我们换个值bounce 看看反弹效果是什么 Easing=" bounce "因为这些是动画效果,大家可以自行查看。

使用动画效果我们可以实现 xy轴移动、透明度变化、xy轴缩放、圆周动画 以及5种动画类型选择(Elastic、Bounce、Strong、Regular、none)等
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值