美文网首页
QT::QLabel改造一个简单的图像显示放大缩小和平移控件

QT::QLabel改造一个简单的图像显示放大缩小和平移控件

作者: 寽虎非虫003 | 来源:发表于2022-12-06 17:16 被阅读0次

需求

就很简单要使用一个可以放大缩小的图片显示控件,很多软件都有,也当做是一个学习。
还有些体验可以优化,但是对我而言基本够用了。

效果

image.png
image.png

代码

头文件ScaleLabel.h

#pragma once
#include <QLabel>
#include <QPainter>


class ScaleLabel:public QLabel
{
Q_OBJECT
public:
    void setQImage(QImage &img);///<传入要显示的图

public:
    /////////////////////////////////////////
    //  重载鼠标事件
    /////////////////////////////////////////
    void mousePressEvent(QMouseEvent *event) override;
    void mouseMoveEvent(QMouseEvent *event) override;
    void wheelEvent(QWheelEvent *envent) override;

    /////////////////////////////////////////
    // 重载绘图
    /////////////////////////////////////////
    void paintEvent(QPaintEvent *event) override;

private:
    //
    QImage m_showImg;///<传进来要显示的图
    float m_scale;///<缩放的倍率
    QPoint m_LastPt;///<移动时候要居中的点
    QPoint m_MoveDelta;///<移动时候要居中的点

    QPainter m_paiter;///<绘制对象
public:
    ScaleLabel(QWidget *parent = nullptr);
    ~ScaleLabel();
};

源文件


#include "ScaleLabel.h"
#include <QMouseEvent>

ScaleLabel::ScaleLabel(QWidget *parent)
{
    this->setBackgroundRole(QPalette::Base);
    m_scale = 1.0f;
}

ScaleLabel::~ScaleLabel()
{
}

void ScaleLabel::mousePressEvent(QMouseEvent *event)
{
    m_LastPt = event->position().toPoint();
    // event->accept();
}

//
void ScaleLabel::mouseMoveEvent(QMouseEvent *event)
{
    int dx = event->position().toPoint().x() - m_LastPt.x();
    int dy = event->position().toPoint().y() - m_LastPt.y();

    if (event->buttons() & Qt::LeftButton) // 左键按下,平移
    {
        m_MoveDelta += QPoint(dx, dy);
    }

    update();

    // 更新点位,可能不是很必要
    m_LastPt = event->position().toPoint();
}

// 滚轮控制缩放,但是这个缩放是改变的倍数,并不是所需要的拉远或拉近镜头
void ScaleLabel::wheelEvent(QWheelEvent *event)
{
    double numDegrees = event->angleDelta().y() / 180.0;

    if (numDegrees > 0)
    {
        m_scale *= 1.1;
    }
    else
    {
        m_scale *= 0.9;
    }
#ifdef _DEBUG
    qDebug("m_scale is %.3f", m_scale);
#endif

    // m_scale = m_scale * (1.0 + numDegrees);

    this->update();
    // event->accept();
}

void ScaleLabel::setQImage(QImage &img)
{
    m_showImg = img;
    float h = this->height();
    float w = this->width();
    m_scale = std::min(h / m_showImg.height(), w / m_showImg.width());

#ifdef _DEBUG
    qDebug("h(%.1f), w(%.1f), m_scale(%.3f)",h,w, m_scale);
#endif
}

void ScaleLabel::paintEvent(QPaintEvent *event)
{
    Q_UNUSED(event);
    m_paiter.begin(this);

    m_paiter.scale(m_scale, m_scale); // 缩放
    m_paiter.translate(m_MoveDelta);  // 平移
    

    // 绘制
    //  m_paiter.drawImage(m_MoveDelta,m_showImg);
    m_paiter.drawImage(0, 0, m_showImg);

    /// 绘制中心框
    // 设置画笔
    QPen pen;
    pen.setStyle(Qt::SolidLine);
    pen.setWidth(2);
    pen.setColor(Qt::red);
    m_paiter.setPen(pen);
    // 正式绘制
    int w_half = m_showImg.width()/2;
    int h_half = m_showImg.height()/2;
    QRect re(w_half - 50, h_half - 50, 100, 100);
    m_paiter.drawRect(re);
    m_paiter.drawLine(w_half - 50, h_half, 0, h_half);          // 左侧
    m_paiter.drawLine(w_half + 50, h_half, w_half * 2, h_half); // 右侧
    m_paiter.drawLine(w_half, h_half - 50, w_half, 0);          // 上侧
    m_paiter.drawLine(w_half, h_half + 50, w_half, h_half * 2); // 下侧

    /// 转换

    // m_paiter.resetTransform();//重置变换

    

    m_paiter.end();
    // 显示
    this->update();
}

测试文件

#include<iostream>
#include <QApplication>
#include "UI/ScaleLabel.h"

using namespace std;
int main(int argc,char ** argv)
{
    cout<<"build sucessful!"<<endl;
    
    QApplication app(argc, argv); //初始化
    QImage img("./0/phase_0.png");

    ScaleLabel w;
    w.setFixedSize(600, 500);
    w.setQImage(img);
    // GenPhaseUI w;
    w.show();
    
    app.exec(); //主事件循环
    
    return 0;
}

相关文章

  • QT::QLabel改造一个简单的图像显示放大缩小和平移控件

    需求 就很简单要使用一个可以放大缩小的图片显示控件,很多软件都有,也当做是一个学习。还有些体验可以优化,但是对我而...

  • Axure制作图像的放大与缩小效果的四种方式

    1、新建Axure RP项目,取名“Axure制作图像的放大与缩小效果” 2、拖入动态面板控件,取名“放大缩小”。...

  • CGAffineTransform详解

    CGAffineTransform是一个映射转换3*3的矩阵,用来绘画2D图像。可以实现放大、缩小、平移。先看看其...

  • PS快捷键

    ^K 首选项 : 单位与标尺 - 单位:像素 ^1 : 100%正常显示 ^+ : 放大图像 ^- : 缩小图像 ...

  • QT:状态栏中显示鼠标坐标值

    如何在QT状态栏中插入窗口显示信息 新建QLabel成员 QLabel* m_statusLabel addPe...

  • Qt开发经验小技巧146-150

    Qt中自带的很多控件,其实都是由一堆基础控件(QLabel、QPushButton等)组成的,比如日历面板 QCa...

  • 2.9 显示控件

    我们的输入控件终于结束了,今天小豆君来介绍显示控件。 2.9.1 QLabel 标签控件 标签控件可以用来显示文本...

  • 三 (3.2 imgproc) 图像金字塔-图放大与缩小

    一、背景 1.1.1 图像放大与缩小 当我们需要将图像转换到另一个尺寸的时候, 有两种可能:放大 图像 或者缩小 ...

  • SSD目标检测中的几个概念

    下采样(降采样):缩小图像。目的1:使图像符合显示区域的大小。2生成对应图像的缩略图上采样(放大图像,图像插值):...

  • 图像金字塔

    图像金字塔与图像尺寸变化(放大,缩小)是不同的.一般对图像进行放大或缩小,可以使用opencv resize 函数...

网友评论

      本文标题:QT::QLabel改造一个简单的图像显示放大缩小和平移控件

      本文链接:https://www.haomeiwen.com/subject/dvxgfdtx.html