一，前言

在3.QT懸浮窗口及TAB窗口--Apple的學(xué)習(xí)筆記基礎(chǔ)上，我繼續(xù)優(yōu)化界面，以前了解過qss可以向css一樣設(shè)置界面美觀的功能，反正將界面美化通過API實現(xiàn)到code中我覺得不太好，我情愿用qss的方式。后來了解到qml，以為qml是升級版的qss，后來了解到qml比qss強大，它可以代替c++。主要用來做原型設(shè)計吧，設(shè)計師用QT design stdio生成的就是qml，然后程序員看懂qml后轉(zhuǎn)換為c++邏輯。所以我本次僅在之前工程基礎(chǔ)上添加換膚美化功能。

二，需求

刻意練習(xí)：實現(xiàn)換膚功能

三，qss入門

qss入門比較簡單，會css就會qss。網(wǎng)上資料一大堆。最關(guān)鍵的就是顏色搭配學(xué)，這塊我網(wǎng)上搜索了下，居然有些非常棒的配色參考網(wǎng)站。然后搜索了下別人的qss，搜索到了別人打包的現(xiàn)成qss，直接拿來用了。主要用來體驗下?lián)Q膚功能。
本次練習(xí)并不涉及到paint重繪，對我沒有難度。只是讓我從空白開始寫的話，哪些關(guān)鍵參數(shù)需要設(shè)置并不清楚，看了別人的qss，基本上了解了些。關(guān)鍵代碼如下

void MainWindow::loadskin(QString path)
{
    QFile qss(path);
    if( qss.open(QFile::ReadOnly))
    {
        QString style = QLatin1String(qss.readAll());
        this->setStyleSheet(style);
        qss.close();
    }
    else
    {
        qDebug("Open failed");
    }
}

void MainWindow::on_changeSkin()
{
    if(m_skincnt%2)
    {
        loadskin(":./qss/Ubuntu.qss");
    }
    else
    {
        loadskin(":./qss/AMOLED.qss");
    }
    m_skincnt++;
}

網(wǎng)上還看到別人稍微復(fù)雜點的qss。指定方法，并且還關(guān)聯(lián)圖片

QTimeEdit::down-button,QDateEdit::down-button,QDateTimeEdit::down-button,QDoubleSpinBox::down-button,QSpinBox::down-button{
image:url(:/qss/darkblack/add_bottom.png);
width:10px;
height:10px;
padding:0px 5px 2px 0px;
}

四，效果

image.png

五，小結(jié)

UI美化一下，感覺更像一個完整的工具了。添加了換膚功能后，感覺更加高大上了。哈哈~