PyQt5中qss属性border-radius不起作用的原因分析以及解决方法

现象

  • 在做一个pyqt5界面美化的时候,明明针对QPushButton进行了border-radius属性的配置,但是相关的button只有颜色变了,但是形状没变

相关文件:record.ui,record.py,call_record.py

用Qt Desinger绘制的ui,如下图所示

record.py(已由record.ui转化)

# -*- coding: utf-8 -*-

# Form implementation generated from reading ui file 'record.ui'
#
# Created by: PyQt5 UI code generator 5.11.3
#
# WARNING! All changes made in this file will be lost!

from PyQt5 import QtCore, QtGui, QtWidgets

class Ui_MainWindow(object):
    def setupUi(self, MainWindow):
        MainWindow.setObjectName("MainWindow")
        MainWindow.resize(550, 469)
        self.centralwidget = QtWidgets.QWidget(MainWindow)
        self.centralwidget.setObjectName("centralwidget")
        self.label = QtWidgets.QLabel(self.centralwidget)
        self.label.setGeometry(QtCore.QRect(260, 130, 72, 15))
        self.label.setObjectName("label")
        self.label_2 = QtWidgets.QLabel(self.centralwidget)
        self.label_2.setGeometry(QtCore.QRect(190, 150, 231, 101))
        self.label_2.setObjectName("label_2")
        self.Btn_R = QtWidgets.QPushButton(self.centralwidget)
        self.Btn_R.setGeometry(QtCore.QRect(180, 250, 211, 101))
        self.Btn_R.setText("")
        self.Btn_R.setObjectName("Btn_R")
        self.Btn1 = QtWidgets.QPushButton(self.centralwidget)
        self.Btn1.setGeometry(QtCore.QRect(22, 31, 41, 28))
        self.Btn1.setText("")
        self.Btn1.setObjectName("Btn1")
        self.Btn2 = QtWidgets.QPushButton(self.centralwidget)
        self.Btn2.setGeometry(QtCore.QRect(70, 31, 41, 28))
        self.Btn2.setText("")
        self.Btn2.setObjectName("Btn2")
        self.Btn3 = QtWidgets.QPushButton(self.centralwidget)
        self.Btn3.setGeometry(QtCore.QRect(118, 31, 41, 28))
        self.Btn3.setText("")
        self.Btn3.setObjectName("Btn3")
        MainWindow.setCentralWidget(self.centralwidget)
        self.menubar = QtWidgets.QMenuBar(MainWindow)
        self.menubar.setGeometry(QtCore.QRect(0, 0, 550, 26))
        self.menubar.setObjectName("menubar")
        MainWindow.setMenuBar(self.menubar)
        self.statusbar = QtWidgets.QStatusBar(MainWindow)
        self.statusbar.setObjectName("statusbar")
        MainWindow.setStatusBar(self.statusbar)

        self.retranslateUi(MainWindow)
        QtCore.QMetaObject.connectSlotsByName(MainWindow)

    def retranslateUi(self, MainWindow):
        _translate = QtCore.QCoreApplication.translate
        MainWindow.setWindowTitle(_translate("MainWindow", "MainWindow"))
        self.label.setText(_translate("MainWindow", "语音识别"))
        self.label_2.setText(_translate("MainWindow", "点击下面的按钮开始录制音频\n"
"再次点击停止录音开始识别"))

在call_record.py中针对左上角的三个Btn进行qss样式设置如下

        self.Btn1.setStyleSheet('''QPushButton{background:#F76677;border-radius:15px;}
        QPushButton:hover{background:red;}''')
        self.Btn2.setStyleSheet('''QPushButton{background:#F7D674;border-radius:15px;}
        QPushButton:hover{background:yellow;}''')
        self.Btn3.setStyleSheet('''QPushButton{background:#6DDF6D;border-radius:15px;}
        QPushButton:hover{background:green;}''')

运行后生成如下界面(仅颜色变了,但形状没变)

我想要的效果

原因:

  • 用Qt Designer绘制的ui会对左上角的三个button的形状有一定的限制,如果想要达到按钮编程圆形的效果,需要先对button的属性进行一些重构

解决方法:

  • 在call_record.py中,添加
self.Btn1.setGeometry(QtCore.QRect(30, 20, 30, 30))
self.Btn2.setGeometry(QtCore.QRect(80, 20, 30, 30))
self.Btn3.setGeometry(QtCore.QRect(130, 20, 30, 30))
self.Btn_R.setGeometry(QtCore.QRect(190, 250, 101, 71))
self.label.setGeometry(QtCore.QRect(80, 60, 351, 70))
self.label_2.setGeometry(QtCore.QRect(80, 130, 351, 91))

代码:

参考资料:

发布了54 篇原创文章 · 获赞 65 · 访问量 15万+
展开阅读全文

没有更多推荐了,返回首页

©️2019 CSDN 皮肤主题: 大白 设计师: CSDN官方博客

分享到微信朋友圈

×

扫一扫,手机浏览