Qt 自定義 滾動條 樣式

2022-03-08 06:58:06 字數 1375 閱讀 6918

今天是時候把軟體中的進度條給美化美化了,最初的想法就是仿照qq。

qt設定樣式的方式有兩種,一種直接在程式中寫,適用於樣式不多的情況;另一種,寫入到檔案中,適用用樣式較大且需要提供換膚功能的情況。

1.寫入到檔案中,新建個xx.qss,然後複製一下內容

// 設定垂直滾動條基本樣式

qscrollbar:vertical

qscrollbar::handle:vertical

qscrollbar::handle:vertical:hover

qscrollbar::add-line:vertical // 這個應該是設定下箭頭的,3.png就是箭頭

qscrollbar::sub-line:vertical // 設定上箭頭

qscrollbar::add-line:vertical:hover // 當滑鼠放到下箭頭上的時候

qscrollbar::sub-line:vertical:hover // 當滑鼠放到下箭頭上的時候

qscrollbar::add-page:vertical,qscrollbar::sub-page:vertical // 當滾動條滾動的時候,上面的部分和下面的部分

接著在程式中讀取檔案

qfile file("

:/scrollbar.qss");

file.open(qfile::readonly);

listwidget->verticalscrollbar()->setstylesheet(file.readall());

2.直接在程式中設定,簡單

listwidget->verticalscrollbar()->setstylesheet("

qscrollbar:vertical""

""qscrollbar::handle:vertical""

""qscrollbar::handle:vertical:hover""

""qscrollbar::add-line:vertical""

""qscrollbar::sub-line:vertical""

""qscrollbar::add-line:vertical:hover""

""qscrollbar::sub-line:vertical:hover""

""qscrollbar::add-page:vertical,qscrollbar::sub-page:vertical""

");

滾動條有兩種,水平的和垂直的,我這裡面只設定了垂直的,水平的其實差不多,只需要把 vertical 換成 horizontal。

更多的自定義樣式可以參考有點亂不過還能用,具體的意思我在上面已經新增注釋。

自定義滾動條樣式

webkit scrollbar 滾動條整體部分 webkit scrollbar button 滾動條兩端的按鈕 webkit scrollbar track 外層軌道 webkit scrollbar track piece 內層軌道,滾動條中間部分 除去 webkit scrollbar th...

自定義滾動條樣式

乙個完整滾動條右以下部分組成 webkit scrollbar 滾動條整體部分,常用屬性 width,height,background,border webkit scrollbar button 滾動條兩邊的按鈕,預設不設定時不顯示,可設定高度 背景色 背景 webkit scrollbar t...

自定義滾動條的樣式

class class content lorem ipsum dolor sit amet,consectetur adipisicing elit.nulla vitae modi rerum natus numquam id ut harum aperiam.aliquid illo ad e...