0


【QT课程设计】二:图片的多选功能与切换功能

文章目录

前置文章与导航索引

导航索引帖
前置文章,课设第一篇

前言

上一章我们完成了选择图片并打开,细心的同学在做这一部分时候会发现,我们制作了一个多选图片并打开第一张图片显示的功能,但在多选时,我们打开图片将会因为图片命名原因,可能无法准确打开自己想要的图片,本章将开展打开多张图片并相互切换的功能开发。

布局调整

布局样式
布局结构表
这里我们添加了两个label用于显示上一张&下一张,并且做了两个切换按钮,这里暂时我们先不做美化了。

显示上下一张图片的代码实现

思路:其实很简单,因为读入时默认为第一张,所以只需要在BeforeLabel里放入最后一张,AfterLabel里放入第二张就行。
这里用的方法count方法获取总数,由于第一个是0,最后一个则是count()-1,后一张就不用多赘述了。

void MainWindow::on_ChPicBtn_clicked(){//打开图片文件,选择图片
    QStringList srcDirPathListS = QFileDialog::getOpenFileNames(this,tr("选择图片"),
                                                                QDir::homePath(),tr("图像文件(*.jpg *.png *.bmp)"));qDebug()<<"图片路径"<<srcDirPathListS;//在控制台输出路径观察
    srcDirPathList = srcDirPathListS;//持久化图片

    imagenum =0;
    QImage image=QImage(srcDirPathList.at(imagenum));//初始化选中第一张图片qDebug()<<"image:"<<image;if(!image.isNull()){
        ui->piclabel->setPixmap(QPixmap::fromImage(ImageSetSize(QImage(srcDirPathList.at(imagenum)),ui->piclabel)));
        ui->BeforeLabel->setPixmap(QPixmap::fromImage(ImageSetSize(QImage(srcDirPathList.at(srcDirPathList.count()-1)),ui->BeforeLabel)));
        ui->AfterLabel->setPixmap(QPixmap::fromImage(ImageSetSize(QImage(srcDirPathList.at(imagenum+1)),ui->AfterLabel)));}else{return;}}

这里代码难度不大,但我为了后续操作能共用这个读取到的List,在头文件中建了一个List来存储,同时用imagenum来记录当前image是第几张。所以,别忘了在头文件中添加代码。

//mainwindow.hint imagenum;
    QStringList srcDirPathList;

效果图
到此,显示前后一张图片的功能已经完成了。

切换上下张

原理:做到这里,切换上下张的功能已经很简单了,只需要将imagenum数字加减,再重新显示图片就行了。

void MainWindow::on_BeforeBtn_clicked(){//切换imagenum为上一张if(imagenum=0){
        imagenum=srcDirPathList.count()-1;}else{
        imagenum=imagenum+1;}
    ui->piclabel->setPixmap(QPixmap::fromImage(ImageSetSize(QImage(srcDirPathList.at(imagenum)),ui->piclabel)));
    ui->BeforeLabel->setPixmap(QPixmap::fromImage(ImageSetSize(QImage(srcDirPathList.at(imagenum-1)),ui->BeforeLabel)));
    ui->AfterLabel->setPixmap(QPixmap::fromImage(ImageSetSize(QImage(srcDirPathList.at(imagenum+1)),ui->AfterLabel)));}

这个功能非常简单明了了吧。
但写到这里,会发现有个问题,我们在显示当前图片这个环节,代码重复度有点高了。为了避免后续修改压力大以及代码不美观,我们这里将显示图片整合为单独的方法。

void MainWindow::ImageShow(int imagenum){if(imagenum==0){
    ui->piclabel->setPixmap(QPixmap::fromImage(ImageSetSize(QImage(srcDirPathList.at(imagenum)),ui->piclabel)));
    ui->BeforeLabel->setPixmap(QPixmap::fromImage(ImageSetSize(QImage(srcDirPathList.at(srcDirPathList.count()-1)),ui->BeforeLabel)));
    ui->AfterLabel->setPixmap(QPixmap::fromImage(ImageSetSize(QImage(srcDirPathList.at(imagenum+1)),ui->AfterLabel)));}elseif(imagenum==(srcDirPathList.count()-1)){
       ui->piclabel->setPixmap(QPixmap::fromImage(ImageSetSize(QImage(srcDirPathList.at(imagenum)),ui->piclabel)));
       ui->BeforeLabel->setPixmap(QPixmap::fromImage(ImageSetSize(QImage(srcDirPathList.at(imagenum-1)),ui->BeforeLabel)));
       ui->AfterLabel->setPixmap(QPixmap::fromImage(ImageSetSize(QImage(srcDirPathList.at(0)),ui->AfterLabel)));}else{
        ui->piclabel->setPixmap(QPixmap::fromImage(ImageSetSize(QImage(srcDirPathList.at(imagenum)),ui->piclabel)));
        ui->BeforeLabel->setPixmap(QPixmap::fromImage(ImageSetSize(QImage(srcDirPathList.at(imagenum-1)),ui->BeforeLabel)));
        ui->AfterLabel->setPixmap(QPixmap::fromImage(ImageSetSize(QImage(srcDirPathList.at(imagenum+1)),ui->AfterLabel)));}}

这边分类讨论了当前图片为第一张、最后一张、其他情况,小伙伴们应该都能看懂,就不多赘述了。

修改错误

至此,切换上下张功能也完成了。
但做过测试的小伙伴们会发现,如果没选中图片就点击上下张会报错&选择图片后未选中退出会报错,这里来处理一下这个问题。

首先是对于打开图片这边的调整:

void MainWindow::on_ChPicBtn_clicked(){//打开图片文件,选择图片
    QStringList srcDirPathListS = QFileDialog::getOpenFileNames(this,tr("选择图片"),
                                                                QDir::homePath(),tr("图像文件(*.jpg *.png *.bmp)"));qDebug()<<"图片路径"<<srcDirPathListS;//在控制台输出路径观察
    srcDirPathList = srcDirPathListS;//持久化图片if(!srcDirPathList.isEmpty()){
        imagenum =0;
        QImage image=QImage(srcDirPathList.at(imagenum));//初始化选中第一张图片qDebug()<<"image:"<<image;ImageShow(imagenum);}elseif(srcDirPathList.isEmpty()){return;}}

这里将逻辑顺序更改了,当我们读取到图片后,srcDirPathList才会有数值。srcDirPathList不为空才能初始化图片,这样就不会数据溢出造成程序异常了。

再是对上下一张的处理。

void MainWindow::ImageShow(int imagenum){

    ui->piclabel->setPixmap(QPixmap::fromImage(ImageSetSize(QImage(srcDirPathList.at(imagenum)),ui->piclabel)));if(imagenum-1<0){
    ui->BeforeLabel->setPixmap(QPixmap::fromImage(ImageSetSize(QImage(srcDirPathList.at(srcDirPathList.count()-1)),ui->BeforeLabel)));}else{
     ui->BeforeLabel->setPixmap(QPixmap::fromImage(ImageSetSize(QImage(srcDirPathList.at(imagenum-1)),ui->BeforeLabel)));}if(imagenum+1>= srcDirPathList.count()){
     ui->AfterLabel->setPixmap(QPixmap::fromImage(ImageSetSize(QImage(srcDirPathList.at(0)),ui->BeforeLabel)));}else{
      ui->AfterLabel->setPixmap(QPixmap::fromImage(ImageSetSize(QImage(srcDirPathList.at(imagenum+1)),ui->BeforeLabel)));}}

当我们没打开图片就点击上下一张时,程序将提示我们先选择图片,并return回点击前的状态,就不会因为没选择就点击而程序异常了。

标签: qt ui 开发语言

本文转载自: https://blog.csdn.net/weixin_43035795/article/details/127975399
版权归原作者 小羊咩咩咩嗷 所有, 如有侵权,请联系我们删除。

“【QT课程设计】二:图片的多选功能与切换功能”的评论:

还没有评论