Qt项目天气预报(1) - ui界面搭建

ui中部

效果演示

ui效果

显示效果

控件列表

配合右图查看

居中对齐-label

设置label居中对齐(别傻傻的空格对齐了)

间距配置

widget03

外围的widget对象:

包含label 和 widget0301,如下图

widget0301

内围的widget对象,如下图

样式表

widget03

设置widget03的样式表,设置颜色为浅白色(230,230,230)

让widget03里面的字体能显示出来(背景黑色,字体颜色默认黑色,我们需要设置为对比明显的白色)

widget0301

stylesheet界面美化

background-color: rgb(239, 121, 24); //设置背景颜色

border-radius: 20px; //边缘圆脚化

ui上部

效果演示

ui效果

显示效果

控件列表

widget01

对应ui控件组如下

wigget02

对应的ui控件组如下

样式表

widget对象还像上面一样设置为浅白色 --> 让我们能看到白色的文本内容

设置lineEdit白色文本框显示

间距配置

ui下部

效果演示

ui效果

显示效果

控件列表

添加控件组如下

整体

widget0401

widget0402

widget0403

widget0404 widget0405 未添加控件

widget0406

样式表

widget0401的浅绿色label控件

由上下两个控件组成,如下图

(添加了底下左右边缘特殊化处理 --> 为了与下面label切合)

(添加了上方左右边缘特殊化处理 --> 为了与下面label切合)

widget0402替换背景色为灰色

然后Pixmap插入一张图片而已

widget0403

上色+边缘圆润化处理+字体颜色浅白

绿色

橙色

widget0406

同widget0402,只是没有插入图片

// 间距使用的是默认配置

间距配置

像0401,0402,0406 这样两个控件组合的,我们格栅布局后会有空隙,不贴和

我们可以把垂直间距设置为0,实现贴合效果,水平间距统一设置为8达到对齐效果

ui整体整合

比例配成1,2,4,8

相关推荐
lulu_gh_yu20 分钟前
数据结构之排序补充
c语言·开发语言·数据结构·c++·学习·算法·排序算法
huanggang98220 分钟前
在Ubuntu22.04上使用Qt Creator开发ROS2项目
qt·ros2
老秦包你会1 小时前
Qt第三课 ----------容器类控件
开发语言·qt
ULTRA??1 小时前
C加加中的结构化绑定(解包,折叠展开)
开发语言·c++
MediaTea1 小时前
七次课掌握 Photoshop:选区与抠图
ui·photoshop
凌云行者1 小时前
OpenGL入门005——使用Shader类管理着色器
c++·cmake·opengl
凌云行者2 小时前
OpenGL入门006——着色器在纹理混合中的应用
c++·cmake·opengl
spygg2 小时前
Qt低版本多网卡组播bug
qt·组播·多网卡组播·qt5.7.0
~yY…s<#>2 小时前
【刷题17】最小栈、栈的压入弹出、逆波兰表达式
c语言·数据结构·c++·算法·leetcode
码农客栈2 小时前
qt QWebSocketServer详解
qt