动画开发指导

使用场景

UI动画通过task处理机制每个tick调用一下用户设置的callback函数来实现，具体实现为AnimatorManager、Animator、AnimatorCallback三个类实现。

  • AnimatorManager：AnimatorManager为单例，在Init函数执行时将自己注册到系统task回调函数中，系统task机制保证每个tick会调用一下AnimatorManager的callback函数，同时AnimatorManager用来管理Animator实例。
  • Animator：Animator中可以设置动画相关的属性，包括动画的起止时间，动画开始和停止，动画状态的设置和获取等。
  • AnimatorCallback：具体每一个tick动画所要做的内容在AnimatorCallback类中实现，开发者需要自己实现Callback方法，动画执行时在Callback实现相应功能。

接口说明

表 1 动画接口说明

子模块 方法 功能
Animator void Start () 动画开始
Animator void Stop () 动画停止
Animator void Pause () 动画暂停
Animator void Resume () 动画恢复
Animator uint8_t GetState () const 获取动画当前状态
Animator void SetState (uint8_t state) 设置动画当前状态
Animator uint32_t GetTime () const 获取动画总持续时间
Animator void SetTime (uint32_t time) 设置动画总持续时间
Animator uint32_t GetRunTime () const 获取动画当前已经持续的时间
Animator void SetRunTime (uint32_t runTime) 设置动画当前已经持续的时间
Animator bool IsRepeat () const 获取动画是否循环播放
AnimatorCallback virtual void Callback (UIView view)=0 由用户实现，动画回调函数
AnimatorCallback virtual void OnStop(UIView& view) {} 由用户实现，动画停止后的回调函数
AnimatorManager static AnimatorManager GetInstance() 获取AnimatorManager实例
AnimatorManager void Add (Animator animator) 添加动画
AnimatorManager void Remove(const Animator animator); 删除动画

开发步骤

  1. 实现AnimatorCallback的回调函数。

```

  1. class AnimatorCallbackDemo : public OHOS::AnimatorCallback {
  2. public:
  3. AnimatorCallbackDemo(int16_t startPos, int16_t endPos, uint16_t time)

  4. : start_(startPos), end_(endPos), time_(time), curTime_(0) {}

  5. virtual void Callback(OHOS::UIView* view)

  6. {
  7. curTime_++;
  8. int16_t pos = EasingEquation::CubicEaseIn(start_, end_, curTime_, time_);
  9. view->Invalidate();
  10. view->SetPosition(pos, view->GetY());
  11. view->Invalidate();
  12. }
  13. protected:
  14. int16_t start_;
  15. int16_t end_;
  16. uint16_t time_;
  17. uint16_t curTime_;
  18. }; ```
  19. 将AnimatorCallback添加到Animator中。

```

  1. UIImageView* image = new UIImageView();
  2. image->SetSrc("..\config\images\A021_001.bin");
  3. image->SetPosition(0, 50);
  4. AnimatorCallbackDemo* callback = new AnimatorCallbackDemo(0, 338, 60);
  5. Animator* animator = new Animator(callback, image, 0, true); ```
  6. 将Animator添加到AnimatorManager中。

```

  1. AnimatorManager::GetInstance()->Add(animator); ```
  2. 点击下图下方的按钮，检查对应的动画运行效果。

图 1 动画实现效果图
动画开发指导 - 图1