QT常用控件使用及布局

QT常用控件使用及布局

文章目录

  • QT常用控件使用及布局
  • 1、创建带Ui的工程
  • 2、ui界面介绍
    • 1、界面设计区
    • 2、对象监视区
    • 3、对象监属性编辑区
    • 4、信号与槽
    • 5、布局器
    • 6、控件
      • 1、Layouts
        • 1、布局管理器
        • 2、布局的dome
      • 2、Spacers
      • 3、Buttons
      • 4、项目视图组(Item Views)
      • 5、项目控件组(Item Widgets)
      • 6、Containers(容器）
      • 7、Input widgets
        • 1、QLineEdit 举例
      • 8、Display widgets
        • 1、怎么添加资源文件
        • 2、QLable标签实现标签文本，图片，链接
  • 3、布局练习
  • 4、自定义控件
  • 5、样式表
    • 1、Qt样式表介绍
    • 2、Qt样式表简单举例
  • 6、总结

1、创建带Ui的工程

在这里插入图片描述
在这里插入图片描述

在这里插入图片描述
项目里会生成带.ui的文件，双击就可以进行ui设计。
在这里插入图片描述

2、ui界面介绍

双击 .ui文件，会弹出UI设计器，其布局大概为：
在这里插入图片描述

1、界面设计区

可以把控件直接拖进来进行布局。

2、对象监视区

所以在界面设计区的控件都能在这看到。

3、对象监属性编辑区

可以对界面设计区选中的控件进行属性设置。比如在界面设计区加入一个按钮。
在这里插入图片描述

4、信号与槽

在这里插入图片描述另外也可以在界面设计区选择按钮，然后右键 - 转到槽…，去添加自定义槽函数。
在这里插入图片描述
在这里插入图片描述
然后在窗口的类声明中的自动生成如下槽函数。然后去实现槽函数即可。这种方式就不需要自己去定义槽函数。
在这里插入图片描述

5、布局器

在这里插入图片描述

6、控件

在这里插入图片描述

1、Layouts

在这里插入图片描述

1、布局管理器

所谓 GUI 界面，归根结底，就是一堆控件的叠加。我们创建一个窗口，把按钮放上面，把图标放上面，这样就成了一个界面。在放置时，控件的位置尤其重要。我们必须要指定控件放在哪里，以便窗口能够按照我们需要的方式进行渲染。这就涉及到控件定位的机制。
在这里插入图片描述
Qt 提供的布局中以下三种是我们最常用的：
QHBoxLayout：按照水平方向从左到右布局；
QVBoxLayout：按照竖直方向从上到下布局；
QGridLayout：在一个网格中进行布局，类似于 HTML 的 table(网格布局可以任意布局）

2、布局的dome
#include "mywidget.h"
#include "ui_mywidget.h"
#include <QSpinBox>
#include <QSlider>
#include <QHBoxLayout>

MyWidget::MyWidget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::MyWidget)
{
    ui->setupUi(this);
    QSpinBox *spinBox = new QSpinBox(this);
    QSlider *slider = new QSlider(Qt::Horizontal, this);

    connect(slider, &QSlider::valueChanged,
                     spinBox, &QSpinBox::setValue);

    void (QSpinBox:: *spinBoxSignal)(int) = &QSpinBox::valueChanged;

    /* 因为valueChanged信号重载了所以用函数指针来区分调用带参的信号 */
    connect(spinBox, spinBoxSignal,
                     slider, &QSlider::setValue);

    spinBox->setValue(35); /* 设置spinBox值 */

    /* 给控件设置布局 指定布局的父对象(this) 相当把控件放到窗口 */
    QHBoxLayout *layout = new QHBoxLayout(this);
    layout->addWidget(spinBox);
    layout->addWidget(slider);
}

进行水平布局运行如下：
在这里插入图片描述
当窗口的大小改变时，窗口布局里的控件也会自动发生变化。

2、Spacers

在这里插入图片描述

3、Buttons

在这里插入图片描述

4、项目视图组(Item Views)

在这里插入图片描述

5、项目控件组(Item Widgets)

在这里插入图片描述

6、Containers(容器）

在这里插入图片描述

7、Input widgets

在这里插入图片描述

1、QLineEdit 举例
#include "mywidget.h"
#include "ui_mywidget.h"
#include <QLineEdit>
#include <QCompleter>
#include <QStringList>

MyWidget::MyWidget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::MyWidget)
{
    ui->setupUi(this);

    QLineEdit *edit = new QLineEdit(this);
    //设置内容
    edit->setText("12345678");

    /* 移动行编辑的位置 */
    edit->move(200,300);
    //设置内容显示间隙
    edit->setTextMargins(15, 0, 0, 0);

    //设置内容显示方式
    //ui->lineEdit->setEchoMode(QLineEdit::Password);
    QStringList list;
    list << "hello" << "How are you" << "hehe";

    QCompleter *com = new QCompleter(list, this);

    /* 设置是否区分大小写 */
    com->setCaseSensitivity(Qt::CaseInsensitive);

    /* 将QCompleter对象设置到QLineEdit中 */
    edit->setCompleter(com);
}

按’H’会有提示
在这里插入图片描述

8、Display widgets

在这里插入图片描述

1、怎么添加资源文件

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在资源里生成image.qrc文件 添加前缀：可以设置前缀 添加文件：可以添加文件

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
右键—>复制资源路径到剪贴板 。就可以复制选中的资源路径。比如复制如下 //image/LuffyQ.png 根据这路经就可以加载资源。

2、QLable标签实现标签文本，图片，链接
#include "mywidget.h"
#include "ui_mywidget.h"
#include <QLabel>
#include<QMovie> /* 动画头文件 */
#include <QDesktopServices>

MyWidget::MyWidget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::MyWidget)
{
    ui->setupUi(this);

    /* 1. 设置文本 */
    QLabel *lable_1 = new QLabel(this);
    lable_1->move(200,100);
    lable_1->setText("标签");

    /* 2. 设置图片 */
    QLabel *lable_2 = new QLabel(this);
    lable_2->move(200,200);
    lable_2->setPixmap(QPixmap("://image/LuffyQ.png"));
    /* 让图片自适应标签的大小 */
    lable_2->setScaledContents(true);

    /* 3. 设置动画 */
    QLabel *lable_3 = new QLabel(this);
    lable_3->move(400,200);

    /* 创建动画 */
    QMovie *movie = new QMovie("://image/mario.gif"); /* 资源要是动态的图片 */
    /* movie指定父对象 */
    movie->setParent(this);
    /* 标签里设置动画 */
    lable_3->setMovie(movie);
    /* 启动动画 */
    movie->start();
    /* 让动画自适应标签的大小 */
    lable_3->setScaledContents(true);

    /* 4. 显示HTML链接 */
    QLabel *lable_4 = new QLabel(this);
    lable_4->move(500,400);

    lable_4 ->setText("<h1><a href=\"https://www.baidu.com\">百度一下</a></h1>");
    /* 设置打开外部链接方法1 */
    lable_4 ->setOpenExternalLinks(true);

    /* 设置打开外部链接方法2 */
    //connect(lable_4, &QLabel::linkActivated, this, &MyWidget::slotOpenUrl);
}


MyWidget::~MyWidget()
{
    delete ui;
}

void MyWidget::slotOpenUrl(const QString &link)
{

    QDesktopServices::openUrl(QUrl(link.toLocal8Bit()));
}

3、布局练习

原则：先局部在整体布局。
在这里插入图片描述
总结：布局需要多练习。对象属性里熟悉合理设置。

4、自定义控件

不是在已有的控件拖到界面设计区。
怎么添加类文件：
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
生成Smallwidget.h Smallwidget.cpp
在这里插入图片描述
在Smallwidget.cpp里添加如下代码

#include "smallwidget.h"
#include <QSpinBox>
#include <QSlider>
#include <QHBoxLayout>

Smallwidget::Smallwidget(QWidget *parent)
    : QWidget{parent}
{
    QSpinBox *spin = new QSpinBox(this);
    QSlider *slider = new QSlider(Qt::Horizontal, this);

    //把控件添加到布局中
    QHBoxLayout *hLayout = new QHBoxLayout(this);
    hLayout->addWidget(spin);
    hLayout->addWidget(slider);

    connect(spin, static_cast<void (QSpinBox::*)(int)>(&QSpinBox::valueChanged),
            slider, &QSlider::setValue);

    connect(slider,  &QSlider::valueChanged, spin, &QSpinBox::setValue);
}

在界面设计区添加空容器。
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
最终运行如下：
在这里插入图片描述
提升的Smallwidget类在容器里显示出来。

5、样式表

1、Qt样式表介绍

Qt样式表是一个可以自定义部件外观的十分强大的机制﹐控件的都可以使用Qt样式表来美化。Qt样式表的概念,术语和语法都受到了HTML的层叠样式表(Cascading Style Sheets, CSS)的启发,不过与CSS不同的是,Qt样式表应用于部件。
样式表可以使用QApplication: : setStyleSheet()函数将其设置到整个应用程序上,也可以使用QWidget::setStyleSheet()函数将其设置到一个指定的部件(还有它的子部件)上。如果在不同的级别都设置了样式表,那么Qt会使用所有有效的样式表，这被称为样式表的层叠。

2、Qt样式表简单举例

#include "mywidget.h"
#include "ui_mywidget.h"
#include <QLabel>
#include <QPushButton>
MyWidget::MyWidget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::MyWidget)
{
    ui->setupUi(this);
    QLabel *pLable = new QLabel(this);
    QLabel *pLable1 = new QLabel(this);

    QPushButton *button = new QPushButton(this);
    pLable->move(100,100);
    pLable->resize(200,200);
    pLable1->resize(100,100);
    button->move(300,300);

    button->resize(300,300);
    this->setStyleSheet("QLabel{color:rgb(0, 255, 255);"
                        "background-color:red;"
                        "}"); /* 设置整个窗口的标签 */

    pLable->setStyleSheet("QLabel{color:rgb(0, 255, 255);"
                             "background-color:blue;"
                             "border-image:url(://image/down.png);"
                             "}");

    button->setStyleSheet("QPushButton{"
                                  "border-image:url(:/image/Sunny.jpg);" /* 填充边框的图像 */
                                  "}"

                                  "QPushButton:hover{"
                                  "border-image:url(:/image/up.png);" /* 鼠标悬空在按钮的图像 */
                                  "}"

                                  "QPushButton:pressed{"
                                  "border-image:url(:/image/Luffy.png);" /* 按钮按下图像 */
                                  "}"

                                  );
}

其它QT样式表博客

6、总结

主要介绍QT的UI界面及控件的简单使用与布局。及自定义控件。控件的渲染样式表的简单介绍。

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mfbz.cn/a/301495.html

如若内容造成侵权/违法违规/事实不符，请联系我们进行投诉反馈qq邮箱809451989@qq.com，一经查实，立即删除！

相关文章

【sgPasswordInput】自定义组件：带前端校验密码强度的密码输入框，能够提供密码强度颜色提示和文字提示

【sgPasswordInput】自定义组件：带前端校验密码强度的密码输入框，能够提供密码强度颜色提示和文字提示

特性&#xff1a; 有密码强度颜色提示密码强度进度条提示支持设置默认输入提示和密码长度 sgPasswordInput源码 <template><div :class"$options.name" style"width: 100%"><el-inputstyle"width: 100%"ref"psw"type&…
阅读更多...
软件使用手册

软件使用手册

一简介 软件分两部分&#xff0c;股票监测程序&#xff0c;监测列表配置数据页面以及手机端接收监控数据。股票监测程序需要在电脑上运行。下载地址为程序下载地址。监控股票配置页面地址为动态列表。 二使用介绍 2.1监控客户端 2.1.1程序安装及登录 下载安装exe程序程序下载地…
阅读更多...
C#开源的一款友好的.NET SDK管理器

C#开源的一款友好的.NET SDK管理器

前言 今天推荐一款由C#开源的、友好的.NET SDK管理器&#xff1a;Dots。 工具介绍 Dots 是一款 .NET SDK 管理器&#xff0c;可让您轻松安装、卸载和切换 .NET SDK。它是一款跨平台工具&#xff0c;可在 Windows 和 macOS 上运行&#xff0c;即将支持 Linux。它由 C# 编写&a…
阅读更多...
部署可道云网盘的一个漏洞解决

部署可道云网盘的一个漏洞解决

目录 1漏洞展示 2.防范措施 1漏洞展示 因为可道云网盘的上传文档有保存在 /data/Group/public/home/文档/ 中,当别有用心之人知道个人部署的域名与上次的文件后&#xff0c;可以进行访问拿到uid。例我在我部署的网盘上上次一个aa.php 文件&#xff0c;然后拿来演示 然后通过…
阅读更多...
Axure RP Extension For Chrome 插件安装

Axure RP Extension For Chrome 插件安装

1. 下载好 AXURE RP EXTENSION For Chrome 插件之后解压成文件夹 2. 打开浏览器&#xff0c;找到设置--更多工具--扩展程序--加载已加压的扩展程序&#xff0c;选择解压好的文件夹 3. 点击详细信息&#xff0c;打开访问网址权限
阅读更多...
静态路由、代理ARP

静态路由、代理ARP

目录 静态路由静态路由指明下一跳和指明端口的区别代理ARP 我们知道&#xff0c;跨网络通信需要路由 路由有三种类型&#xff1a; 1.直连路由。 自动产生的路由&#xff0c;当网络设备连接到同一网络时&#xff0c;他们可以自动学习到对方的存在。自动学习相邻网络设备的直连信…
阅读更多...
C/C++ 联合体

C/C++ 联合体

目录 联合体概述 联合体的内存分配 联合体大小计算 联合体概述 联合与结构非常的相似&#xff0c;主要区别就在于联合这两个字。 联合的特征&#xff1a;联合体所包含的成员变量使用的是同一块空间。 联合体定义 //联合类型的声明 union Un {char c;int i; }; //联合变量…
阅读更多...
PAT 乙级 1049 数列的片段和

PAT 乙级 1049 数列的片段和

分数 20 作者 CAO, Peng 单位 Google 给定一个正数数列&#xff0c;我们可以从中截取任意的连续的几个数&#xff0c;称为片段。例如&#xff0c;给定数列 { 0.1, 0.2, 0.3, 0.4 }&#xff0c;我们有 (0.1) (0.1, 0.2) (0.1, 0.2, 0.3) (0.1, 0.2, 0.3, 0.4) (0.2) (0.2, 0.3) …
阅读更多...
VSD Viewer for Mac Visio绘图文件阅读器

VSD Viewer for Mac Visio绘图文件阅读器

Visio Viewer for Mac是一款专为Mac用户设计的Visio文件查看工具。它允许用户在Mac上查看和共享Visio文件&#xff0c;无需安装微软的Visio软件。这对于那些没有购买或没有访问Windows操作系统的Mac用户来说&#xff0c;是一个非常方便的选择。 该软件支持Visio的各种文件格式…
阅读更多...
五行能量，影响着你的运势，莫小看！

五行能量，影响着你的运势，莫小看！

五行的能量不能小看&#xff0c;时时刻刻在影响着我们。五行为聚之成形&#xff0c;散之成气&#xff1b;五行学说讲的是能量与气场&#xff0c;它指出世界有五种元素&#xff1a;金、水、木、火、土&#xff0c;这代表世界的五种不同的能量。五行能量存在于我们的身边&#xf…
阅读更多...
分析抖音直播弹幕评论和礼物的websocket数据流信息，通过proto协议解析消息内容思路

分析抖音直播弹幕评论和礼物的websocket数据流信息，通过proto协议解析消息内容思路

现在定位到一个解析的大概位置&#xff1a; e.decode function(e, t) {e instanceof o || (e o.create(e));for (var n, i, s void 0 t ? e.len : e.pos t, u new r.webcast.im.MemberMessage(r.webcast. 通过请求找到发送请求的js代码位置&#xff0c;然后通过跟踪这…
阅读更多...
Halcon机器视觉和运动控制软件通用框架，24年1月最新版新增UI设计器，插件式开发，开箱即用 仅供学习！

Halcon机器视觉和运动控制软件通用框架，24年1月最新版新增UI设计器，插件式开发，开箱即用 仅供学习！

24年1月更新 下载点我 此版本已经添加ui设计器。具体功能如上所示&#xff0c;可以自定义变量&#xff0c;写c#脚本&#xff0c;自定义流程&#xff0c;包含了halcon脚本和封装的算子&#xff0c;可自定义ui&#xff0c;通过插件形式开发很方便拓展自己的功能。 ui设计器
阅读更多...
Web前端-JavaScript（BOM)

Web前端-JavaScript（BOM)

文章目录 1.1 常用的键盘事件1.1.1 键盘事件1.1.2 键盘事件对象1.1.3 案例一 1.2 BOM1.2.1 什么是BOM1.2.2 BOM的构成1.2.3 window1.2.4 window对象常见事件窗口/页面加载事件**第1种****第2种** 调整窗口大小事件 1.2.5 定时器setTimeout() 炸弹定时器停止定时器**案例&#x…
阅读更多...
数据采集卡技术参数一览！

数据采集卡技术参数一览！

数据采集卡主要技术参数有如下几个指标&#xff1a; &#xff08;1&#xff09;通道数&#xff1a;即板卡可以采集几路信号&#xff0c;分为单端和双端&#xff08;差分&#xff09;。常用的有单端32路/差分16路、单端16路/差分8路。 &#xff08;2&#xff09;数据采集卡采样…
阅读更多...
简单易懂的PyTorch线性层解析：神经网络的构建基石

简单易懂的PyTorch线性层解析：神经网络的构建基石

目录 torch.nn子模块Linear Layers详解 nn.Identity Identity 类描述 Identity 类的功能和作用 Identity 类的参数 形状 示例代码 nn.Linear Linear 类描述 Linear 类的功能和作用 Linear 类的参数 形状 变量 示例代码 nn.Bilinear Bilinear 类的功能和作用 B…
阅读更多...
Mudbox 各版本安装指南

Mudbox 各版本安装指南

​Mudbox下载链接 https://pan.baidu.com/s/1cYcITQ7OeI5PadNdXur_bA?pwd0531 1.鼠标右击【Mudbox2024(64bit)】压缩包&#xff08;win11及以上系统需先点击“显示更多选项”&#xff09;【解压到 Mudbox2024(64bit)】。 2.打开解压后的文件夹&#xff0c;双击打开【Setup】…
阅读更多...
cuttag和chip-seq的区别？

cuttag和chip-seq的区别？

Cut&Tag&#xff08;Cleavage Under Targets and Tagmentation&#xff09;和ChIP-Seq&#xff08;Chromatin Immunoprecipitation Sequencing&#xff09;都是用于研究蛋白质与DNA相互作用的生物技术。它们在技术原理和应用方面有一些关键的区别。 1.ChIP-Seq测序 1.1 …
阅读更多...
C语言scanf（）函数详解

C语言scanf（）函数详解

目录 1. scanf&#xff08;&#xff09;函数简介 1.1 函数原型 1.2 头文件 1.3 返回值 1.4 参数 2.格式说明符 3.输入格式控制 关于‘ * ’赋值忽略符的例子 关于width域宽的例子 关于length长度修饰符的说明 4. 其他常见问题说明 4.1 scanf&#xff08;&#xf…
阅读更多...
【蓝桥杯软件赛 零基础备赛20周】第7周——二叉树

【蓝桥杯软件赛 零基础备赛20周】第7周——二叉树

文章目录 1 二叉树概念2 二叉树的存储和编码2.1 二叉树的存储方法2.2 二叉树存储的编码实现2.3 二叉树的极简存储方法 3 例题4 习题 前面介绍的数据结构数组、队列、栈&#xff0c;都是线性的&#xff0c;它们存储数据的方式是把相同类型的数据按顺序一个接一个串在一起。简单的…
阅读更多...
污水处理成套设备如何选择

污水处理成套设备如何选择

污水处理是现代社会中不可或缺的一个重要环节&#xff0c;它涉及到环保领域&#xff0c;与人们的生活和健康息息相关。而污水处理成套设备的选择则显得尤为重要&#xff0c;因为合适的设备能够有效地解决水污染问题&#xff0c;提高环境质量。 在选择污水处理成套设备时&#x…
阅读更多...
最新文章

Copyright @ 2022~2023

友情链接： 我的编程经验分享 一条长河网 尧图网站开发 尧图建网站