C

Qt Quick Ultralite 加载器示例

演示如何使用 Loader QML 类型。

概述

loader 示例展示了如何使用 Loader QML 类型。

它实现了一个简单的记忆游戏。玩家必须按照屏幕上出现的顺序点击颜色。当玩家点击错误颜色时，游戏结束。当顺序中的最后一个颜色被点击时，最佳得分更新，并开始新一轮。

应用 UI

应用由三个页面组成

  • 标志
  • 记忆游戏
  • 设置

应用的主视图实现为一个 loader，这确保了 RAM 中仅存储一个页面。

每当按下每一侧的按钮时，loader 的源代码都会更改为对应页面的源。

    Loader {
        id: mainView

        anchors.fill: parent
        source: "Logo.qml"

        Connections {
            target: root
            function onCurrentPageChanged(currentPage: int) {
                if (currentPage === 0) {
                    mainView.source = "memory_game/MemoryGame.qml"
                } else if (currentPage === 1) {
                    mainView.source = "settings/Settings.qml"
                    GameState.running = false
                }
            }
        }
    }
标志页面

标志页面显示一个简介图片。它在应用的开始只出现一次。

记忆游戏页面

记忆游戏分为两部分，显示和控制系统。在游戏的一开始，展示部分用来显示玩家必须记住的颜色。

展示部分还包含统计数据、当前得分和最佳得分。

控制系统部分是一排颜色按钮，玩家必须按照正确的顺序点击。

Rectangle {
    id: root

    color: SettingsData.backgroundColor

    Item {
        id: positioningWrapper

        anchors { fill: parent; leftMargin: parent.width/10; rightMargin: parent.width/10; }

        GameWindow {
            anchors { left: parent.left; top: parent.top; right: parent.right; bottom: gameControls.top }
        }

        ColorButtons {
            id: gameControls

            anchors { bottom: parent.bottom; horizontalCenter: parent.horizontalCenter }
            width: parent.width
            height: width * 0.2
        }

        StatsOverlay {
            anchors { left: parent.left; right: parent.right; }
        }
    }
}

设置页面

设置页面允许用户调整应用的背景颜色，并更改游戏的难度级别。

项目结构

主应用

主应用程序窗口在 loader.qml 中定义

记忆游戏

游戏 UI 由 loader/memory_game 目录中的 QML 文件定义

模块

loader 示例定义了两个模块

  • SettingsData
  • GameState

SettingsData 模块存储应用设置，如背景颜色或难度级别。

GameState 模块用于控制游戏。

这两个模块都被用作加载项目之间的通信手段。

文件

图片

另请参阅与已加载项的通信.

在特定Qt许可证下可用。
了解更多信息。