动画
" o/ `& q. S0 {" C, W( K1 n1 S. f对于TouchGFX来说，动画的类型比较简单，但正是简单的动画方式才可以多重组合，形成复杂的动画效果。TouchGFX动画主要有位置移动、透明度转化、图片轮播、以及3D场景动画。接下来为大家介绍每种动画的特点及使用方法。
9 b  F# Y4 C: X
动画类型
! }0 y( R7 {/ r2 r位置移动：
6 o3 x& B$ d! `3 L, H9 H! AMoveAnimator类 用于移动控件的类，要使用该动画时在Box小部件上的TouchGFX Designer中启用Move Animator混合。在代码上启动该种动画的方法如下：
" _; c. a6 \' F) E$ n% G; ^; O

1. scalableImage1.startMoveAnimation(136,100,100);
   0 o8 `% U% }" r

复制代码

" ?5 A7 z+ V3 Y! Z: C6 f" q8 O9 H同时也可以设置一个动画结束时的回调函数，如下所示：

1. class Screen1View : public Screen1ViewBase
   1 e4 _% T- T5 }* m" {) L4 I
2. {
   
3. public:
   , K3 G0 i& q; R- Y% K
4.     Screen1View();
   
5.     // Declaring callback handler for move animation ended on a Box
   4 r. B5 ~! Z9 t% i. C6 ^
6.     void boxMoveAnimationEndedHandler(const touchgfx::MoveAnimator<Box>& comp);
   , ~# M/ @" u$ R3 |
7. 
   
8. protected:
   
9.     // Declaring callback type of MoveAnimator<Box>
   ( i3 ]# I: k/ I; q& j, @3 H1 E5 Y
10.     Callback <Screen1View, const touchgfx::MoveAnimator<Box>&> boxMoveAnimationEndedCallback;
    ) t! D6 j9 U2 O( l- f7 _( s& X# c) H
11. };
    

复制代码

1. Screen1View::Screen1View() :
   
2.   // In constructor for callback, bind to this view object and bind which function to handle the event.
   
3.   boxMoveAnimationEndedCallback(this, &Screen1View::boxMoveAnimationEndedHandler) { }
   

复制代码

1. void Screen1View::setupScreen()
   7 P4 k& P- S; I  a7 x
2. {
   
3.   // Add the callback to box
   % m  p! i4 L5 T& j
4.   box.setMoveAnimationEndedAction(boxMoveAnimationEndedCallback);
   
5. }
   

复制代码

' t# b  h( e1 |' R. k5 |: k这种添加回调的方式在TouchGFX上使用的很多之后可以通过API查找应用。

1 I0 `% Y  |# X, v% q透明度转化：
2 a) k  o. J" E; KFadeAnimator类用于将控件的透明度进行调整，这个动画可以实现动态半透明效果，例如光照之类。
使用方法如下：
  s6 p( {1 f( ^- s" Z6 K: d0 G; N

1. m_Image.startFadeAnimation(255, 100);
   1 h4 \8 T" Z  Z

复制代码

当然FadeAnimator类也有回调函数，再此不做过多介绍。

9 G$ j- |5 {2 A( Z% j1 [
图片轮播：
2 u5 X" E  r; n  {6 ?+ {! v8 rAnimatedImage类用于多张图片的轮播，该类也被封装成了一种小控件，在TouchGFX designer中能看见该类。该动画的属性有暂停以及开始停止。
4 u: X* D- ~2 M) j5 C+ x

1. animatedImage.startAnimation(false, true, true);
     n- a" r9 F! ^% ]3 X7 T1 q

复制代码

startAnimation函数参数说明如下：
virtual void startAnimation ( const bool rev ,
const bool reset =false,
# B. C0 M+ K: i+ Bconst bool loop =false
: C, K; F3 R$ p* z* n1 f) F  [)
6 N, n/ p/ l$ S8 V$ GStarts the animation with the given parameters for animation direction, normal or reverse, whether to restart the animation and finally if the animation should loop automatically upon completion.
Parameters:
) e: n! l. Z2 A4 O5 X8 q8 ?2 erev Defines if the animation should be performed in reverse order.
reset (Optional) Defines if the animation should reset and start from the first (or last if reverse order) bitmap.
7 E5 x1 u2 D) o1 T/ F2 M2 S6 Qloop (Optional) Defines if the animation should loop or do a single animation.

3D场景动画：
2 [, e5 @- E9 M) ItextureMapper类可以用作3D场景的动作，但虽然叫做3D场景，并不是将图像立体化做处理，而是通过将图像变形来展示3D的状态。所以使用的还是CPU的计算。
对于该类的使用建议大家看看官方的API说明。
: _% E  @4 S% K4 E' [3 n
" i! a- d/ K; _2 n/ u动画延时和动画速度
0 ^" }5 o2 u( h; b% F有些动画在移动的过程中会有从起始点到结束点的时间，除此之外还有一定时间后开始动画的操作。
8 }+ u5 B2 b5 h/ p& j接下来要说一说这些操作。
! {0 j4 U# b; ]6 X/ kvoid startMoveAnimation ( int16_t endX ,
9 u) d4 `: W( g* Bint16_t endY ,
' P- m/ [2 N+ r) o  q% x) J9 B( ]uint16_t duration ,
EasingEquation xProgressionEquation =&EasingEquations::linearEaseNone,
EasingEquation yProgressionEquation =&EasingEquations::linearEaseNone
)
1 H2 g/ {; i3 u6 o% L6 f将动画从当前位置开始移动到指定的结束位置。

% @% ?7 C, M- K: T7 P0 _" M
动画过程中位置（X，Y）的展开由提供的EasingEquations描述。如果未给出缓和方程，则移动将线性执行。

6 X0 h* u  I" G' R- a) M7 ~5 @7 ?; P
  u" @4 e3 `. X+ k9 N4 B参数：
endX 动画结束时的X位置。
endY 动画结束时的Y位置。
3 V2 v* E8 z' _, M1 F* A; Kduration 动画的持续时间，以刻度为单位。
0 o3 V# e+ `$ v- u2 MxProgressionEquation （可选）描述动画期间X位置的发展的等式。默认值为EasingEquations :: linearEaseNone。
& c1 \) _9 i/ {8 d( E* I  l; z( ZyProgressionEquation （可选）描述动画期间Y位置的发展的等式。默认值为EasingEquations :: linearEaseNone。

; p. x" x* n; _, o
这其中duration 是动画运动保持的时间，但是输入的参数并不是毫秒数或者秒数，而是TouchGFX的tick数。
virtual void setMoveAnimationDelay ( uint16_t delay )
( j4 o& E1 K# r- n$ i9 y设置一定时间后进行移动动画。

7 v& z$ \, t6 V- m% `5 `4 |. \Parameters:
delay 延时的tick数。
7 e1 ^, C  w% ]/ l* R3 _
由此可以看出用于计算动画帧数及动作的的周期是根据系统的TouchGFX的tick周期决定的，也就是说影响动画卡顿的条件之一就是tick的周期。除此之外还有动画刷新幅度的大小。随着大小不一刷新的速度不一致。
在嵌入式板子中如果需要使用动画那就要根据主tick中的业务逻辑进行调整，保证每次tick运行时间接近，以防动画卡顿。


总结
用动画时可以多考虑组合动画来达到想要的目的。总的来说动画的使用是用于嵌入式UI开发的点缀，如果将动画看作卖点的化真的就是画蛇添足了。
————————————————
版权声明：空闲的程序员


; W/ w' W9 v. J% W