qt 界面翻转特效_使用Qt实现超酷炫窗口特效

Hello，大家好，今天给大家分享个比较有趣的小示例，按钮特效，具体效果如下图所示

 

下面，我们来看看它是如何实现的。

按钮特效，需要用到QWidget的方法：

void QWidget::setGraphicsEffect(QGraphicsEffect *effect)

QGraphicsEffect类是窗口特效的基类，基于该基类，Qt提供了四种便捷类： 

不加特效的正常图片

 

1 QGraphicsBlurEffect //模糊特效

 

2 QGraphicsColorizeEffect //颜色特效 

3 QGraphicsOpacityEffect //透明度特效 

4 QGraphicsDropShadowEffect //阴影特效

示例中的按钮使用了阴影特效，其它特效用法类似。 

新建一个GUI工程，取名为SwitchButtonWidget ui界面为： 

按钮命名格式为“btn行号列号”，并且将这些QPushButton提升为MyButton，MyButton我们后面再定义。

使用这样的命名规则是为了当按下方向键(上下左右键)方便将焦点框切换到对应的按钮上

 

右键，修改样式表，修改窗口的样式为：

QPushButton {

border-radius: 4px;

border: none;

width: 35px;

height: 35px;

color: rgb(180, 0, 0);

font: bold 25px;

}

QPushButton:hover {

background: rgb(85, 85, 85);

}

QPushButton:pressed{

background: rgb(80, 80, 80);

}

QWidget {

border: 1px solid "#222222";

background-color: "#222222";

}

switchbuttonwidget.h

#ifndef SWITCHBUTTONWIDGET_H

#define SWITCHBUTTONWIDGET_H

#include <QtWidgets>

#include "controltable.h"

namespace Ui {

class SwitchButtonWidget;

}

class SwitchButtonWidget : public QWidget

{

Q_OBJECT

public:

explicit SwitchButtonWidget(QWidget *parent = 0);

~SwitchButtonWidget();

protected:

//重写实现按键事件

void keyPressEvent(QKeyEvent* e);

private:

void createTable();

private:

Ui::SwitchButtonWidget *ui;

ControlTable* table;

};

#endif // SWITCHBUTTONWIDGET_H

switchbuttonwidget.cpp

#include "switchbuttonwidget.h"

#include "ui_switchbuttonwidget.h"

SwitchButtonWidget::SwitchButtonWidget(QWidget *parent) :

QWidget(parent),

ui(new Ui::SwitchButtonWidget)

{

ui->setupUi(this);

createTable();

}

SwitchButtonWidget::~SwitchButtonWidget()

{

delete ui;

}

void SwitchButtonWidget::keyPressEve