【Qt6 QML Book 基础】14：常规模式 2 - 滑动视图（附完整可运行代码）

引言

在现代应用程序的设计中，滑动视图（SwipeView）是一种极为常见且实用的交互模式。它允许用户通过左右滑动屏幕来切换不同的页面，为用户提供了流畅、直观的导航体验。在 Qt Quick 中，SwipeView组件正是实现这一交互模式的核心工具。本文将详细介绍如何使用SwipeView组件构建一个包含多个页面的滑动视图应用，并通过PageIndicator组件为用户提供当前页面的指示。

一、运行效果图

1.1 整体布局

该应用由三个页面组成，分别为 “当前页”、“用户统计” 和 “总体统计”。用户可以通过左右滑动屏幕来切换不同的页面。

1.2 当前页

当前页显示了 “当前页激活” 的提示信息，页面顶部有一个标题，底部有一个分页指示器，用于指示当前页面的位置。

1.3 总体统计页

总体统计页显示了 “总体统计数据” 的信息，并且包含一个 “返回” 按钮，点击该按钮可以直接返回至第一页。

二、滑动视图

2.1 交互流程

我们创建一个由三个页面组成的用户界面，用户可以在这些页面之间切换。这些页面如下图所示。这可能是健康跟踪应用程序的界面，跟踪当前状态、用户的统计数据和整体统计数据。