2. 程式人生 > >Qt自定義按鈕及不同狀態下圖片的切換

Qt自定義按鈕及不同狀態下圖片的切換

阿新 • • 發佈：2017-07-18
q自定義窗體、任意形狀的窗體、qt自定義按鈕

    好久沒有使用Qt了，最近在做窗體時做了一個自定義的鈕銨，剛開始是想通過修改其MASK和ICON的
方式來實現。確發現效果總是不太如意，如是幹脆自已定義了一個XPushButton。也將其實現方式記錄發
布出來。以方便日後自已使用和給有相應問題的朋友一個小小的提示。
    為了實現任意形狀的窗體和保留QPushButton的特性，繼承QPushButton創建一個子類。

class QtXPushButton : public QPushButton
{
    Q_OBJECT

public:
    QtXPushButton(QString strImagePath, QWidget *parent = NULL);
    ~QtXPushButton();
}

為了方便描述按鈕正常、鼠標滑動、選取狀態、禁止點擊狀態定義一個狀態枚舉。

//按鈕狀態
enum XBUTTONSTATE
{
NORMAL = 0X01,//正常狀態
HOVER = 0X02,//鼠標滑過狀態
SELECTED = 0X04,//選中狀態
DISABLE = 0X08//禁止點擊狀態
};


為了方便設置個程狀態的圖標，添加狀態圖標設置接口，並設置一個標識表明設置了哪些狀態。

//設置正常圖標
void SetNormalPixmap(QString strImagePath);
//設置鼠標滑動圖片
void SetHoverPixmap(QString strImagePath);
//設置選中狀態圖片
void SetSelectedPixmap(QString strImagePath);

//設置禁止點擊圖標
void SetDisablePixmap(QString strImagePath);
//設置按鈕當前狀態

void SetBtnState(XBUTTONSTATE state);
//設置圖片大小
void SetSize(QSize sz);


至此一個具有設置正常、鼠標滑動、選中、禁止點擊功能的按鈕的接口就定義好了。這個子類的最終定義如下。

#pragma once

#include <QPushButton>
#include <QString>
#include <QWidget>
#include <QPixmap>

//按鈕狀態
enum XBUTTONSTATE

{
NORMAL = 0X01,//正常狀態
HOVER = 0X02,//鼠標滑過狀態
SELECTED = 0X04,//選中狀態
DISABLE = 0X08//禁止點擊狀態
};

class QtXPushButton : public QPushButton
{
Q_OBJECT

public:
QtXPushButton(QString strImagePath, QWidget *parent = NULL);
~QtXPushButton();

//設置正常圖標
void SetNormalPixmap(QString strImagePath);
//設置鼠標滑動圖片
void SetHoverPixmap(QString strImagePath);
//設置選中狀態圖片
void SetSelectedPixmap(QString strImagePath);
//設置禁止點擊圖標
void SetDisablePixmap(QString strImagePath);
//設置按鈕當前狀態
void SetBtnState(XBUTTONSTATE state);
//設置圖片大小
void SetSize(QSize sz);

protected:
virtual void paintEvent(QPaintEvent *event);
virtual void enterEvent(QEvent *event);
virtual void leaveEvent(QEvent *event);



private:
QtXPushButton(const QtXPushButton& btn);
QtXPushButton& operator=(const QtXPushButton& btn);

private:
QPixmap m_NormalPix;//正常圖標
QPixmap m_HoverPix;//鼠標滑動圖標
QPixmap m_SelectedPix;//選中狀態圖標
QPixmap m_DisablePix;//禁止點擊圖標
int m_iMask;//包含1則啟動正常圖標，包含2啟用滑動圖標，包含4啟用選中狀態圖標，包含8啟用禁止點擊圖標，默認標為1.
XBUTTONSTATE m_curState;//當前狀態
XBUTTONSTATE m_lastState;//上一次狀態
};


接下來實現其相應功能。實現一個不規則的窗體大至需要做兩個動作。

（1）通過REGON或者MASK確定其邊框，在構造函數中添加如下代碼：

QtXPushButton::QtXPushButton(QString strImagePath, QWidget *parent)
:QPushButton(parent)
{
m_NormalPix.load(strImagePath);
resize(m_NormalPix.size());
setMask(QBitmap(m_NormalPix.mask()));
m_iMask = XBUTTONSTATE::NORMAL;
m_curState = XBUTTONSTATE::NORMAL;
m_lastState = XBUTTONSTATE::NORMAL;
}



（2）在窗體繪制時將圖片繪制於其上，重載其繪圖函數，添加如下代碼。

void QtXPushButton::paintEvent(QPaintEvent *event)
{
QPainter painter(this);
painter.drawPixmap(0, 0, m_NormalPix);
}


上面兩個步驟可以實現一個任意規則的自定義窗體，其下來實現其在不同狀態下的圖片的切換。

設置不同狀態的圖片，這裏以鼠標滑動方式為例。由於鼠標進入窗體區域後就應當設置為鼠標滑動狀態，重載窗體的鼠標進入和鼠標離開區域來監測其狀態。

//設置鼠標滑動圖片
void QtXPushButton::SetHoverPixmap(QString strImagePath)
{
m_HoverPix.load(strImagePath);
m_iMask |= XBUTTONSTATE::HOVER;
}


//重載鼠標進入和移出事件

void QtXPushButton::enterEvent(QEvent *event)
{
SetBtnState(XBUTTONSTATE::HOVER);
QPushButton::enterEvent(event);
update();
}

void QtXPushButton::leaveEvent(QEvent *event)
{
m_curState = m_lastState;
QPushButton::leaveEvent(event);
update();
}


//用指定圖片重繪窗體

void QtXPushButton::paintEvent(QPaintEvent *event)
{
QPixmap drawPix;

if (m_curState == XBUTTONSTATE::NORMAL)
{
drawPix = m_NormalPix;
}
else if (m_curState == XBUTTONSTATE::HOVER)
{
int iValue = m_iMask&XBUTTONSTATE::HOVER;
drawPix = (0 == iValue) ? m_NormalPix : m_HoverPix;
}
else if (m_curState == XBUTTONSTATE::SELECTED)
{
int iValue = m_iMask&XBUTTONSTATE::SELECTED;
drawPix = (0 == iValue) ? m_NormalPix : m_SelectedPix;
}
else if (m_curState == XBUTTONSTATE::DISABLE)
{
int iValue = m_iMask&XBUTTONSTATE::DISABLE;
drawPix = (0 == iValue) ? m_NormalPix : m_DisablePix;
}

QPainter painter(this);
painter.drawPixmap(0, 0, drawPix);
}


經過上述過程鼠標進入按鈕區域，按鈕會顯示HOVER圖片。鼠標移出按鈕區域，按鈕會顯示鼠標進入之前的狀態。


程序完全源碼如下：

#include "QtXPushButton.h"
#include <QBitmap>
#include <QPainter>

QtXPushButton::QtXPushButton(QString strImagePath, QWidget *parent)
:QPushButton(parent)
{
m_NormalPix.load(strImagePath);
resize(m_NormalPix.size());
setMask(QBitmap(m_NormalPix.mask()));
m_iMask = XBUTTONSTATE::NORMAL;
m_curState = XBUTTONSTATE::NORMAL;
m_lastState = XBUTTONSTATE::NORMAL;
}

QtXPushButton::~QtXPushButton()
{
}

//設置正常圖標
void QtXPushButton::SetNormalPixmap(QString strImagePath)
{
m_NormalPix.load(strImagePath);
m_iMask |= XBUTTONSTATE::NORMAL;
}

//設置鼠標滑動圖片
void QtXPushButton::SetHoverPixmap(QString strImagePath)
{
m_HoverPix.load(strImagePath);
m_iMask |= XBUTTONSTATE::HOVER;
}

//設置選中狀態圖片
void QtXPushButton::SetSelectedPixmap(QString strImagePath)
{
m_SelectedPix.load(strImagePath);
m_iMask |= XBUTTONSTATE::SELECTED;
}

//設置禁止點擊圖標
void QtXPushButton::SetDisablePixmap(QString strImagePath)
{
m_DisablePix.load(strImagePath);
m_iMask |= XBUTTONSTATE::DISABLE;
}

//設置按鈕當前狀態
void QtXPushButton::SetBtnState(XBUTTONSTATE state)
{
m_lastState = m_curState;
m_curState = state;
}

//設置圖片大小
void QtXPushButton::SetSize(QSize sz)
{
m_NormalPix = m_NormalPix.scaled(sz);
int iValue = m_iMask&XBUTTONSTATE::HOVER;

if (iValue != 0)
{
m_HoverPix = m_HoverPix.scaled(sz);
}

iValue = m_iMask&XBUTTONSTATE::SELECTED;

if (iValue != 0)
{
m_SelectedPix = m_SelectedPix.scaled(sz);
}

iValue = m_iMask&XBUTTONSTATE::DISABLE;

if (iValue != 0)
{
m_DisablePix = m_DisablePix.scaled(sz);
}
}

void QtXPushButton::paintEvent(QPaintEvent *event)
{
QPixmap drawPix;

if (m_curState == XBUTTONSTATE::NORMAL)
{
drawPix = m_NormalPix;
}
else if (m_curState == XBUTTONSTATE::HOVER)
{
int iValue = m_iMask&XBUTTONSTATE::HOVER;
drawPix = (0 == iValue) ? m_NormalPix : m_HoverPix;
}
else if (m_curState == XBUTTONSTATE::SELECTED)
{
int iValue = m_iMask&XBUTTONSTATE::SELECTED;
drawPix = (0 == iValue) ? m_NormalPix : m_SelectedPix;
}
else if (m_curState == XBUTTONSTATE::DISABLE)
{
int iValue = m_iMask&XBUTTONSTATE::DISABLE;
drawPix = (0 == iValue) ? m_NormalPix : m_DisablePix;
}

QPainter painter(this);
painter.drawPixmap(0, 0, drawPix);
}

void QtXPushButton::enterEvent(QEvent *event)
{
SetBtnState(XBUTTONSTATE::HOVER);
QPushButton::enterEvent(event);
update();
}

void QtXPushButton::leaveEvent(QEvent *event)
{
m_curState = m_lastState;
QPushButton::leaveEvent(event);
update();
}



Qt自定義按鈕及不同狀態下圖片的切換

相關推薦

Qt自定義按鈕及不同狀態下圖片的切換

q自定義窗體、任意形狀的窗體、qt自定義按鈕 好久沒有使用Qt了，最近在做窗體時做了一個自定義的鈕銨，剛開始是想通過修改其MASK和ICON的 方式來實現。確發現效果總是不太如意，如是幹脆自已定義了一個XPushButton。也將其實現方式記錄發 布出來。以方便日後自已使用和給有相應問題的朋友一個小小的

VUE/使用echarts格式化浮窗自定義按鈕及事件

注意看這一段程式碼    mounted() {             let that=this;       window.detal = function () { &n

Qt自定義按鈕彈窗控制元件

  一直以為做一個按鈕彈窗控制元件很簡單，可做起來發現並不是那麼順利，折騰了挺長時間的，先看下效果： 前言   嘗試過兩種方案，方案一：使用QToolButton控制元件，我們可以自定義一個widget，然後setMenu設定為該widget；方案二：點選一個

Qt自定義標簽按鈕

cpp -c mit idg 方便 class als ren 中心 當你接觸到Qt時，你會為它極為方便的跨平臺方面感到吃驚，從而想嘗試著使用Qt。漸漸地你會發現Qt自帶的一些控件不能滿足自己的需要，此時就需要我們自己定義一個屬於自己的控件。總所周知，標簽的風格設置類比較多

QSet使用及Qt自定義類型使用QHash等算法

算法 har 地址 node slc doc support ati tarray 版權聲明：若無來源註明，Techie亮博客文章均為原創。 轉載請以鏈接形式標明本文標題和地址： 本文標題：QSet使用及Qt自定義類型使用QHash等算法 本文地址：http://

29.QT-自定義窗口拖動、自定義QToolButton/QPushButton開關按鈕、界面陰影

正常 cmt ntb for connect 測試 tails mic 狀態 自定義窗口及拖動 1.自定義無邊框窗口時,需要將窗口標誌設為: Qt::FramelessWindowHint |Qt::WindowSystemMenuHint | Qt::Window

Qt自定義無邊框介面（可放大、縮小及拖動）

Qt自定義無邊框介面 使用者介面(User Interface)是指對軟體的人機互動、操作邏輯、介面美觀的整體設計。好的UI設計不僅是讓軟體變得有個性有品味，還要讓軟體的操作變得舒適、簡單、自由、充分體現軟體的定位和特點。很多時候，Qt本地樣式可能無法實現讓我們的介面更簡化、美觀，那麼這

ViewPager實現自動輪播及按壓及滑動狀態下停止自動輪播

ViewPager實現自動輪播及按壓及滑動狀態下停止自動輪播 /** * 設定自動輪播 *@param viewpager viewpage物件 *@param pauseTime 跳轉延時時間 * @param size viewpa

Qt學習之路之自定義按鈕

按鈕有三種狀態：當滑鼠點選的時候，當滑鼠進入按鈕的時候，當滑鼠沒有進入按鈕的時候，這3個不同的狀態。 上程式碼~~~~ pushBtn_widget.h  /* 貼圖按鈕的狀態： 進入， 離開， 按下 */ #ifndef PUSHBTNWIDGET_H #def

ABAP狀態列將自定義按鈕置灰

由於目前不能上傳站外圖片，遺憾~~~~~ 1.SE38 建立程式名為：ZLRB_001 2.SE41 為程式建立狀態為：TEST001，建立兩個測試按鈕。CS1        CS2測試一     測試二3. 在選單欄 ‘GOTO ’->  ‘Attributes’ -

Qt 中 QLabel 自定義文字的顏色狀態，設定為三種狀態（類似於Qcheckbutton裡面的checked unchecked）

1  自定義設定Qlabel文字顏色狀態。 別的類可以進行類推 #ifndef QCOMPLEXLABEL_H #define QCOMPLEXLABEL_H #include <QObject> #include <QWidget> #inclu

Qt實現自定義按鈕的三態效果

好久之前做的一個小軟體，好長時間沒動過了，在不記錄下有些細節可能都忘了，這裡整理下部分功能的實現。 按鈕的三態，指的是普通態、滑鼠的停留態、點選態，三態是介面互動非常基本的一項功能，Qt中如果使用的是原始的按鈕，三態的效果是有的，滑鼠放上去會變色，點選的時候有凹陷的效果，工具欄中的圖示也具備三態效果，但是如

Android設定Selector不同狀態下顏色及圖片

Selector常用狀態： android:state_selected 控制元件選中狀態，可以為true或false android:state_focused 控制元件獲得焦點狀態，可以為true或false android:state_pressed 控制元件點選狀態

Qt編寫自定義控制元件52-顏色下拉框

一、前言 這個控制元件寫了很久了，元老級別的控制元件之一，開發之初主要是自己的好幾個專案要用到，比如提供一個顏色下拉框設定對應的曲

ckeditor添加自定義按鈕整合swfupload實現批量上傳圖片

下載 了解 nbsp 文件 mouseover 去掉 dial size pro ckeditor添加自定義按鈕整合swfupload實現批量上傳圖片給ckeditor添加自定義按鈕，由於ckeditor只能上傳一張圖片，如果要上傳多張圖片就要結合ckfinder，而ckf

IOS 自定義按鈕（代碼實現）＋九宮格

uifont 排列 end uiview height iyu void rec name 在一些下載應用裏整個頁面都是按鈕，有好多好多，但是仔細觀察不難發現他們很有規律。就像下面一樣?? 很有規律的排列在屏幕上，那麽這需要我們怎麽去做能。 正如標題，我們需要了解兩個知

CKEditor 自定義按鈕插入服務端圖片

自定義按鈕 asp lap .get extra 版本 icp java conf CKEditor 富文本編輯器很好用，功能很強大，在加上支持服務端圖片上傳的CKFinder更是方便， 最近在使用CKFinder的時候發現存在很多問題，比如上傳圖片的時候，圖片不能按時間

001_自定義過濾及添加文件內容腳本(nginx)

parser sys idt fin rip readlines pat utf default 一、工作中遇到sed添加及修改在nginx末尾添加太麻煩了 需求:隨意查找添加一條以前不存在的內容加到"}"前一行 實現: #!/usr/bin/env python #

編寫可復用的自定義按鈕

可復用 定義 ongl aid music 編寫 自定義 按鈕 自定義按鈕 %E4%B8%80%E4%B8%AA%E5%B1%85%E5%BA%95%E6%98%BE%E7%A4%BA%E7%9A%84TaBHOsT http://music.baidu.com/songl

自定義@interface及groups校驗

groups @interface一、自定義annotation摘自：http://elim.iteye.com/blog/1812584@Target({ElementType.FIELD, ElementType.METHOD}) @Retention(RetentionPolicy.RUNTIME)