QML的Logic-Model-View

在 QML 开发中,Logic-Model-View 是一种常见的架构模式。这种模式有助于分离应用的不同逻辑层,使代码更加清晰和易于维护。接下来,我将详细介绍它们之间的关系,以及在 QML 中如何使用这些模块。

  1. View (视图层)

QML 作为声明式 UI 框架,主要用来构建用户界面,即 View 层。它负责展示模型中的数据,并将用户的交互传递给逻辑层。

特点:

•   使用 QML 文件定义界面(如按钮、列表、布局等)。
•   视图和数据是通过模型绑定在一起的(如 ListView 绑定到一个模型)。
•   视图本身不会包含复杂的业务逻辑。

示例:ListView 视图绑定模型

ListView {
    width: 200; height: 300
    model: myModel  // 绑定数据模型

    delegate: Item {
        height: 40
        Text {
            text: modelData  // 展示模型中的数据
        }
    }
}

2. Model (模型层)模型层管理应用中的数据。

QML 支持多种模型,例如:

•   ListModel:适用于静态数据。
•   JS 数组:用 JavaScript 变量管理数据。
•   C++ 数据模型:适用于复杂场景,使用 C++ 提供自定义模型。

特点:

•   模型可以是简单的键值对,或者是复杂的结构。
•   支持通过 notify 信号实现数据的自动更新。

示例:ListModel

ListModel {
    id: myModel
    ListElement { name: "Apple"; price: 10 }
    ListElement { name: "Banana"; price: 5 }
}

示例:JS 数组

var items = [
    { name: "Apple", price: 10 },
    { name: "Banana", price: 5 }
];

3. Logic (逻辑层)逻辑层处理用户的交互和业务逻辑。在 QML 中,这一层通常使用 JavaScript 或 C++ 实现。

特点:

•   响应用户的操作(如按钮点击、滑动等)。
•   更新模型中的数据。
•   可以与 C++ 后端逻辑通信(如网络请求、数据库操作)。

示例:逻辑层使用 JavaScript

Button {
    text: "Add Item"
    onClicked: {
        myModel.append({ name: "Orange", price: 8 })  // 动态更新模型
    }
}

C++ 实现逻辑层:你可以使用 C++ 定义业务逻辑并通过 QML Context 将 C++ 对象暴露给 QML。
示例:将 C++ 对象暴露给 QML

QList<QVariant> data = { QVariant::fromValue(Item("Apple", 10)) };
QQmlApplicationEngine engine;
engine.rootContext()->setContextProperty("myData", QVariant::fromValue(data));
engine.load(QUrl(QStringLiteral("qrc:/main.qml")));

Logic-Model-View 三者之间的关系

1.  View:展示模型数据,并将用户交互传递给逻辑层。
2.  Model:存储和管理数据,并将更新反馈给视图层(通常通过绑定)。
3.  Logic:处理用户输入或事件,并更新模型中的数据。

数据流示例:

1.  用户点击按钮(事件发生在 View 层)。
2.  逻辑层(JavaScript 或 C++)捕获事件,并更新数据模型。
3.  数据模型通知 View 更新,UI 自动刷新。

总结

•   View (视图层):用 QML 定义,负责 UI 和交互。
•   Model (模型层):管理数据,支持通过绑定更新 UI。
•   Logic (逻辑层):实现业务逻辑,使用 JS 或 C++。

这种分层结构使得代码模块化和职责明确。你可以根据项目需求,将复杂逻辑封装在 C++ 中,并通过模型和 QML 进行交互,使代码更易于维护和扩展。

关于Zeno Chen

本人涉及的领域较多,杂而不精 程序设计语言: Perl, Java, PHP, Python; 数据库系统: MySQL,Oracle; 偶尔做做电路板的开发,主攻STM32单片机
此条目发表在C/C++分类目录。将固定链接加入收藏夹。