Qt QListWidget实现图片缩略图列表

目标：

将本机中的多张图片以缩略图的形式显示在列表中

环境：

我们已经做好了菜单栏和文件选择对话框。参考：http://blog.csdn.net/v_xchen_v/article/details/71524160

实现：

以缩略图列表展示图片的功能写在mymenu类的成员函数showImageList()中。使用Qt自带的QListWidget类实现这个功能

步骤：

1.定义一个QListWidget对象

2. 设置ViewMode等属性

3.定义单元项并添加到QListWidget中

4.调用QListWidget对象的show()方法

代码如下：

mymenu.h

#ifndef MYMENU_H
#define MYMENU_H

#include "QMainWindow"
class mymenu : public QMainWindow
{
Q_OBJECT  // must include this if you use Qt signals/slots
public:
//构造函数
explicit mymenu(QWidget *parent = 0);//QWidget *parent = 0 表示mymenu控件不是任何控件的子控件

private slots:
void fileOpenActionSlot();//打开文件动作对应的槽函数
private:
void createAction();     //创建动作
void createMenu();       //创建菜单
void createContentMenu();//创建上下文菜单
private:
void selectFile();       //弹出选择文件对话框
void showImageList();    //用缩略图显示图片
private:
QAction *fileOpenAction; //创建一个QAction指针，打开文件动作
QMenu *menu;             //创建一个QMenu指针
private:
QStringList fileNames;
};

#endif // MYMENU_H

mymenu.cpp

#include "mymenu.h"
#include "QMenu"
#include "QMenuBar"
#include "QAction"
#include "QMessageBox"
#include "QFileDialog"
#include "QDebug"
#include "QListWidget"
/****************************************
* Qt中创建菜单和工具栏需要如下步骤：
* 1. 建立行为Aciton
* 2. 创建菜单并使它与一个行为关联
* 3. 创建工具条并使它与一个行为关联
*****************************************/
mymenu::mymenu(QWidget *parent):QMainWindow(parent)
{
createAction();
createMenu();
createContentMenu();
this->resize(300,400);
}
void mymenu::createAction()
{
//创建打开文件动作
fileOpenAction = new QAction(tr("打开文件"),this);
//摄者打开文件的快捷方式
fileOpenAction->setShortcut(tr("Ctrl+O"));
//设置打开文件动作提示信息
fileOpenAction->setStatusTip("打开一个文件");
//关联打开文件动作的信号和槽
connect(fileOpenAction,SIGNAL(triggered()),this,SLOT(fileOpenActionSlot()));
}
void mymenu::createMenu()
{
menu = this->menuBar()->addMenu(tr("文件"));
menu->addAction(fileOpenAction);
}

void mymenu::createContentMenu()
{
this->addAction(fileOpenAction);
this->setContextMenuPolicy(Qt::ActionsContextMenu);
}

void mymenu::fileOpenActionSlot()
{
//QMessageBox::warning(this,tr("提示"),tr("打开文件"),QMessageBox::Yes|QMessageBox::No);
selectFile();
}
/****************************************
* Qt中使用文件选择对话框步骤如下：
* 1. 定义一个QFileDialog对象
* 2. 设置路径、过滤器等属性
*****************************************/
void mymenu::selectFile()
{
//定义文件对话框类
QFileDialog *fileDialog = new QFileDialog(this);
//定义文件对话框标题
fileDialog->setWindowTitle(tr("打开图片"));
//设置默认文件路径
fileDialog->setDirectory(".");
//设置文件过滤器
fileDialog->setNameFilter(tr("Images(*.png *.jpg *.jpeg *.bmp)"));
//设置可以选择多个文件,默认为只能选择一个文件QFileDialog::ExistingFiles
fileDialog->setFileMode(QFileDialog::ExistingFiles);
//设置视图模式
fileDialog->setViewMode(QFileDialog::Detail);
//打印所有选择的文件的路径
if(fileDialog->exec())
{
fileNames = fileDialog->selectedFiles();
showImageList();
}
for(auto tmp:fileNames)
qDebug()<<tmp<<endl;
}
/****************************************
* Qt中使用文件选择对话框步骤如下：
* 1. 定义一个QListWidget对象
* 2. 设置ViewMode等属性
* 3. 定义单元项并添加到QListWidget中
* 4. 调用QListWidget对象的show()方法
*****************************************/
void mymenu::showImageList()
{
//定义QListWidget对象
QListWidget *imageList = new QListWidget;
imageList->resize(365,400);
//设置QListWidget的显示模式
imageList->setViewMode(QListView::IconMode);
//设置QListWidget中单元项的图片大小
imageList->setIconSize(QSize(100,100));
//设置QListWidget中单元项的间距
imageList->setSpacing(10);
//设置自动适应布局调整（Adjust适应，Fixed不适应），默认不适应
imageList->setResizeMode(QListWidget::Adjust);
//设置不能移动
imageList->setMovement(QListWidget::Static);
for(auto tmp : fileNames)
{
//定义QListWidgetItem对象
QListWidgetItem *imageItem = new QListWidgetItem;
//为单元项设置属性
imageItem->setIcon(QIcon(tmp));
//imageItem->setText(tr("Browse"));
//重新设置单元项图片的宽度和高度
imageItem->setSizeHint(QSize(100,120));
//将单元项添加到QListWidget中
imageList->addItem(imageItem);
}
//显示QListWidget
imageList->show();
}

main.cpp

#include "mymenu.h"
#include <QApplication>
#include <QProcess>
#include <QMessageBox>
int main(int argc, char *argv[])
{
QApplication a(argc, argv);
mymenu m_menu;
m_menu.show();
return a.exec();
}

效果：

工程下载地址：http://download.csdn.net/detail/v_xchen_v/9838782