Qt QGraphics類應用——圖片移動+選點縮放+控制移動區域

記錄：本博客用來記錄學習，引用博客https://blog.csdn.net/weixin_43935474/article/details/89327314

功能：

　　1、圖片可以使用鼠標進行拖動

　　2、圖片可以在鼠標位置放大縮小

　　3、圖片移動的區域固定

需求：

　　圖片一張

成品：

 

代碼：

ImageWidget.h

#ifndef IMAGEWIDGET_H
#define IMAGEWIDGET_H

#include <QWidget>
#include <QtGui>
#include <QPixmap>
#include <QPainter>
#include <QRectF>
#include <QMouseEvent>
#include <QPointF>
#include <QDragEnterEvent>
#include <QGraphicsSceneWheelEvent>
#include <QGraphicsItem>

enum Enum_ZoomState{
    NO_STATE,
    RESET,
    ZOOM_IN,
    ZOOM_OUT
};
// class ImageWidget :public QObject, QGraphicsItem
class ImageWidget :public QGraphicsItem
{
    //Q_OBJECT
public:
    ImageWidget(QPixmap *pixmap);
    QRectF  boundingRect() const;
    void    paint(QPainter *painter, const QStyleOptionGraphicsItem *option, QWidget *widget);
    void    wheelEvent(QGraphicsSceneWheelEvent *event);
    void    ResetItemPos();
    //QVariant itemChange(GraphicsItemChange change, const QVariant &value);
    void    mousePressEvent(QGraphicsSceneMouseEvent *event);
    void    mouseMoveEvent(QGraphicsSceneMouseEvent *event);
    void    mouseReleaseEvent(QGraphicsSceneMouseEvent *event);
    qreal   getScaleValue() const;
    void    setQGraphicsViewWH(int nwidth,int nheight);
private:
    qreal       m_scaleValue;
    qreal       m_scaleDafault;
    QPixmap     m_pix;
    int         m_zoomState;
    bool        m_isMove;
    QPointF     m_startPos;
};
#endif // IMAGEWIDGET_H

ImageWidget.cpp

#include "imagewidget.h"
#include <QDebug>
#include <QGraphicsSceneMouseEvent>
#include <QPointF>
#include <QGraphicsSceneDragDropEvent>
#include <QDrag>
#include <math.h>

ImageWidget::ImageWidget(QPixmap *pixmap)
{
    m_pix = *pixmap;
    //If enabled is true, this item will accept hover events; otherwise, it will ignore them. By default, items do not accept hover events.
    setAcceptDrops(true);//true接收懸停事件
    m_scaleValue = 0;
    m_scaleDafault = 0;
    m_isMove = false;
}

QRectF ImageWidget::boundingRect() const
{
    return QRectF(-m_pix.width() / 2, -m_pix.height() / 2,
                  m_pix.width(), m_pix.height());
}

void ImageWidget::paint(QPainter *painter, const QStyleOptionGraphicsItem *,
                    QWidget *)
{
    painter->drawPixmap(-m_pix.width() / 2, -m_pix.height() / 2, m_pix);
}

void ImageWidget::mousePressEvent(QGraphicsSceneMouseEvent *event)
{
    if(event->button()== Qt::LeftButton)
    {
        m_startPos = event->pos();//鼠標左擊時，獲取當前鼠標在圖片中的坐標，
        m_isMove = true;//標記鼠標左鍵被按下
    }
    else if(event->button() == Qt::RightButton)
    {
        ResetItemPos();//右擊鼠標重置大小
    }

}

void ImageWidget::mouseMoveEvent(QGraphicsSceneMouseEvent *event)
{
    qreal x = m_pix.width()/4;
    qreal y = m_pix.height()/4;

        if(pos().x() <= (-x))
        {
            setPos(qreal(-x+1),pos().y());
            m_isMove = false;
        }
        if(pos().x() >= x)
        {
            setPos(QPointF(x-1,pos().y()));
            m_isMove = false;
        }
        if(pos().y() <= (-y))
        {
            setPos(pos().x(),qreal(-y+1));
            m_isMove = false;
        }
        if(pos().y() >= y)
        {
            setPos(pos().x(),qreal(y-1));
            m_isMove = false;
        }
    if(m_isMove)
    {
        QPointF point = (event->pos() - m_startPos)*m_scaleValue;
        moveBy(point.x(), point.y());
    }
    qDebug()<<"m_pix.width()/3="<<m_pix.width()/3;
    qDebug()<<"m_pix.height()/3="<<m_pix.height()/3;
    qDebug()<<"event->pos="<<event->pos();
    qDebug()<<"pos="<<pos();
}

void ImageWidget::mouseReleaseEvent(QGraphicsSceneMouseEvent *)
{
    m_isMove = false;//標記鼠標左鍵已經抬起
}


void ImageWidget::wheelEvent(QGraphicsSceneWheelEvent *event)//鼠標滾輪事件
{
    //選點縮放=縮放+移動
    if((event->delta() > 0)&&(m_scaleValue >= 50))//最大放大到原始圖像的50倍
    {
        return;
    }
    else if((event->delta() < 0)&&(m_scaleValue <= m_scaleDafault))//圖像縮小到自適應大小之后就不繼續縮小
    {
        ResetItemPos();//重置圖片大小和位置，使之自適應控件窗口大小
    }
    else
    {
        //①縮放
        qreal qrealOriginScale = m_scaleValue;
        if(event->delta() > 0)//鼠標滾輪向前滾動
        {
            m_scaleValue*=1.1;//每次放大10%
        }
        else
        {
            m_scaleValue*=0.9;//每次縮小10%
        }
        setScale(m_scaleValue);
        //②移動
        if(event->delta() > 0)
        {
            moveBy(-event->pos().x()*qrealOriginScale*0.1, -event->pos().y()*qrealOriginScale*0.1);//使圖片縮放的效果看起來像是以鼠標所在點為中心進行縮放的
        }
        else
        {
            moveBy(event->pos().x()*qrealOriginScale*0.1, event->pos().y()*qrealOriginScale*0.1);//使圖片縮放的效果看起來像是以鼠標所在點為中心進行縮放的
        }
    }
}

void ImageWidget::setQGraphicsViewWH(int nwidth, int nheight)//將主界面的控件QGraphicsView的width和height傳進本類中，並根據圖像的長寬和控件的長寬的比例來使圖片縮放到適合控件的大小
{
    int nImgWidth = m_pix.width();
    int nImgHeight = m_pix.height();
    qreal temp1 = nwidth*1.0/nImgWidth;
    qreal temp2 = nheight*1.0/nImgHeight;
    if(temp1>temp2)
    {
        m_scaleDafault = temp2;
    }
    else
    {
        m_scaleDafault = temp1;
    }
    setScale(m_scaleDafault);
    m_scaleValue = m_scaleDafault;
}

void ImageWidget::ResetItemPos()//重置圖片位置
{
    m_scaleValue = m_scaleDafault;//縮放比例回到一開始的自適應比例
    setScale(m_scaleDafault);//縮放到一開始的自適應大小
    setPos(0,0);
}

qreal ImageWidget::getScaleValue() const
{
    return m_scaleValue;
}

　　

mainwindow.h

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>
#include "imagewidget.h"

namespace Ui {
class MainWindow;
}

class MainWindow : public QMainWindow
{
    Q_OBJECT
    
public:
    explicit MainWindow(QWidget *parent = 0);
    ~MainWindow();
    void            recvShowPicSignal(QImage image);//接收並顯示圖片的函數
private:
    Ui::MainWindow *ui;
    ImageWidget    *m_Image;
};

#endif // MAINWINDOW_H

mainwindow.cpp

#include "mainwindow.h"
#include "ui_mainwindow.h"
#include <QGraphicsItem>

MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::MainWindow)
{
    ui->setupUi(this);
    recvShowPicSignal(QImage(QString::fromUtf8(":/image/但丁真魔人.jpg")));
}

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

void MainWindow::recvShowPicSignal(QImage image)
{

    QPixmap ConvertPixmap=QPixmap::fromImage(image);
    int width = ui->ImageGraphic->width();//獲取界面控件Graphics View的寬度
    int height = ui->ImageGraphic->height();//獲取界面控件Graphics View的高度

    qDebug()<<"width="<<width<<" heigth="<<height<<" size="<< ui->ImageGraphic->size();
    //要用QGraphicsView就必須要有QGraphicsScene搭配着用
    QGraphicsScene  *qgraphicsScene = new QGraphicsScene;
    qgraphicsScene->setSceneRect(QRectF(-width/2,-height/2,width,height));

    qDebug()<<"width="<<width<<" height="<<height;
    //實例化類ImageWidget的對象m_Image，該類繼承自QGraphicsItem，是自己寫的類
    m_Image = new ImageWidget(&ConvertPixmap);
    //將界面控件Graphics View的width和height傳進類m_Image中
    m_Image->setQGraphicsViewWH(width,height);

    //將QGraphicsItem類對象放進QGraphicsScene中
    qgraphicsScene->addItem(m_Image);

    //使視窗的大小固定在原始大小，不會隨圖片的放大而放大（默認狀態下圖片放大的時候視窗兩邊會自動出現滾動條，
    //並且視窗內的視野會變大），防止圖片放大后重新縮小的時候視窗太大而不方便觀察圖片
    ui->ImageGraphic->setSceneRect(QRectF(-(width/2),-(height/2),width,height));//使視窗的大小固定在原始大小，不會隨圖片的放大而放大（默認狀態下圖片放大的時候視窗兩邊會自動出現滾動條，並且視窗內的視野會變大），防止圖片放大后重新縮小的時候視窗太大而不方便觀察圖片
    //ui->ImageGraphic->setMinimumSize(width,height);
    ui->ImageGraphic->setScene(qgraphicsScene);
    ui->ImageGraphic->setFocus();//將界面的焦點設置到當前Graphics View控件

}