1. 程式人生 > >Qt中通過設定點陣圖掩碼生成異形控制元件【附原始碼】

Qt中通過設定點陣圖掩碼生成異形控制元件【附原始碼】

註釋:轉載的這篇部落格適用於不規則按鈕,目標區域外的透明部分點選無作用,目標區域內的透明部分點選有效果,當然設定按鈕掩碼所使用的圖片目標區域都是不透明的!

以下步驟是以按鈕為例,其他控制元件類似

①在QtDesigner中拖出一個按鈕或者在程式中生成一個按鈕。

②載入一個用來指定按鈕形狀的圖片:

QPixmap pixmap("images/left.png");//這裡是一個左箭頭

③呼叫此按鈕的setMask()函式來設定控制元件掩碼,引數是從pixmap中提取的點陣圖掩碼pixmap.mask():

ui->leftButton->setMask(pixmap.mask());

④注意:最好將圖片的大小剪裁成和控制元件一樣大,若圖片過大會出現只使用了圖片的一部分做遮掩,

若圖片過小則只能遮掩控制元件的一部分。

⑤到此為止只是將控制元件的形狀改變,若在控制元件上加上背景圖或圖表,會更漂亮:

ui->leftButton->setStyleSheet(
    "QPushButton{border-image:url(images/left.png);}"
    "QPushButton:hover{border-image:url(images/left2.png);}"
    "QPushButton:pressed{border-image:url(images/left3.png)
;}
");

這裡是通過QSS設定了按鈕的常態、指標懸停、按下三個狀態的背景圖。

下面的例項是視訊監控系統中用到的八方向雲臺控制的操作盤原型,每個方向都是用箭頭圖片做掩碼後生成的異形按鈕。

效果如圖:
這裡寫圖片描述

常態:
這裡寫圖片描述

滑鼠懸停:
這裡寫圖片描述

按鈕被按下

原始碼下載地址:

使用者名稱與密碼都是www.linuxidc.com

具體下載目錄在 /2013年資料/4月/22日/Qt中通過設定點陣圖掩碼生成異形控制元件