【Qt之Quick模块】5. QML基本类型及示例用法

QML格式

QML基本类型

在 QML 中,有以下基本类型:

  1. int:整数类型。
cpp 复制代码
Rectangle {
    function myFunction() {
        // 输出 debug 信息
        console.log("1+1 =" + (1+1));
    }

    Component.onCompleted: {
        myFunction();
    }
}

结果:

  1. real:浮点类型。

  2. double:双精度浮点类型。

  3. string:字符串类型。

cpp 复制代码
Rectangle {
    function myFunction() {
        // 输出 debug 信息
        console.log("helloworld");
    }

    Component.onCompleted: {
        myFunction();
    }
}

结果:

  1. bool:布尔类型。

  2. color:颜色类型,用于表示颜色的RGBA值。

  3. var:通用类型,可以表示任意类型的数据。

cpp 复制代码
    Item {
        property var myVar: "Hello World"

        Component.onCompleted: {
            console.log(myVar) // 输出 "Hello World" 到控制台
        }
    }

结果:

  1. date:日期类型。
cpp 复制代码
Rectangle {
    Item {
        property var currentDate: new Date()

        Component.onCompleted: {
            console.log(currentDate.toString()) // 输出当前日期和时间到控制台
        }
    }
}

结果:

  1. point:点类型,用于表示二维空间中的点。
cpp 复制代码
Item {
    width: 200
    height: 200

    property var point: Qt.point(50, 100)

    Component.onCompleted: {
        console.log(point.x, point.y) // 输出点对象的坐标值到控制台
    }
}

结果:

  1. size:尺寸类型,用于表示宽度和高度。
cpp 复制代码
Item {
    width: 200
    height: 200

    property size var_size: Qt.size(0, 2)

    Component.onCompleted: {
        console.log(var_size) // 输出点对象的坐标值到控制台
    }
}

结果:

  1. rect:矩形类型,用于表示矩形区域的左上角坐标和宽高。
cpp 复制代码
Item {
    width: 200
    height: 200

    property rect var_rect: Qt.rect(0, 0, 1, 2)

    Component.onCompleted: {
        console.log(var_rect) // 输出点对象的坐标值到控制台
    }
}

结果:

相关推荐
枫叶丹41 分钟前
【Qt开发】布局管理器(五)-> QSpacerItem 控件
开发语言·数据库·c++·qt
OpenTiny社区1 分钟前
不止按钮和表格!TinyVue 偷偷上线 Space 组件,直接搞定「弹性+间距」布局
前端·vue.js·github
_OP_CHEN5 分钟前
C++进阶:(八)基于红黑树泛型封装实现 map 与 set 容器
开发语言·c++·stl·set·map·红黑树·泛型编程
FogLetter8 分钟前
Vue 全家桶深度探索:从语法精要到项目实战
前端·vue.js
木易士心9 分钟前
Vue 3 Props 响应式深度解析:从原理到最佳实践
前端
FogLetter10 分钟前
从零实现一个低代码编辑器:揭秘可视化搭建的核心原理
前端·react.js·低代码
花归去11 分钟前
vue甘特图
前端·javascript·vue.js
C1161113 分钟前
Jupyter中选择不同的python 虚拟环境
开发语言·人工智能·python
进击的野人15 分钟前
CSS 定位详解:从文档流到五种定位方式
前端·css
李瑞丰_liruifengv15 分钟前
使用 Claude Agent SDK 开发一个 Agent 原来这么简单
前端·javascript·agent