QML
QML开发知识
Qt君
生命不息,奋斗不止!
展开
-
Qml定时器与匿名函数
本文介绍如何使用Qml定时器与js的匿名函数的结合,解决定时器的繁杂操作。原创 2022-06-21 08:03:05 · 661 阅读 · 0 评论 -
Qml控件之NumberInput数字输入
NumberInput(数字输入)控件是基于Qml实现的,它兼容于QtQuick 1.x和QtQuick 2.x。原创 2021-01-20 21:54:54 · 2574 阅读 · 0 评论 -
Flat风格的Qml范围滑块
基于Qml的RangeSlider控件修改而成。原创 2020-04-09 01:47:59 · 432 阅读 · 0 评论 -
网页版QML
在网页上边写QML代码边显示效果。(文末项目地址)原创 2020-01-17 22:36:11 · 1549 阅读 · 1 评论 -
翻译 | QML编码约定
让你更好地组织QML代码。翻译 2020-01-17 22:38:18 · 339 阅读 · 0 评论 -
Flat风格的Qml滚动选择条
基于Qml的Tumbler控件修改而成。原创 2020-01-08 23:42:38 · 614 阅读 · 0 评论 -
Flat风格的Qml轮选框
基于Qml的SpinBox控件修改而成。原创 2020-01-06 00:41:02 · 557 阅读 · 1 评论 -
qml全局变量定义建议
从C++导入到qml的全局变量和qml定义变量或许有些混淆,使用下列建议或许可以解决全局变量混淆的问题。原创 2020-01-06 00:52:11 · 1835 阅读 · 0 评论 -
QML文件读写控件(预览版)
旨在解决QML不能读写文件的问题。原创 2019-12-23 16:44:20 · 509 阅读 · 0 评论 -
Flat风格的Qml进度条
基于Qml的ProcessBar控件修改而成。原创 2019-12-23 16:44:32 · 508 阅读 · 0 评论 -
Flat风格的Qml滑动条
基于Qml的Slider控件修改而成。原创 2019-12-14 22:48:47 · 406 阅读 · 0 评论 -
QML之Repeater重复器
介绍Repeater重复器的使用方法,应用场景。原创 2019-12-13 23:28:26 · 3526 阅读 · 2 评论 -
Flat风格的Qml组合框
基于Qml的ComboBox控件修改而成。原创 2019-12-07 20:19:29 · 309 阅读 · 0 评论 -
Flat风格的Qml输入框
基于Qml的TextField控件修改而成。原创 2019-11-29 23:12:09 · 637 阅读 · 0 评论 -
Flat风格的Qml开关按钮
可以打开或关闭的开关按钮,使用Qml的Switch控件修改而成。原创 2019-11-22 23:47:33 · 686 阅读 · 0 评论 -
Qml之variant与var对比
为什么Qt Quick 2中变量改为var呢?而不继续使用variant呢?我们看看它们的区别吧。原创 2019-11-21 23:48:03 · 1615 阅读 · 0 评论 -
Flat风格的Qml单选/复选按钮
使用Qml的RadioButton与CheckBox控件修改而成。原创 2019-11-19 22:48:21 · 556 阅读 · 0 评论 -
Flat风格的Qml按钮
使用Qml的Button控件修改而成。原创 2019-11-15 23:58:46 · 683 阅读 · 0 评论 -
发布Qml宏预处理工具
为Qml提供部分简单的预处理命令。原创 2019-11-08 23:37:23 · 981 阅读 · 0 评论 -
兼容Qt4/Qt5版本Qml控件Triangle
三角形控件(Triangle),等腰直角三角形。底是高的两倍。原创 2019-10-24 23:31:21 · 461 阅读 · 0 评论 -
Qml组件小知识
介绍组件构造,销毁,动态加载小知识。原创 2019-10-19 23:55:36 · 393 阅读 · 0 评论 -
兼容Qt4/Qt5版本Qml控件Slider
通过滑动滑块选择一个值导入方法: 文件导入兼容性: QtQuick 1.x与QtQuick 2.x继承: Item属性background: Itemfrom: realhandle: Itemorientation: enumerationposition: realpressed: boolstepSize: realto: realvalue: real...原创 2019-02-23 14:00:10 · 453 阅读 · 0 评论 -
Qml异步加载图片
当图片很大时,加载图片可能导致UI线程的阻塞,为了确保图片在加载过程中不会阻塞UI线程,将Image元素的’asynchronous’设置为trueImage { asynchronous: true source: "test.png"}...原创 2019-02-12 22:52:57 · 2088 阅读 · 0 评论 -
使用lupdate生成Qt的ts翻译文件
1. 通过项目文件生成1.1 方法一项目文件(xxx.pro)需要定义一下方法TRANSLATIONS += en.ts zh_CN.ts命令行执行lupdate xxx.pro1.2 方法二lupdate xxx.pro -ts xxx.ts2. 通过指定文件生成lupdate xxx.cpp -ts xxx.tsxxx.cpp为目标文件;xxx.ts为输...原创 2019-02-18 20:27:03 · 2836 阅读 · 0 评论 -
兼容Qt4/Qt5版本Qml控件ScrollBar
1. ScrollBar演示2. 对外属性继承于Rectangle;target属性继承于Flickable(默认值父控件);orientation设置控件水平还是垂直方向(默认值垂直方向).ScrollBar.qmlimport QtQuick 2.0Rectangle { id: root property Flickable target: par...原创 2019-02-20 10:14:03 · 421 阅读 · 0 评论 -
兼容Qt4/Qt5版本Qml控件CheckBox
复选框显示一个可切换(选中)或关闭(未选中)的选项按钮.导入方法: 文件导入兼容性: QtQuick 1.x与QtQuick 2.x继承: Item属性background: Itemchecked: boolcontentItem: Itemdown: boolindicator: Itempressed: booltext: string描述复选框显示一...原创 2019-02-26 21:55:11 · 461 阅读 · 0 评论 -
Qml的Slider控件示例
通过自定义样式美化Slider原创 2019-03-04 21:28:20 · 2117 阅读 · 0 评论 -
QQmlContext设置上下文
使用QQmlContext类加载qml界面的上下文。翻译 2019-04-03 22:17:38 · 2792 阅读 · 2 评论 -
兼容Qt4/Qt5版本Qml控件TextScroll(文本滚动)
通过设置一个宽度值,当文本过长时自动滚动。原创 2019-03-27 21:31:27 · 951 阅读 · 0 评论 -
刷新QML翻译接口
刷新使用标记为翻译的字符串的所有绑定表达式。原创 2019-04-09 22:02:26 · 512 阅读 · 0 评论 -
兼容Qt4/Qt5版本的QML例程
本篇文章介绍兼容Qt4与Qt5版本的Qml简单例程。由于Qt4与Qt5版本的qml文件不能使用宏来区分,所以使用qmake执行脚本来修改qml版本差异代码。(末尾源代码地址)qml文件转换下列代码是项目文件代码,会在编译之前执行;主要作用为识别Qt版本然后替换对应qml文件中的import QtQuick 1.x或import QtQuick 2.x;equals(QT_MAJOR...原创 2019-02-16 21:37:25 · 1360 阅读 · 0 评论 -
Qml/js验证IP合法性
使用正则表达式验证function isValidIP(ip) { var reg = /((25[0-5]|2[0-4]\d|((1\d{2})|([1-9]?\d)))\.){3}(25[0-5]|2[0-4]\d|((1\d{2})|([1-9]?\d)))/ return reg.test(ip);}转载 2019-01-29 12:30:59 · 692 阅读 · 3 评论 -
Qml之别名引用
import的别名引用使用as引用,将import QtQuick.Window 2.0 as My的QtQuick.Window 2.0别名为My引用.属性的别名引用使用alias别名引用,将property alias rectWidth: rect.width的rect.width别名为rectWidth引用.例子import QtQuick 2.5import QtQu...原创 2019-02-03 22:43:19 · 2144 阅读 · 0 评论 -
QML知识-使用Qt信号和方法
在实际中开发QML应用,会经常用到信号这一属性。像onClicked,onDoubleClicked是异步操作,它们多由信号触发完成。有时候需要与Qt/C++进行数据通信时候,使用Qt的信号机制往往可以提高编程效率的效果。 1. 自定义TestModel类 (1) 使用Q_INVOKABLE可以将test函数标记到qml中使用; (2) 信号(statusCha...原创 2018-12-22 22:01:32 · 1313 阅读 · 0 评论 -
QML知识-与Qt数据交互
使用Qml编程时,常常会与Qt之间进行数据访问或修改,本篇文章是介绍Qt与Qml的数据交互方法,一般有两种方法。TestModel头文件:#ifndef TESTMODEL_H#define TESTMODEL_H#include <QObject>class TestModel : public QObject{ Q_OBJECT Q_P...原创 2018-12-18 21:46:18 · 3095 阅读 · 2 评论 -
测试QML代码耗时时间
console提供计时器的功能,可以很方便地测试代码的耗时时间。console.time(tag)与console.timeEnd(tag) 它们是成对出现的,tag则为字符串,当调用timeEnd时会附加tag字符串和耗时时间; console.time(tag)与console.timeEnd(tag)之间即是测试代码的耗时操作。 使用console.ti...原创 2018-12-29 21:46:47 · 1079 阅读 · 0 评论 -
QML画三角形代码
源代码import QtQuick 2.5Canvas { id: canvasId property color triangleColor: "#474747" width: parent.width; height: parent.height contextType: "2d" onPaint: { context.l...原创 2018-12-30 21:37:44 · 4182 阅读 · 0 评论 -
VisualItemModel在子Item使用index的问题
VisualItemModel与ListView的delegate的自动index使用有所不同。 如何正确使用VisualItemModel的index附加属性?看下列用法import QtQuick 2.0Rectangle { width: 640 height: 480 VisualItemModel { id: ite...原创 2019-01-02 21:25:55 · 399 阅读 · 0 评论 -
QML获取文字的长度
额外增加一层的Text, 并通过绑定父级的Text文本属性,即使父级的文本的width属性改变也不会影响到textLength的获取。 1Text{ 2text:"text" 3font.pixelSize:20 4 5Text{ 6id:_text 7visible:false 8te...原创 2019-01-13 22:15:56 · 3774 阅读 · 0 评论 -
QML自定义滚动Text控件
与系统Text一样的做法,但在这基础上添加自动滚动文本的功能。原创 2019-01-14 21:31:54 · 1479 阅读 · 0 评论