Qt|QPushButton控件讲解

2024-01-30 12:44
文章标签 讲解 qt 控件 qpushbutton

本文主要是介绍Qt|QPushButton控件讲解,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

前提

按钮分为了四种状态:常态、聚焦、按下、禁用

前一段时间更新了MFC框架下CButton的自绘。因为MFC框架下的按钮限制性很高,所以只能由自绘实现各种风格,但是QT框架完美的解决了这个问题,我们只需要了解如何调用,就可以展示炫酷的画面了,接下来我们来讲解下如何使用吧!

有需要的或者是对控件风格不熟悉的赶紧收藏

Background-color:#FF0000;

起来!以备不时之需~

功能

1:背景颜色值改变

我们可以对四种状态设置一个背景颜色值,也可以根据不同状态设置不同的颜色值。

主要是根据我们实际的开发需求来定的。

情况1:四种状态使用一种背景颜色值

QSS方式:

Background-color:#FF0000;

情况2:每个状态的颜色值不一样

QSS方式:

“QPushButton{background-color:#FF0000};” //常态
“QPushButton:hover{background-color:#00FF00};” //聚焦状态
“QPushButton:pressed{background-color:#0000FF};” //按下状态
“QPushButton:disabled{background-color:#DDDDDD};” //禁用状态

2:背景图片改变

与上述颜色值更改的方式一致,只是将颜色值变成了图片。

情况1:四态使用一种背景图片

QSS方式:

border-image:url(:/QtControl/img/normal.png);

情况2:每个状态的背景图不一致

QSS方式:

"QPushButton{border-image:url(:/QtControl/img/normal.png); }"
"QPushButton:hover{border-image:url(:/QtControl/img/hover.png);}"
"QPushButton:pressed{border-image:url(:/QtControl/img/pre.png);}"
"QPushButton:disabled{border-image:url(:/QtControl/img/disab.png);}";

3:文本对齐方式

QPushButton这个控件的对齐方式有点不一样哦~是不可以使用"setAlignment"这个函数进行设置的,只能通"过setStyleSheet"进行QSS风格设置,这一点大家需要记住啦!

按钮中字体的对齐方式:left、right、top、bottom、center

QSS设置

左对齐:text-align:left;

右对齐:text-align:right;

居中:text-align:center;

内边距对齐:

        情况1:文本左对齐时,内边距设置。padding-left:10px;

        情况2:文本右对齐时,内边距设置。padding-right:10px;

4:内部显示图片

图片在右侧显示

显示效果,以文本右侧显示图片为例子,如下所示:

QSS方式:

QString strStyle = "QPushButton{font-family:Microsoft YaHei; font-size:12px; color:#666666;} "
"QPushButton{background-image:url(:/QtControl/image/2wm_p.png);"
"background-repeat:repeat-no-repeat;" //图片重复方式"background-position:right;""background-origin:content;""padding-right:15px;}";

说明:

1:在图片时,为什么使用background-image与2.2中的方式为何不一致?

因为border-image设置背景时,图片是拉伸填充的,在此处不需要。

2:background-repeat说明

该属性定义了图像的平铺模式。背景图像的位置是根据background-position属性设置的。如果未规定background-position属性,图像会被放置在元素的左上角。

3:background-position说明

位置关键字可以按任何顺序出现,只要保证不超过两个关键词。

如果只出现一个关键字,则认为另一个关键字是center。

4:background-origin 说明

相对于内容框来定位背景图像。

属性值:border(边框)、padding(填充)、context(内容)

图片在顶部,QSS设置方式:

QString strStyle = "QPushButton{font-family:Microsoft YaHei; font-size:12px; color:#666666;text-align:bottom;} "
"QPushButton{background-image:url(:/QtControl/image/2wm_p.png);"
"background-repeat:no-repeat;" "background-position:top;""background-origin:content;""padding:10px}";

图片左侧,QSS设置方式:

当图片在左侧时,相当于按钮的图标,则使用下面这种方式实现。

ui.btn->setIcon(QIcon(“:/QtControl/image/2wm_p.png”));
5:文本底部添加下划线

对于这个功能,很多情况下都会用到,前一阵子我也使用到了这个功能,索性分享给大家吧~

首先先看一下展示效果

下划线的长度是整个QPushButton的长度。

QSS的选中效果

sStyle = "QPushButton{ font-size:14px; font-family:Microsoft YaHei UI;color:#1576fc;background: transparent;border-width:2px;border-style:none none solid none;border-color:#1576fc;}";

QSS的未选中效果

sStyle = "QPushButton{ font-size:14px; font-family:Microsoft YaHei UI;color:#999999;background: transparent;border-width:2px;border-style:none none solid none;border-color:#cccccc;}";

总结

目前想到的功能也就这些啦~

如果还有想要实现却没法实现的功能,评论下说明我会更新的哦~

我是糯诺诺米团,一名C++开发程序媛~

这篇关于Qt|QPushButton控件讲解的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/660283

相关文章

Java进程CPU使用率过高排查步骤详细讲解

《Java进程CPU使用率过高排查步骤详细讲解》:本文主要介绍Java进程CPU使用率过高排查的相关资料,针对Java进程CPU使用率高的问题,我们可以遵循以下步骤进行排查和优化,文中通过代码介绍... 目录前言一、初步定位问题1.1 确认进程状态1.2 确定Java进程ID1.3 快速生成线程堆栈二、分析

VS配置好Qt环境之后但无法打开ui界面的问题解决

《VS配置好Qt环境之后但无法打开ui界面的问题解决》本文主要介绍了VS配置好Qt环境之后但无法打开ui界面的问题解决,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要... 目UKeLvb录找到Qt安装目录中designer.UKeLvBexe的路径找到vs中的解决方案资源

javascript fetch 用法讲解

《javascriptfetch用法讲解》fetch是一个现代化的JavaScriptAPI,用于发送网络请求并获取资源,它是浏览器提供的全局方法,可以替代传统的XMLHttpRequest,这篇... 目录1. 基本语法1.1 语法1.2 示例:简单 GET 请求2. Response 对象3. 配置请求

Java Stream.reduce()方法操作实际案例讲解

《JavaStream.reduce()方法操作实际案例讲解》reduce是JavaStreamAPI中的一个核心操作,用于将流中的元素组合起来产生单个结果,:本文主要介绍JavaStream.... 目录一、reduce的基本概念1. 什么是reduce操作2. reduce方法的三种形式二、reduce

Qt之QMessageBox的具体使用

《Qt之QMessageBox的具体使用》本文介绍Qt中QMessageBox类的使用,用于弹出提示、警告、错误等模态对话框,具有一定的参考价值,感兴趣的可以了解一下... 目录1.引言2.简单介绍3.常见函数4.按钮类型(QMessage::StandardButton)5.分步骤实现弹窗6.总结1.引言

Qt中Qfile类的使用

《Qt中Qfile类的使用》很多应用程序都具备操作文件的能力,包括对文件进行写入和读取,创建和删除文件,本文主要介绍了Qt中Qfile类的使用,具有一定的参考价值,感兴趣的可以了解一下... 目录1.引言2.QFile文件操作3.演示示例3.1实验一3.2实验二【演示 QFile 读写二进制文件的过程】4.

WinForms中主要控件的详细使用教程

《WinForms中主要控件的详细使用教程》WinForms(WindowsForms)是Microsoft提供的用于构建Windows桌面应用程序的框架,它提供了丰富的控件集合,可以满足各种UI设计... 目录一、基础控件1. Button (按钮)2. Label (标签)3. TextBox (文本框

CSS引入方式和选择符的讲解和运用小结

《CSS引入方式和选择符的讲解和运用小结》CSS即层叠样式表,是一种用于描述网页文档(如HTML或XML)外观和格式的样式表语言,它主要用于将网页内容的呈现(外观)和结构(内容)分离,从而实现... 目录一、前言二、css 是什么三、CSS 引入方式1、行内样式2、内部样式表3、链入外部样式表四、CSS 选

Qt实现网络数据解析的方法总结

《Qt实现网络数据解析的方法总结》在Qt中解析网络数据通常涉及接收原始字节流,并将其转换为有意义的应用层数据,这篇文章为大家介绍了详细步骤和示例,感兴趣的小伙伴可以了解下... 目录1. 网络数据接收2. 缓冲区管理(处理粘包/拆包)3. 常见数据格式解析3.1 jsON解析3.2 XML解析3.3 自定义

Python Transformers库(NLP处理库)案例代码讲解

《PythonTransformers库(NLP处理库)案例代码讲解》本文介绍transformers库的全面讲解,包含基础知识、高级用法、案例代码及学习路径,内容经过组织,适合不同阶段的学习者,对... 目录一、基础知识1. Transformers 库简介2. 安装与环境配置3. 快速上手示例二、核心模