31、构建用户界面的多种技术与实现方法

构建用户界面的多种技术与实现方法

在构建用户界面时，有许多技术和方法可以实现不同的效果和功能。下面将详细介绍动画过渡、实时绘制图形、添加屏幕键盘以及使用模块组织用户界面代码等方面的内容。

1. 动画过渡

当容器的时钟达到其持续时间时， onFinished 事件会被触发，这意味着动画序列完成。以下是相关代码示例：

onTimeChanged(container) {
    let time = container.time;
    if (this.reverse)  
        time = container.duration - time;
    this.timeline.seekTo(time);
}
onFinished(container) {
    this.reverse = !this.reverse;
    this.timeline.seekTo(0);
    container.time = 0;
    container.start();
}

Piu Transition 类提供了另一种实现动画的方法，常用于在包含层次结构中交换内容对象，例如在屏幕之间切换。这里主要介绍内置的擦除（wipe）和梳状（comb）过渡，它们是 Transition 类的子类。与修改内容对象属性的时间线动画不同，擦除和梳状过渡是纯粹的图形操作，作用于显示屏的像素。由于它们经过优化，可最小化每一帧中绘制的像素数量，因此即使在 ESP8266 微控制器上也能实现高帧率。

要使用擦除和梳状过渡类，需要从模块