[移动开发]Qt5.12实现图片查看小程序

使用Qt5.12实现了一个图片查看小程序。图片显示区域使用Scroll Area。《嵌入式Qt实战教程》这本书中的例程，本文主要是记录练习过程。
先画一个这样的界面。

然后每个控件的属性设置成这样。主要是对象名和控件名称。

只需要修改widget.h和widget.cpp中的代码。两个文件的代码修改成下面这样。
widget.h中的代码：

#ifndef WIDGET_H
#define WIDGET_H

#include <QWidget>
#include <QFileDialog>
#include <QString>
#include <QTimer>
#include <QLabel>

QT_BEGIN_NAMESPACE
namespace Ui { class Widget; }
QT_END_NAMESPACE

class Widget : public QWidget
{
    Q_OBJECT

public:
    Widget(QWidget *parent = nullptr);
    ~Widget();

private slots:
    void on_btn_open_clicked();

    void on_btn_start_clicked();

    void on_btn_stop_clicked();

    void on_btn_prev_clicked();

    void on_btn_next_clicked();

    void on_btn_up_clicked();

    void on_btn_down_clicked();

    void on_btn_normal_clicked();

    void pic_scan();

private:
    Ui::Widget *ui;
    QTimer *timer;      // 定时器
    QPixmap pix;        //图像映射
    QLabel *label;      //标签
};
#endif // WIDGET_H

widget.cpp中的代码：

#include "widget.h"
#include "ui_widget.h"

static QStringList::Iterator it;    //迭代器保存所有打开加载的图片
static QString image[100];           //将图片保存到数组里面
static int iCount=0;                 //总共有多少张图片
static int i=0;                      //当前是第几张图片

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    label = new QLabel();                               //创建显示图片的文本标签
    ui->scrollArea->setWidget(label);                   //将显示标签放入滚动条中
    ui->scrollArea->setAlignment(Qt::AlignCenter);      //显示位置，对其方式

    //创建定时器，并与指定的事件关联起来，当时间到了就调用pic_scan函数
    timer = new QTimer;
    connect(timer,SIGNAL(timeout()),this,SLOT(pic_scan()));
    label->setAlignment(Qt::AlignCenter);

}

Widget::~Widget()
{
    delete ui;
}

//每个控件的槽函数如下

//打开按钮
void Widget::on_btn_open_clicked()
{
    timer->stop();   //先将定时器暂停
    QStringList fileNameList = QFileDialog::getOpenFileNames(this,"file open","/home/legend",
                                                             "Picture File(*.png;*.bmp;*.jpg);;All Files(*)");
    //返回的文件名list是迭代器
    for (it=fileNameList.begin();it != fileNameList.end() ;it++ ) {
        image[iCount] = *it;              //把打开的图片添加到一个数组里面存起来
        iCount++;
    }
    //显示第i张图片
    pix.load(image[i]);
    label->setPixmap(pix);

}

//单击了开始按钮
void Widget::on_btn_start_clicked()
{
    timer->start(3000);             //设置定时器时间间隔
}

//单击了停止按钮
void Widget::on_btn_stop_clicked()
{
    timer->stop();                 //暂停定时器
}


//单击了上一张按钮
void Widget::on_btn_prev_clicked()
{
    timer->stop();                 //暂停定时器
    i--;                            //上一张则下标减1
    if(i<0){                        //如果i小于0了，则再从最后一张开始
        i=iCount-1;
    }
    pix.load(image[i]);
    label->setPixmap(pix);
}

//下一张按钮
void Widget::on_btn_next_clicked()
{
    timer->stop();
    i++;
    if(i>iCount - 1){              //如果大于iCount-1了，则再从第一张开始
        i=0;
    }
    pix.load(image[i]);
    label->setPixmap(pix);
}


//放大按钮
void Widget::on_btn_up_clicked()
{
    timer->stop();
    double x = pix.width();                      //获得图片长度
    double y = pix.height();                     //获得图片高度
    pix.load(image[i]);
    pix=pix.scaled(x*1.2,y*1.2,Qt::KeepAspectRatio);  //将长宽放大1.2倍
    label->setPixmap(pix);
}

//缩小按钮
void Widget::on_btn_down_clicked()
{
    timer->stop();
    double x = pix.width();                      //获得图片长度
    double y = pix.height();                     //获得图片高度
    pix.load(image[i]);
    pix=pix.scaled(x/1.2,y/1.2,Qt::KeepAspectRatio);  //将长宽缩小1.2倍
    label->setPixmap(pix);
}

//还原按钮
void Widget::on_btn_normal_clicked()
{
    timer->stop();

    //重新显示图片即可
    pix.load(image[i]);
    label->setPixmap(pix);

}

//开始浏览图片函数
void Widget::pic_scan()
{
    /*定时器每隔3秒执行pic_scan函数，i从0开始，当定时器暂停的时候，i就保存了数组中，此时显示图片的下标*/
    pix.load(image[i]);
    label->setPixmap(pix);
    i++;
    if(i>iCount -1){        //如果到达最后一张，再从第一张开始
        i=0;
    }
}

运行效果：