QSS之QLineEdit

 QLineEdit我们在开发过程中是经常使用的，一般情况下默认的风格是不适合设计师的要求，本篇介绍QLineEdit的基本qss风格：

1.基本属性设置

QLineEdit{background-color:#FFFFFF;color:#333333;border:none;}

2.悬浮状态设置

QLineEdit:hover{color:#333333;border:none;}

3.获取焦点设置

QLineEdit:focus{color:#333333;border-radius:2px;border:2px solid #2F89FC;}

4.不可用状态设置

QLineEdit:disabled{background-color:#F0F0F0;border-radius:8px;}

这里面的背景色，圆角度，边框，文字颜色都可以按自己的要求来设计，

下面看几种风格的校果

QString strLineEditStyle = QString("QLineEdit{background-color:#FFFFFF;color:#333333;border:none;}"
                                   "QLineEdit:hover{color:#333333;border:none;}"
                                   "QLineEdit:focus{color:#333333;border-radius:2px;border:2px solid #2F89FC;}"
                                   "QLineEdit:disabled{background-color:#F0F0F0;border-radius:8px;}");

//灰底
    QString strLineEditStyle2 = QString("QLineEdit{background-color:#E9E9EA;color:#6D6E6B;border-radius:5px;}"
                                       "QLineEdit:hover{background-color:#E9E9EA;border-radius:5px;border:2px solid rgba(47, 137, 252, 1);}"
                                       "QLineEdit:focus{background-color:#E9E9EA;border-radius:5px;border:2px solid rgba(47, 137, 252, 1);}"
                                       "QLineEdit:disabled{background-color:#F0F0F0;border-radius:5px;}");

//白底
    QString strLineEditStyle3 = QString("QLineEdit{background-color:#FFFFFF;color:#6D6E6B;border-radius:8px;border:2px solid #E8EAEC;}"
                                       "QLineEdit:hover{color:#6D6E6B;border-radius:8px;border:2px solid #2F89FC;}"
                                       "QLineEdit:focus{color:#6D6E6B;border-radius:8px;border:2px solid #2F89FC;}"
                                       "QLineEdit:disabled{background-color:#F0F0F0;border-radius:8px;}");

不可用状态校果

完整理代码如下：

#include "qlineeditdemo.h"
#include "ui_qlineeditdemo.h"
 
 
QLineEditDemo::QLineEditDemo(QWidget *parent)
    : QMainWindow(parent)
    , ui(new Ui::QLineEditDemo)
{
    ui->setupUi(this);
    initView();
}
 
QLineEditDemo::~QLineEditDemo()
{
    delete ui;
}
 
void QLineEditDemo::initView()
{
    QString strLineEditStyle = QString("QLineEdit{background-color:#FFFFFF;color:#333333;border:none;}"
                                       "QLineEdit:hover{color:#333333;border:none;}"
                                       "QLineEdit:focus{color:#333333;border-radius:2px;border:2px solid #2F89FC;}"
                                       "QLineEdit:disabled{background-color:#F0F0F0;border-radius:8px;}");
 
    //灰底
    QString strLineEditStyle2 = QString("QLineEdit{background-color:#E9E9EA;color:#6D6E6B;border-radius:5px;}"
                                       "QLineEdit:hover{background-color:#E9E9EA;border-radius:5px;border:2px solid rgba(47, 137, 252, 1);}"
                                       "QLineEdit:focus{background-color:#E9E9EA;border-radius:5px;border:2px solid rgba(47, 137, 252, 1);}"
                                       "QLineEdit:disabled{background-color:#F0F0F0;border-radius:5px;}");
    //白底
    QString strLineEditStyle3 = QString("QLineEdit{background-color:#FFFFFF;color:#6D6E6B;border-radius:8px;border:2px solid #E8EAEC;}"
                                       "QLineEdit:hover{color:#6D6E6B;border-radius:8px;border:2px solid #2F89FC;}"
                                       "QLineEdit:focus{color:#6D6E6B;border-radius:8px;border:2px solid #2F89FC;}"
                                       "QLineEdit:disabled{background-color:#F0F0F0;border-radius:8px;}");
 
    QFont font = qApp->font();
    font.setPixelSize(14);
 
    ui->lineEdit->setStyleSheet(strLineEditStyle);
    ui->lineEdit_2->setStyleSheet(strLineEditStyle2);
    ui->lineEdit_3->setStyleSheet(strLineEditStyle3);
   
    ui->lineEdit->setFont(font);
    ui->lineEdit_2->setFont(font);
    ui->lineEdit_3->setFont(font);
    
    ui->lineEdit_4->setText("disabled");
    ui->lineEdit_4->setStyleSheet(strLineEditStyle3);
    ui->lineEdit_4->setEnabled(false);
    ui->lineEdit_4->setFont(font);
}
 

#include "qlineeditdemo.h"
 
#include 
 
int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    QFont defaultFont = qApp->font();
    defaultFont.setFamily("Microsoft YaHei");
    qApp->setFont(defaultFont);
    QLineEditDemo w;
    w.show();
    return a.exec();
}

运行结果：