QT项目开发手记——一个好看的loading界面

53 阅读 0 评论 35 点赞

我是靠谱客的博主想人陪糖豆，最近开发中收集的这篇文章主要介绍QT项目开发手记——一个好看的loading界面，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

在用QT开发我的迷你小博客客户端的时候，想到为什么登录就是要一闪而过呢，生活节奏那么快你不“耶”嘛>_<!!;
所有呢想在你摁下登录按钮之后插入一段小小的loading动画，在获取到服务器返回值之后自动消失掉，并且可以至少存在一秒钟

闲话不多说，我的解决方法是这样的：
在点击登录按钮之后，生成loading窗口，同时登录程序等待服务器返回值
当获取到返回值之后给loading窗口发送一个信号“我收到服务器大大的返回值啦！”
然后loading窗口得到这个信号之后调用自焚函数（close()哈哈）来关闭自己，大体上界面如下

这里写图片描述

GIF图也送给大家了，网上找的，侵删！

这里写图片描述

以下是代码部分

/*登录界面登录按钮的槽函数*/
/*槽函数:点击登录按钮执行登录操作,调用net_server的login_server方法*/
void myWidget::login_server(){
    //实例化服务器类
    net_server net;
    //获取登录界面输入框的值
    username_str = username_txt->text();
    password_str =password_txt->text();
    //判空
    if(username_txt == NULL || password_txt == NULL){
        QMessageBox::about(this,tr("无法登录"),tr("n        用户名或者密码为空！         n"));
        return;
    }
    //实例化loading窗口
    wating *w = new wating(this);
    w->setWindowFlags(Qt::FramelessWindowHint | Qt::Dialog);
    w->setWindowModality(Qt::ApplicationModal);
    w->move(880,450);
    w->show();
    //绑定槽函数和信号,当loading发出 loading()函数时登录界面关闭
    connect(w,SIGNAL(loading()),this,SLOT(myclose()));
    //绑定槽函数和信号,当返回正确的值时让loading窗口发出loading()信号并关闭
    //返回错误时仅仅关闭loading()窗口
    connect(this,SIGNAL(server_is_returned_true()),w,SIGNAL(loading()));
    connect(this,SIGNAL(server_is_returned_false()),w,SLOT(close()));
    int ret = net.login_server(username_str,password_str);
    qDebug()<<"myWidget::login_server--->获取到loginserver的返回值"<<ret<<endl;
    login_btn->setText(u8"完 成");
    //在获取到返回值之后停顿一秒来欣赏美妙的loading动画
    if(ret == 1){
        QTimer::singleShot(1000, this, SIGNAL(server_is_returned_true()));
        return;
    }
    else if(ret == 0) {
        QTimer::singleShot(1000, this, SIGNAL(server_is_returned_false()));
        QMessageBox::about(this,tr("提示"),tr("n   用户名或密码错误    n"));
        return;
    }
    else {
        QTimer::singleShot(1000, this, SIGNAL(server_is_returned_false()));
        QMessageBox::about(this,tr("提示"),tr("无法连接到服务器，请检查网络连接后再试！"));
        return;
    }
}

loading界面:

//wating.h
#ifndef WATING_H
#define WATING_H

#include <QWidget>
#include <QTimer>
#include <QTimer>
#include "mywidget.h"
namespace Ui {
class wating;
}

class wating : public QWidget
{
    Q_OBJECT

public:
    explicit wating(QWidget *parent = 0);
    ~wating();
public slots:


signals:
    void loading();

private:
    Ui::wating *ui;
    QMovie *movie;
    QLabel *label;
    QLabel * tip_label;
    QFrame * background;
    QTimer *timer ;
};

#endif // WATING_H


//wating.cpp
#include "wating.h"
#include "ui_wating.h"
#include "mywidget.h"

wating::wating(QWidget *parent) :
    QWidget(parent),
    ui(new Ui::wating)
{
    ui->setupUi(this);
    this->setFixedSize(200,200);
    background = new QFrame(this);
    background->setStyleSheet("background-color:#fff;border-radius:10px;");
    background->setGeometry(0, 50, 200, 150);
    label = new QLabel(background);
    label->setGeometry(0, 0, 200, 150);
    movie = new QMovie(":/Img/loding.gif");
    movie->setScaledSize(QSize(200,150));
    label->setScaledContents(true);
    label->setMovie(movie);
    movie->start();
    qDebug()<<"loading";
    connect(this,SIGNAL(loading()),this,SLOT(close()));
}


wating::~wating()
{
//一定要delete界面元素,不然会留下现一个透明方框
    delete background;
    delete label;
    delete movie;
    delete ui;
}