应用笔记LAT1212+STM32GUI+TouchGFX+Transition+屏幕切换功能简介

TouchGFX 框架中关于屏幕切换功能，实现了一个 Transition 基类和五个派生类，其关系如下图图 1 所示。其中，Transition 是切屏的抽象基类，定义了屏幕切换期间发生的基本事务。虚函数主要包括：Init（初始化）、tearDown（销毁，切屏完成需要的清理过程）、handleTickEvent（Tick 事件处理函数，主要用于完成切屏的动画效果）、invalidate（失效，用于重绘）等。五个派生类，其中 NoTransition 是最基本的派生类，它没有任何视觉效果，当前屏幕会直接被新屏内容替换。另外四个派生类则具有动画效果：BlockTransition、CoverTransition、SlideTransition 和 WipeTransition。 ### 应用笔记LAT1212+STM32GUI+TouchGFX+Transition+屏幕切换功能简介 #### 一、引言 随着嵌入式系统的发展，用户界面的交互性和美观度变得越来越重要。STM32作为一款广泛应用的微控制器系列，其强大的性能和丰富的资源使得在嵌入式设备上实现复杂且美观的用户界面成为可能。TouchGFX是一款专门为STM32优化的图形用户界面框架，它可以轻松创建高性能、低功耗的图形界面。本篇文章将详细介绍TouchGFX中的屏幕切换功能及其实现机制。 #### 二、TouchGFX屏幕切换功能 ##### 2.1 TouchGFX Transition 类介绍 在TouchGFX框架中，屏幕切换功能主要通过`Transition`类来实现。该类是一个抽象基类，定义了屏幕切换期间发生的基本事务。它包括以下几个关键的虚函数： - **`init()`**：初始化函数，用于准备屏幕切换所需的资源。 - **`tearDown()`**：销毁函数，当屏幕切换完成后进行必要的清理工作。 - **`handleTickEvent()`**：Tick事件处理函数，主要用于完成切屏的动画效果。 - **`invalidate()`**：失效函数，用于触发重绘，确保新屏幕内容正确显示。 此外，TouchGFX还提供了五个派生自`Transition`类的具体类，分别为： 1. **`NoTransition`**：最简单的屏幕切换方式，没有动画效果，直接由旧屏幕内容切换到新屏幕内容。 2. **`BlockTransition`**：将屏幕划分为多个小块，并逐渐随机更新这些块的内容，模拟出一种动态切换的效果。 3. **`CoverTransition`**：新屏幕内容从一个方向移动覆盖旧屏幕内容，直至完全覆盖。 4. **`SlideTransition`**：新屏幕与旧屏幕内容拼接在一起，并从指定方向滑动至最终位置。 5. **`WipeTransition`**：新屏幕内容从一个方向展开，逐渐覆盖旧屏幕内容，类似擦拭效果。 每个派生类都在`handleTickEvent()`函数中实现了各自的动画效果，而`tearDown()`函数则负责清理切屏过程中创建的临时资源。 ##### 2.2 TouchGFX Transition 例程 为了更深入地理解屏幕切换功能，我们可以通过TouchGFX Designer创建一个示例工程来观察具体的实现细节。具体步骤如下： 1. **启动TouchGFX Designer**：运行TouchGFX Designer应用程序。 2. **选择开发板**：通过Select Board Setup选择STM32H735G DK开发板（或其他支持的开发板）。 3. **选择例程**：在众多例程中选择“Transition Example”。 4. **命名应用**：将Application name改为TransitionExample或其他名称。 接下来，我们将对这个例程中的关键代码进行解析，以便更好地理解各个`Transition`子类的具体实现方法。 #### 三、`Transition`类及其派生类详解 ##### 3.1 `NoTransition` - **特点**：直接替换屏幕内容，无任何动画效果。 - **应用场景**：适用于对性能要求极高或者不需要动画效果的情况。 ##### 3.2 `BlockTransition` - **特点**：将屏幕划分为多个小块，随机更新这些块的内容。 - **应用场景**：适合性能有限的MCU，可以在较低的硬件配置下实现较为流畅的过渡效果。 ##### 3.3 `CoverTransition` - **特点**：新屏幕内容从一个方向移动覆盖旧屏幕内容。 - **应用场景**：适用于希望有简单动画效果但又不想占用太多资源的情况。 ##### 3.4 `SlideTransition` - **特点**：新屏幕与旧屏幕内容拼接在一起，并从指定方向滑动至最终位置。 - **应用场景**：适用于希望有平滑过渡效果的应用场景，特别适合于需要展示动态变化的场景。 ##### 3.5 `WipeTransition` - **特点**：新屏幕内容从一个方向展开，逐渐覆盖旧屏幕内容，类似擦拭效果。 - **应用场景**：适用于希望有较复杂动画效果的应用场景，适合于需要展示过渡效果的应用程序。 #### 四、总结 通过本文的介绍，我们可以了解到TouchGFX框架中的屏幕切换功能非常强大且灵活，能够满足不同应用场景的需求。开发者可以根据项目的实际需求选择合适的`Transition`子类，以实现既美观又高效的用户界面。此外，TouchGFX Designer工具也为开发者提供了便捷的操作界面，大大降低了开发难度，使得即使是初学者也能快速上手，开发出高质量的用户界面。