c++ - 在 QWidget 上动态画一条线

Question

这是在小部件上画一条线的代码。问题是它保留了先前绘制的线条，并且每次鼠标移动时它都会一次又一次地绘制。我想像 mspaint 一样绘制，即只有在鼠标释放事件时它才会完成线条绘制(否则只是线条预览)。我想到的一个想法是在每次鼠标移动时删除预览线，另一个是绘制一些临时 View 并在鼠标释放时完成它。但是很难找到正确的方法。 感谢您的帮助

#include "paintwidget.h"
#include "ui_paintwidget.h"

#include <QtGui>

paintWidget::paintWidget(QWidget* parent)
    : QWidget(parent)
    , ui(new Ui::paintWidget)
{
    ui->setupUi(this);

    m_nInitialX = 0;
    m_nInitialY = 0;
    m_nFinalX = 0;
    m_nFinalY = 0;
    m_nPTargetPixmap = 0;
    m_nPTargetPixmap = new QPixmap(400, 400);
    m_nbMousePressed = false;
}

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

void paintWidget::mousePressEvent(QMouseEvent* event)
{
    m_nbMousePressed = true;
    m_nInitialX = event->pos().x();
    m_nInitialY = event->pos().y();
}

void paintWidget::mouseReleaseEvent(QMouseEvent* event)
{
    m_nbMousePressed = false;
    //update();
}

void paintWidget::paintEvent(QPaintEvent* e)
{
    if (m_nbMousePressed) {
        QPainter PixmapPainter(m_nPTargetPixmap);
        QPen pen(Qt::green);
        PixmapPainter.setPen(pen);
        //PixmapPainter.drawLine(m_nInitialX, m_nInitialY, m_nFinalX, m_nFinalY);
    }
    QPainter painter(this);
    painter.drawPixmap(0, 0, *m_nPTargetPixmap);
}

void paintWidget::mouseMoveEvent(QMouseEvent* event)
{
    if (event->type() == QEvent::MouseMove) {
        QPainter PixmapPainter(m_nPTargetPixmap);
        QPen pen(Qt::black);
        PixmapPainter.setPen(pen);
        PixmapPainter.drawLine(m_nInitialX, m_nInitialY, m_nFinalX, m_nFinalY);
        update(); // update your view
        m_nFinalX = event->pos().x();
        m_nFinalY = event->pos().y();
    }
    update(); // update your view
}

Answer 1

我把我的来源放在这里:

https://github.com/peteristhegreat/persistent_paint

注意添加的评论

相关文件如下:

#include "paintwidget.h"
#include <QPainter>
#include <QPen>
#include <QBrush>
#include <QDebug>

PaintWidget::PaintWidget(QWidget *parent) : QWidget(parent)
{
// the ui form wasn't needed here, so I added it without it.

// QLine neatly keeps track of both the two points, m_line in this case
//    m_nInitialX = 0;
//    m_nInitialY = 0;
//    m_nFinalX = 0;
//    m_nFinalY = 0;
//    m_nPTargetPixmap = 0;
//    m_nPTargetPixmap = new QPixmap(400,400);
    m_nPTargetPixmap = QPixmap(400,400);// put the pixmap on the stack instead of the heap
    m_nPTargetPixmap.fill();
    m_nbMousePressed = false;
}

PaintWidget::~PaintWidget()
{
//    delete ui;
}

void PaintWidget::mousePressEvent(QMouseEvent* event)
{
    m_nbMousePressed = true;
//    m_nInitialX = event->pos().x();
//    m_nInitialY = event->pos().y();
    m_line.setP1(event->pos());
    m_line.setP2(event->pos());
}

void PaintWidget::mouseReleaseEvent(QMouseEvent *event)
{
    m_nbMousePressed = false;
    update();
}

void PaintWidget::paintEvent(QPaintEvent *e)
{
    static bool wasPressed = false;
    QPainter painter(this);

    if(m_nbMousePressed)
    {
        painter.drawPixmap(0, 0, m_nPTargetPixmap);
        painter.drawLine(m_line);
        wasPressed = true;
    }
    else if(wasPressed)
    {
        // Note that this painting only needs to happen once,
        // right when the mouse is released.
        QPainter PixmapPainter(&m_nPTargetPixmap);
        QPen pen(Qt::green);
        PixmapPainter.setPen(pen);
        PixmapPainter.drawLine(m_line);

        painter.drawPixmap(0, 0, m_nPTargetPixmap);
        wasPressed = false;
    }
}

void PaintWidget::mouseMoveEvent(QMouseEvent *event)
{
    if (event->type() == QEvent::MouseMove)
    {
//        QPainter PixmapPainter(m_nPTargetPixmap);
//        QPen pen(Qt::black);
//        PixmapPainter.setPen(pen);
//        PixmapPainter.drawLine(m_nInitialX, m_nInitialY, m_nFinalX, m_nFinalY);
//        m_nFinalX = event->pos().x();
//        m_nFinalY = event->pos().y();
        m_line.setP2(event->pos());
//        update(); // update your view
    }
    update(); // update your view
}

---

更新:使用 QGraphicsScene 和绘制线条和椭圆的附加信息:

QGraphicsScene 有当你点击场景时可以添加的线条和椭圆。

How to draw a point (on mouseclick) on a QGraphicsScene?

Arc in QGraphicsScene

http://doc.qt.io/qt-5/graphicsview.html

http://doc.qt.io/qt-5/examples-graphicsview.html

这个例子看起来特别相似:

http://doc.qt.io/qt-5/qtwidgets-graphicsview-diagramscene-example.html

希望对您有所帮助。