QToolButton设置icon与字体居中

最新推荐文章于 2024-10-01 19:10:05 发布

道阻且长，行则降至

最新推荐文章于 2024-10-01 19:10:05 发布

阅读量1w

点赞数 2

分类专栏： Qt 文章标签： css qt qtoolbutton

本文链接：https://blog.csdn.net/liunanya/article/details/120324105

版权

Qt 专栏收录该内容

88 篇文章 24 订阅

订阅专栏

目的

设置QToolButton icon 与字体居中显示, 网上有挺多文章说明的，有些我设置了无效，我亲自测试了下，如下是有效果的

QToolButton{    
	color: #b9b9b9;
	font-size: 12px;
	font-weight: normal;
    border: 2px solid #b9b9b9; 
	border-radius: 3px;
	qproperty-icon: url(":/btn_pc_dis.png") center;
    qproperty-iconSize: 22px 22px;
	padding-left: 60px;// 具体依据实际button宽度结合显示的字符与icon 当时我设置 width > 109
}

还需要设置 setToolButtonStyle // 文字在图标旁边

ui->toolButton->setToolButtonStyle(Qt::ToolButtonTextBesideIcon);

在这里插入图片描述
还值得注意的是，如果你样式设置了width, height, 但在ui中width, height 与此不符合，会以ui中宽高为主。
如果需要文字与icon 有点间隔，需要该icon与设计的像素宽留有一定的间隙。

对此设计的话，
在这里插入图片描述
当有要求就是icon 在文字左边时，
在QPushButton 添加时icon 与文字时，它依然居中显示，相比之下在QToolButton添加时icon 与文字时，它却居左显示。在这种需求下时可以采用QPushButton。但是如果时文字在图标下面的话可能就只能采用QToolButton , 然后适当的采用宽高设计保证让图标与文字整个在中间.