1背景介紹
widget開(kāi)發(fā)中碟嘴，避免不了使用類(lèi)似網(wǎng)頁(yè)的那種等待加載頁(yè)面苇侵，該文檔記錄在Qt中基于widget開(kāi)發(fā)方式中Loading頁(yè)面的開(kāi)發(fā)
2.基于Widget的方式制作Loading頁(yè)面的三種方式
1.基于QLabel+QMovie方式著摔，必須有Loading頁(yè)的完整的gif圖，需要美工合成
2.基于QPainter+Pixmap()的方式泄伪，相當(dāng)于找一系列離散的Loading圖失都，用定時(shí)器控制在合適的時(shí)候繪制其中某一張，順序繪制出來(lái)的看起來(lái)就是一個(gè)Loading庙曙，這種方法比較簡(jiǎn)單（本文使用這種方法）
3.純手工繪制圖形和文本空镜，再使用旋轉(zhuǎn)坐標(biāo)系的方式執(zhí)行，一般不特殊處理這種繪制出來(lái)的效果比較差捌朴，因?yàn)檎麄€(gè)Loading都是勻速運(yùn)轉(zhuǎn)的姑裂，放棄這種方法，很麻煩男旗，又不好看
2.1 核心代碼展示
本代碼基于單獨(dú)的Widget制作舶斧，后期如果需要使用，需要在designer中布局一個(gè)普通的QWidget對(duì)象察皇，然后使用提升茴厉，便可以使用。
2.2頭文件定義
#ifndef WIDGET_H
#define WIDGET_H
#include <QWidget>
#include <QTimer>
#include <QPainter>
#include <QPaintEvent>
#include <QPixmap>
QT_BEGIN_NAMESPACE
namespace Ui { class Widget; }
QT_END_NAMESPACE
class Widget : public QWidget
{
Q_OBJECT
public:
Widget(QWidget *parent = nullptr);
~Widget();
public:
void startLoading(); //啟動(dòng)定時(shí)器并顯示Loading頁(yè)面
void endLoading(); //關(guān)閉定時(shí)器并隱藏loading頁(yè)面
protected:
void paintEvent(QPaintEvent *event) override;
private:
Ui::Widget *ui;
QTimer *mTimer;
QList<QPixmap> mPixmap; //保存loading圖片的集合
quint8 mIndex = 0;
};
#endif // WIDGET_H
2.3源文件定義
#include "widget.h"
#include "ui_widget.h"
Widget::Widget(QWidget *parent)
: QWidget(parent), ui(new Ui::Widget)
{
ui->setupUi(this);
setAttribute(Qt::WA_TranslucentBackground);
setWindowFlag(Qt::FramelessWindowHint);
mTimer = new QTimer(this);
connect(mTimer,&QTimer::timeout,this,[=](){
mIndex++;
if(mIndex>49)
mIndex = 0;
update();
});
resize(320,320);
for(int i = 0; i < 50; i++){
mPixmap.push_back(QPixmap(QString(":/loading/%1.png").arg(i+1)));
}
startLoading();
move(1920+50,150); //為了截圖方便什荣，show在一個(gè)比較純背景的地方
}
Widget::~Widget()
{
delete ui;
}
void Widget::startLoading()
{
if(!mTimer->isActive())
mTimer->start(40);
show();
}
void Widget::endLoading()
{
if(mTimer->isActive())
mTimer->stop();
hide();
}
void Widget::paintEvent(QPaintEvent *event)
{
Q_UNUSED(event)
QPainter Paint(this);
Paint.setRenderHints(QPainter::TextAntialiasing |QPainter::Antialiasing);
Paint.drawPixmap(QRect(0,0,320,320),QPixmap(mPixmap[mIndex]));
}
2.4源文件描述
- resize當(dāng)前窗體為320*320矾缓，因?yàn)槊拦で械膱D是320px的圖，因此重置窗體的大小為320px
for(int i = 0; i < 50; i++){mPixmap.push_back(QPixmap(QString(":/loading/%1.png").arg(i+1)));}給容器中添加切好的圖稻爬，圖片名為1..2...3.png嗜闻，便于使用代碼插入
3.效果預(yù)覽
小知識(shí)分享
1.設(shè)置窗體無(wú)背景，可以有兩種方式桅锄，第一種
setAttribute(Qt::WA_TranslucentBackground);的方式琉雳，第二種是使用樣式setStyleSheet("background:transparent;")來(lái)設(shè)置，一般前者是搭配QPainter繪制友瘤，后者可以讓當(dāng)前窗體的父窗體的背景透出來(lái)(不使用當(dāng)前窗體的背景遮蓋父窗體的背景)翠肘，使用前者不加繪制，窗體會(huì)變黑窗
2.定時(shí)器的兩種使用方式辫秧，第一種是實(shí)例化QTimer對(duì)象束倍，之后startTimer(),在TimeOut中處理，第二種是直接在類(lèi)內(nèi)部startTime()啟動(dòng)定時(shí)器，返回當(dāng)前啟動(dòng)的定時(shí)器的TimerId,記錄該TimerId,在窗體析構(gòu)時(shí)關(guān)閉定時(shí)器killTimer(TimerId)
有什么問(wèn)題可以在線(xiàn)討論绪妹，覺(jué)得有用幫忙點(diǎn)個(gè)贊吧甥桂！^ _ ^
