QTQuick控件基础(1)

简介: 一、ItemQtQuick所有的可视项目都继承自Item,它定义了可视化项目所有通用特性(x\y\width\height\anchors等)具体包括1、作为容器2、不透明性没有设置opacity属性设置了opacity属性为0.5当然也可以这样写3、visible属性用来设置项目是否可见。
一、Item
QtQuick所有的可视项目都继承自Item,它定义了可视化项目所有通用特性(x\y\width\height\anchors等)具体包括
1、作为容器
img_fffad021ca9b4bebac3f10fd8313b3e6.png
2、不透明性
没有设置opacity属性
img_320a91263802b4a8502b2e6b5a9baded.png
设置了opacity属性为0.5
img_1973920fc9806298faa6882f1a0703d3.png
当然也可以这样写
img_97ec1041230c1eb02c2c6454d8e190f5.png
3、visible属性用来设置项目是否可见。如果visible属性为false,则不接受鼠标键盘事件;同理还有enable属性;
4、堆叠顺序,简单的说,就是z越大,越在顶层。当然前提是要保证是在并集的情况下。
img_ec0a7e1d523f2b393f0474743c125ab1.png
通过z的设置,将原本在上面的蓝色矩形变换到底层,同时将两个矩形的结构由嵌套改编成并行。
img_bb64e22e9ca29ed64ee170b9c909c870.png
或者可以通过将z设置为负值直接达到这个目标
5、定位子项目和坐标映射
包含childAt来返回在点x,y处的子项目,以及item的mapFromItem返回item坐标系统中点映射在该项目坐标系统的结果。

二、Rectangle
Rectangle主要是使用纯色或者渐变填充一个矩形区域,并提供一个边框。
1、渐变,使用了GradientStop表明渐变的头和尾
img_fbb7f6772356d7998dade580a0875f02.png
2、边框,我们实现一个圆角矩形
img_f5d5294fbbd4e72457d9dc67ec1c1613.png

三、Text
可以按照常用的方式,也可以以html的方式
img_cab848958396de5f75e8d90f1644ee1b.png
1、颜色,有两种表示颜色的方法
img_b73644fd9be034b187081febdac7a68d.png

2、文本裁剪,如果clip为true则裁剪,否则通过设置文本换行或者文本省略。这个截图已经可以说明
img_0fde30f0651c337bb5fbc2b4a64dd5d6.png
3、超链接
img_c5686c6cdf0731840cea6df75893ce38.png

四、TextInput
TextInput用来显示单行可编辑纯文本。以及相关的现实策略。比如intvalidator/DoubleValidator以及RegExpoValidator等
img_d97c476926ec57468af777aaecc45c33.png
按下回车后读取数据
img_ec4671b96e782692593ed78b95378a01.png
当然我们推荐使用qtcontrols中的textbox
四、定位器
column/row/grid/flow是四种定位器
img_73548ac22d909bd2f092e719f05b3b37.png
img_9b6b1ce6eac480d5c50e540c6a052a52.png
五、repeater和positioner用来创建大量的项目并且获得特定的数据
img_168846b7b09f9146a9bee0bf92eac67e.png
注意其中的index是直接委托获得的。

六、anchor锚定位
一般来说,锚都是相对于父控件的,所以记录这幅图最为重要:
img_750973aa6e825347fceb7cfa2edb88d6.png
七、MouseArea
其最为重要的是 onClicked事件
img_987c1fa06e69e4bece889c818dade1c9.png

八、timer
实时获得当前时间
img_70bfcd17c5eb3123fc5679554bf97b7b.png





目前方向:图像拼接融合、图像识别 联系方式:jsxyhelu@foxmail.com
目录
相关文章
|
10月前
|
前端开发 算法 JavaScript
从基础到进阶:实现div控件的拖拽和缩放功能
从基础到进阶:实现div控件的拖拽和缩放功能
140 0
|
API 图形学
Winform控件优化之自定义控件的本质【从圆角控件看自定义的本质,Region区域无法反锯齿的问题】
自定义控件的本质只有两点:重绘控件Region区域(圆角、多边形、图片等),这是整个控件的真实范围;重绘图形,在原有Region范围内,重绘不同的图形(圆角、多边形、图片等)作为背景......
639 0
Winform控件优化之自定义控件的本质【从圆角控件看自定义的本质,Region区域无法反锯齿的问题】
|
C# 容器
Winform控件优化之TabControl控件的美化和功能扩展
在基本的TabControl控件使用和功能之上,可以尝试对其进行美化和功能扩展,比如动态删除或添加tab、绘制图标按钮及鼠标hover时的背景变化、Tab从右向左布局的优化处理等。最重要...
3056 0
Winform控件优化之TabControl控件的美化和功能扩展
|
10月前
|
移动开发
【实用】一组原创原生样式的基础控件、UI组件样式(偏向移动端H5页面的样式)
【实用】一组原创原生样式的基础控件、UI组件样式(偏向移动端H5页面的样式)
【实用】一组原创原生样式的基础控件、UI组件样式(偏向移动端H5页面的样式)
|
7月前
|
开发框架 缓存 前端开发
使用扩展函数方式,在Winform界面中快捷的绑定树形列表TreeList控件和TreeListLookUpEdit控件
使用扩展函数方式,在Winform界面中快捷的绑定树形列表TreeList控件和TreeListLookUpEdit控件
|
算法 API C#
Winform控件优化之圆角按钮【各种实现中的推荐做法】(下)
最终优化实现ButtonPro按钮(继承自Button),既提供Button原生功能,又提供扩展功能,除了圆角以外,还实现了圆形、圆角矩形的脚尖效果、边框大小和颜色、背景渐变颜色...
2426 0
Winform控件优化之圆角按钮【各种实现中的推荐做法】(下)
|
JavaScript
vue uniapp通用省市下拉选择器组件 布局样式可灵活根据ui变更 (区域 可根据数组嵌套的格式继续往下模仿即可)
vue uniapp通用省市下拉选择器组件 布局样式可灵活根据ui变更 (区域 可根据数组嵌套的格式继续往下模仿即可)
730 0
vue uniapp通用省市下拉选择器组件 布局样式可灵活根据ui变更 (区域 可根据数组嵌套的格式继续往下模仿即可)
|
C# 图形学 Windows
Winform控件优化之圆角按钮【各种实现中的推荐做法】(上)
Windows 11下所有控件已经默认采用圆角,其效果更好、相对有着更好的优化...尝试介绍很常见的圆角效果,通过重写控件的OnPaint方法实现绘制,并在后面进一步探索对应的优化和可能的问题
1644 0
Winform控件优化之圆角按钮【各种实现中的推荐做法】(上)
|
Android开发 Windows
weditor, 布局分析, 查看控件信息
weditor, 布局分析, 查看控件信息
539 0
一个控件几行代码实现换肤(可支持菜单)
这是从vbAccelerator(http://vbaccelerator.com)的皮肤程序修改而来,把DLL方式修改为OCX,并且修改为仅通过几行指令,即可完成皮肤加载。
523 0