![](https://img-blog.csdnimg.cn/20200322002524547.jpg?x-oss-process=image/resize,m_fixed,h_224,w_224)
Qt Quick
文章平均质量分 74
记录自己的学习历程
贝勒里恩
用生命写代码,用灵魂做界面!
展开
-
QML--概述
QML(Qt Meta Language,Qt元语言)是一个用来描述应用程序界面的声明式脚本语言,自Qt 4.7引入。QML具有良好的易读性,它以可视化组件及其交互和相互关联的方式来描述界面,使组件能在动态行为中互相连接,并支持在一个用户界面上很方便的复用和定制组件。Qt Quick是Qt为QML提供的一套类库,由QML标准类型和功能组成,包括可视化类型、交互类型、动画类型、模型和视图类型,粒子...原创 2020-03-22 00:50:07 · 3743 阅读 · 0 评论 -
QML--文档构成
QML程序的源文件又叫“QML”文档,以.qml为文件后缀。每个QML文档都由两部分构成:import和对象声明。1、import部分此部分导入需要使用的Qt Quick库,这些库由Qt5提供,包含了用户界面最通用的类和功能,例如:import QtQuick 2.7import QtQuick.Window 2.2导入这些库后,用户就可以在自己编写的程序中访问Qt Quick所有的QML类型、接口和功能。2、对象声明这是一个QML程序代码的主体部分,它以层次化的结构定义了可视场景中将要显示原创 2020-06-29 09:24:27 · 404 阅读 · 0 评论 -
QML--基本语法
//MainForm.qmlimport QtQuick 2.7 //导入Qt Quick 2.7库Rectangle { //根对象: Rectangle property alias mouseArea: mouseArea //属性别名 property alias textEdit: textEdit width: 360 //属性(宽度) height: 360 //属性(高度) MouseArea { //子对象1: MouseAr原创 2020-06-29 10:18:46 · 746 阅读 · 0 评论 -
QML--可视元素
QML语言使用可视元素(Visual Elements)来描述图形化用户界面,每个可视元素都是一个对象,具有几何坐标,在屏幕上占据一块显示区域。Qt Quick预定义了一些基本的可视元素,用户编程可以直接使用它们来创建程序界面。1、Rectangle(矩形)元素Qt Quick提供了Rectangle类型来绘制矩形,矩形可以使用纯色或渐变色来填充,可以为它添加边框并指定颜色和宽度,还可以设置透明度、可见性、旋转和缩放等效果。2、Image(图形)元素3、Text(文本)元素4、自定义元素(组件)原创 2020-06-30 12:20:05 · 785 阅读 · 0 评论 -
QML--元素布局
文章目录一、Positioner(定位器)1.1、行列、网格定位1.2、流定位(Flow)1.3、重复器(Repeater)四、Anchor(锚)QML编程中可以使用x、y属性手动布局元素,但这些属性是与元素父对象左上角位置紧密相关的,不容易确定各子元素间的相对位置。为此,QML提供了定位器和锚点来简化元素的布局。一、Positioner(定位器)1.1、行列、网格定位1.2、流定位(Flow)1.3、重复器(Repeater)四、Anchor(锚)...原创 2020-07-01 23:03:05 · 783 阅读 · 0 评论 -
QML--事件处理(信号槽)
一、鼠标事件与以前的窗口部件不同,在QML中如果一个元素想要处理鼠标事件,则要在其上放置一个MouseArea元素,也就是说,用户只能在MouseArea确定的范围内进行鼠标的动作。(1)Rect.qmlimport QtQuick 2.0Rectangle { width: 50; height: 50 color: "teal" MouseArea { anchors.fill: parent /*拖拽属性设置*/ //(a)原创 2020-07-02 14:40:55 · 5583 阅读 · 0 评论 -
QML--集成JavaScript
JavaScript代码可以被很容易地集成进QML,来提供用户界面(UI)逻辑、必要的控制及其他用途。QML集成JavaScript有两种方式:一种是直接在QML代码中写JavaScript函数,然后调用;另一种是把JavaScript代码写在外部文件中,需要时用import语句导入.qml源文件中使用。一、调用JavaScript函数示例:编写JavaScript函数实现图形的旋转,每单击一次鼠标,矩形就转动一个随机的角度:(1)RotateRect.qmlimport QtQuick 2.0原创 2020-07-03 16:41:48 · 710 阅读 · 0 评论 -
QML属性大总结
一、公共属性QML里的各个可视化对象均继承与Item类,因此公共属性也就是Item的属性注意:Item本身是不可视化的1、标识符:id功能:标识对象,方便引用特点:必须唯一(可省略非必需),不然使用的时候语义不明2、位置:x / y功能:描述对象相对于父元素的位置3、大小:width / height功能:描述对象的大小:宽、高4、层级顺序:z功能:类似于CSS里的z-index属性,默认值为0;详解:当不设置这个值的时候(或者两个元素的属性z值都相同时),默认是,后面一原创 2021-01-21 14:34:34 · 3297 阅读 · 0 评论 -
Component(组件)的创建
一、概念Component是由Qt框架封装好的,只暴露了必要接口的QML类型,可以重复使用。一个QML组件就像一个黑盒子,它通过属性、信号、函数和外部世界交互。一个Component既可以定义在单独的QML文件中,也可以嵌入到其他的QML文档中来定义。嵌入式定义组件import QtQuick 2.2Rectangle { width: 320; height: 240; color: "#C0C0C0"; ...... Component {原创 2022-03-11 16:11:34 · 1636 阅读 · 0 评论 -
QML绘图系统
一、绘图系统四要素画布(Canvas,类似于Widget的QPaintDevice)画师(Context2d,类似于Widget的QPainter)画笔(strokeStyle属性,类似于Widget的QPen)画刷(fillStyle属性,类似于Widget的QBrush)1.1、基本绘图模式Canvas是Item的派生类,通过设置width和height属性,就可以定一个绘图区域,然后在onPaint()信号处理器内使用Context2D对象来绘图。import QtQuick 2.1原创 2022-08-04 11:48:33 · 1921 阅读 · 0 评论 -
C++与QML混合编程
Qt Quick技术的引入,使得我们能够快速构建流畅的用户界面,具有动画、各种绚丽效果的UI都不在话下。但它不是万能的,也有很多局限性,原来Qt的一些技术,比如低阶的网络编程如QTcpSocket、多线程,又如XML文档处理类库QXmlStreamReader、QXmlStreamWriter,再如文件操作QFile、QTextStream等,在QML中要么不可用,要么用起来不方便,所以,很多时候我们会基于这样的原则来混合使用QML和C++:使用QML构建界面,使用C++实现非界面的业务逻辑和复杂运算。原创 2022-08-24 17:41:53 · 1222 阅读 · 0 评论 -
QML动画
给用户一个可操作的暗示;平滑衔接界面与界面的切换,让界面感觉更流畅;产生拟物效果,让软件更容易理解和使用;Qt Quick提供了比较丰富的动画类库,可以让我们的界面动起来。一般的动画都是通过操作Item的property来实现的,比如移动一个文本对象,你只需要确认起始位置和目标位置,两个位置中间的运动轨迹,PropertyAnimation或者NumberAnimation可以帮我们计算出来,他们有各种各样的算法产生不同的动画效果。.................................原创 2022-08-25 17:24:35 · 1714 阅读 · 0 评论 -
QML粒子系统
粒子系统用于模拟一些特定的模糊效果,例如:爆炸、烟花、雪花、水流等。使用传统的渲染技术实现粒子效果比较困难,但是使用QML粒子系统能十分方便的实现各种粒子效果,使你的界面更加炫酷、动感。原创 2022-09-16 17:56:13 · 1154 阅读 · 0 评论 -
QML控件--Window和ApplicationWindow
ApplicationWindow是Window的扩充版,是一个丰富的窗口,包含菜单栏(MenuBar)、工具栏(ToolBar)、内容区域(Content Area)、状态栏(Status Bar)Window就是一个普通的窗口,其中什么组件也没有,可以理解为和QWidget差不多;可以理解为和QMainWindow差不多;原创 2023-04-11 11:40:24 · 446 阅读 · 0 评论 -
QML控件--Container
*Container(容器):**是类容器用户界面控件的基本类型,允许动态插入和删除项;(TabBar是Container的子类之一)原创 2023-04-11 14:38:18 · 625 阅读 · 0 评论 -
QML控件--SwipeView
Import Statement:import QtQuick.Controls 2.14Since:Qt 5.7Inherits:ContainerSwipeView是一个带滑动功能的QStackedWidget三、附加TabBar + SwipeView 使用原创 2023-04-11 15:08:12 · 265 阅读 · 0 评论 -
QML控件--DelayButton
按钮长按可以激发,然后再次点击即可复位,但是这个过程没有提供任何信号用来监听;是一个延时按钮,需要长按才能触发,这种延迟可以防止意外按压;原创 2023-04-11 15:58:55 · 815 阅读 · 0 评论 -
QML控件--Dial
对齐模式与 stepSize 一起使用,对齐是相对stepSize而言的。水平和垂直输入模式使用相对输入系统,其中光标位置的变化相当于在图中的直线上。原创 2023-04-12 11:11:50 · 721 阅读 · 0 评论 -
QML控件--DialogButtonBox
对话框和消息框通常以符合该平台的界面指南的顺序显示按钮,不同的平台总是有不同顺序的对话按钮,DialogButtonBox 允许开发人员向其中添加按钮,并且会。当在按钮框中单击按钮时,会为实际按下的按钮发出 clicked() 信号。按钮框使用的标准按钮的组合。这些按钮将按照用户平台的适当顺序放置。: enumeration 在排列按钮框中包含的按钮时要使用的。管理此按钮的按钮框,如果该按钮不在按钮框中,则为 null。: enumeration 按钮框的位置。持有按钮框中每个按钮的角色。原创 2023-04-12 11:52:53 · 721 阅读 · 0 评论 -
QML控件--Dialog
注意:当使用 close() 关闭对话框或将 visible 设置为 false 时,不会发出此信号;注意:当使用 close() 关闭对话框或将 visible 设置为 false 时,不会发出此信号。当以交互方式或通过调用 accept() 接受对话框时,会发出此信号;页脚项目位于底部,并调整为对话框的宽度。当对话以交互方式或通过调用 reject() 被拒绝时,会发出此信号。对话框使用的标准按钮的组合。标题项位于顶部,并调整为对话框的宽度。单击 Dialog.Discard 标准按钮时会发出此信号。原创 2023-04-12 14:12:05 · 1271 阅读 · 0 评论 -
QML控件--Drawer
与屏幕边缘的距离,在该距离内拖动操作将打开 Drawer,默认值为 Qt.styleHints.startDragDistance。Drawer 相对于其最终目的地的位置。完全关闭时位置为 0.0,完全打开时位置为 1.0。:提供一个可以使用滑动手势打开和关闭的侧面板;Drawer 可以从上下左右四个方向打开;Drawer 是否是交互式的。非交互式不会对滑动做出反应。注意:设置为 小于等于 0 可禁用通过拖动打开Drawer;原创 2023-04-12 14:47:20 · 1015 阅读 · 0 评论 -
QML控件--Menu
与仅关闭菜单及其子菜单的 close() 不同,dismiss() 关闭菜单的整个层次结构,包括父菜单;当菜单是子菜单时,菜单的标题通常显示在菜单项的文本中,而当它在菜单栏中时,则显示在工具按钮的文本中;删除并返回 index 处的菜单,该索引位于菜单中的所有项目中,菜单的所有权转移给调用者。删除并返回索引处的动作,该索引位于菜单中的所有项目中,动作的所有权转移给调用者;返回索引处的子菜单,如果索引无效或指定索引处没有子菜单,则返回 null;删除并返回索引处的项目,项目的所有权转移给调用者;原创 2023-04-12 15:13:57 · 881 阅读 · 0 评论 -
QML控件--MenuBar
还提供 API 来动态添加、插入、删除和获取菜单。:是菜单栏,通常,菜单静态声明为菜单栏的子项,但。访问菜单栏中的菜单;原创 2023-04-21 14:48:12 · 827 阅读 · 0 评论