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

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

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

动画过渡

在动画过渡方面，当容器的时钟达到其持续时间时， 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 微控制器上也能