如何将QLineEdit背景变成进度条

Question

该代码使用 QLineEdit 和 QPushButton 创建了一个对话框。单击按钮时，我希望 QLineEdit 变成一个进度条，显示按下按钮触发的进程的进度。该过程完成后，QLineEdit 应该会恢复到正常的 "LineEdit" 外观。如何实现？

这是 Photoshop 编辑的想法：

进度条可以是 QLineEdit 底部的一条细线：

from PyQt4 import QtCore, QtGui
import time

class Dialog(QtGui.QDialog):
    def __init__(self, parent=None):
        QtGui.QDialog .__init__(self, parent)
        mainLayout = QtGui.QVBoxLayout()
        lineEdit = QtGui.QLineEdit('ITEM 001')
        mainLayout.addWidget(lineEdit)
        button = QtGui.QPushButton('Push Button')
        button.clicked.connect(self.buttonClicked)
        mainLayout.addWidget(button)
        self.setLayout(mainLayout)

    def buttonClicked(self):
        print 'button clicked'
        for i in range(3):
            time.sleep(1)
            print '...processing %s'%i

if __name__ == '__main__':
    app = QtGui.QApplication([])
    window = Dialog()
    window.resize(300, 50)
    window.show()
    app.exec_()

Answer 1

在 PyQt4 中，QLinearGradient 获得水平方向。虽然 PySide 似乎处理它就像它是一个垂直渐变。该代码创建了一个 QLineEdit，其背景颜色通过 palette.setBrush(QPalette.Base, QBrush(QLinearGradient)) 设置。按下按钮将进度条值提高 10%。

from PyQt4 import QtCore, QtGui
import time


class Dialog(QtGui.QDialog):
    value = 0.001
    def __init__(self, parent=None):
        QtGui.QDialog .__init__(self, parent)
        mainLayout = QtGui.QVBoxLayout()

        self.lineedit = QtGui.QLineEdit()
        self.setValues()
        mainLayout.addWidget(self.lineedit)
        button = QtGui.QPushButton('Calculate')
        button.clicked.connect(self.buttonClicked)
        mainLayout.addWidget(button)
        self.setLayout(mainLayout)

    def setValues(self):
        self.lineedit.setText('progress %s'%self.value)
        palette = self.lineedit.palette()
        QRectF = QtCore.QRectF(self.lineedit.rect())
        gradient = QtGui.QLinearGradient(QRectF.topLeft(), QRectF.topRight())
        gradient.setColorAt(self.value-0.001, QtGui.QColor('#f99e41'))
        gradient.setColorAt(self.value, QtGui.QColor('#ffffff'))
        gradient.setColorAt(self.value+0.001, QtGui.QColor('#ffffff'))
        palette.setBrush(QtGui.QPalette.Base, QtGui.QBrush(gradient))
        self.lineedit.setPalette(palette)

    def buttonClicked(self):
        if self.value >0.9:
            self.value = 0.001
        else:
            self.value=self.value+0.1

        self.setValues()
        time.sleep(1)

if __name__ == '__main__':
    app = QtGui.QApplication([])
    window = Dialog()
    window.resize(300, 50)
    window.show()
    app.exec_()

对于梯度可能是水平的 PySide：

import PySide.QtCore as QtCore
import PySide.QtGui as QtGui

class Dialog(QtGui.QDialog):
    value = 1.00
    def __init__(self, parent=None):
        QtGui.QDialog .__init__(self, parent)
        mainLayout = QtGui.QVBoxLayout()

        self.lineedit = QtGui.QLineEdit()
        self.setValues()
        mainLayout.addWidget(self.lineedit)
        button = QtGui.QPushButton('Calculate')
        button.clicked.connect(self.buttonClicked)
        mainLayout.addWidget(button)
        self.setLayout(mainLayout)

    def setValues(self):
        self.lineedit.setText('progress %s'%self.value)
        palette = self.lineedit.palette()
        QRectF = QtCore.QRectF(self.lineedit.rect())
        gradient = QtGui.QLinearGradient(QRectF.topLeft(), QRectF.topRight())
        gradient.setColorAt(self.value-0.001, QtGui.QColor('#ffffff'))
        gradient.setColorAt(self.value, QtGui.QColor('#f99e41'))
        gradient.setColorAt(self.value+0.001, QtGui.QColor('#f99e41'))
        palette.setBrush(QtGui.QPalette.Base, QtGui.QBrush(gradient))
        self.lineedit.setPalette(palette)

    def buttonClicked(self):
        if self.value <0.1:
            self.value = 1.00
        else:
            self.value=self.value-0.1

        self.setValues()


if __name__ == '__main__':
    app = QtGui.QApplication([])
    window = Dialog()
    window.resize(300, 50)
window.show()
app.exec_()

Answer 2

if progress < 99:
    percent = progress / 100
    self.lineedit.setStyleSheet('background: qlineargradient(x1:0, y1:0, x2:1, y2:0, stop: 0 #1bb77b, stop: ' + str(percent) + ' #1bb77b, stop: ' + str(percent+ 0.001) + ' rgba(0, 0, 0, 0), stop: 1 white)')

else:
    self.lineedit.setStyleSheet('background-color: white')

如何将QLineEdit背景变成进度条

How to turn QLineEdit background into a Progress Bar

python

qt

pyqt

qprogressbar

qlineedit