qt实现图片的缩放

需求

在聊天的时候看到

觉得图片缩放的控件比较有用，于是决定自己实现一个。

需求分析

在其中的图片转换，背景优化以及悬浮的按钮暂时不做考虑。
1. 图片的缩放
2. 图片的旋转
3. 图片在视图区域展示，在非视图区域看不到
4. 鼠标的滑轮控制方法和缩小

1,2可以通过QPixmap来实现。
3最开始的想法是通过QWidget上放一个QLabel，QLabel加载图片，然后QWidget设置固定大小来实现，实际操作中发现及时设置了固定大小，一旦加载图片QWidget的大小也会随着QLabel变化。然后相同QScrollArea来加载图片并去掉滚动条，就可以在固定区域中显示图片了，但是这种方法，可能在实际中会出现放大、缩小或旋转要重新计算大小位置等，比较难计算。因此，想通过只拖放几个控件就实现的方式，都走不通。这样就只能通过继承QWidget，重写paintEvent来实现了。
4,可以通过重写wheelEvent实现

代码

重写paintEvent

void PixmapWidget::paintEvent(QPaintEvent *event)
{
    QPixmap pixmap;
    pixmap.load(m_pixmapPath);

    QMatrix matrix;
    matrix.rotate(m_rotationAngle);

    pixmap = pixmap.transformed(matrix,  Qt::FastTransformation);

    int pixmapWidth = pixmap.width();
    int pixmapHeight = pixmap.height();

    QPoint widgetStartPos = this->pos();

    int painterWidth = pixmapWidth * m_scale;
    int painterHeight = pixmapHeight * m_scale;

    int widgetWidth = this->width();
    int widgetHeight = this->height();
    QPoint startPos(widgetStartPos.x() + widgetWidth/2 - painterWidth/2,
                    widgetStartPos.y() + widgetHeight/2 - painterHeight/2);
    QPainter painter(this);
    painter.drawPixmap(QRect(startPos.x(), startPos.y(), painterWidth, painterHeight),
                       pixmap);

    QWidget::paintEvent(event);
}  

代码分析

pixmap = pixmap.transformed(matrix, Qt::FastTransformation);
载入图片后通过matix向量来旋转图片，这样得到一个旋转后的图片的副本。

    int pixmapWidth = pixmap.width();
    int pixmapHeight = pixmap.height();

    QPoint widgetStartPos = this->pos();

    int painterWidth = pixmapWidth * m_scale;
    int painterHeight = pixmapHeight * m_scale;

    int widgetWidth = this->width();
    int widgetHeight = this->height();
    QPoint startPos(widgetStartPos.x() + widgetWidth/2 - painterWidth/2,
                    widgetStartPos.y() + widgetHeight/2 - painterHeight/2);

计算图片的宽、高，通过比例计算拉伸后的宽高。 然后通过（控件的起点位置 + 控件的宽度/2 - 图片的宽度/2） 来得到图片与控件对齐中心位置的时候的起点位置。

    QPainter painter(this);
    painter.drawPixmap(QRect(startPos.x(), startPos.y(), painterWidth, painterHeight),
                       pixmap);

绘制图片，绘制区域为拉伸后的大小，图片绘制时候会被自动拉伸。

重写wheelEvent(QWheelEvent *event)

void PixmapWidget::wheelEvent(QWheelEvent *event)
{
    int value = event->delta();
    double scaleRatio = ((double)value)/RATIO_TO_DOULBE;
    m_scale += scaleRatio;

    limitScale();

    update();

    event->accept();
} 

代码分析

int value = event->delta();
通过delta()返回的值来知道滚轮的动作，正数是向前滚动，负数为向后滚动。查看文档发现滚动的角度与返回的delta()的关系是 (角度 * 8 = delta()) ，计算的时候就需要除以8*360，就可以得到缩放比例了。
然后调用update() 可以重绘了。

代码下载