【QML COOK】- 008-自定义属性

前面介绍了用C++定义QML类型,通常在使用Qt Quick开发项目时,C++定义后端数据类型,前端则完全使用QML实现。而QML类型或Qt Quick中的类型时不免需要为对象增加一些属性,本篇就来介绍如何自定义属性。

  1. 创建项目,并编辑Main.qml
javascript 复制代码
import QtQuick

Window {
    width: 640
    height: 480
    visible: true
    title: qsTr("Hello World")

    MouseArea {
        anchors.fill: parent
        onClicked: {
            sender.aInt += 1
        }
    }

    Item {
        id: sender
        property int aInt

        onAIntChanged:() =>  {
                        console.log("Sender Now aInt is :", aInt)
                     }
    }

    Item {
        id: receiver

        Connections {
            target: sender
            function onAIntChanged(message : string) {
               console.log("Receiver Now aInt is :", sender.aInt)
            }
        }
    }
}
  • 在sender对象中通过关键字property创建了一个int类型的aInt属性
  • 定义属性后QML会自动定义一个槽名为onXXXXChanged。因此结合上篇介绍的槽的相关内容,我们就可以在本对象和其他对象中监控自定义属性的变化了
  1. 执行程序

在窗口中点击鼠标便可以在Qt Creator中看到如下Log了

相关推荐
布莱克60513 小时前
QtWidgets 与 QML:两大 UI 开发框架的全面对比
开发语言·c++·qt·ui·架构
qq_4017004115 小时前
Qt 实时大数据量存储:自己动手实现 TDMS 读写
数据库·qt
NiceBlueChai15 小时前
Qt 跨线程传递多容器嵌套结构:一次 Release 实测
开发语言·qt
扶尔魔ocy15 小时前
【QT android】模仿行车记录仪案例
android·qt
zhanghaha13141 天前
Qt 类本质就是 C++ 的类,只是 Qt 框架扩展了一套【QObject 对象模型】
qt
Cx330❀1 天前
深入浅出 Qt 绘图机制:从 QPainter 到四大图像类解析
开发语言·qt·ui·性能优化·图形渲染
Littlehero_1212 天前
QT自定义控件之水泥厂组态(源码开源)
开发语言·qt
代钦塔拉2 天前
【C++/Qt 进阶】设计模式系列(6):桥接模式——把“两个独立变化的维度“拆开
c++·qt·设计模式
156082072192 天前
银河麒麟 Qt 可执行文件打包说明
开发语言·驱动开发·qt
Quz2 天前
QML GridView 布局:网格排布与排列方向
qt