在 QQuickPaintedItem 上用鼠标绘制

Posted 2023-02-17

【中文标题】在 QQuickPaintedItem 上用鼠标绘制

【英文标题】：draw with the mouse on QQuickPaintedItem

【发布时间】：2021-08-07 10:38:21

【问题描述】：

我有这个代码

class cCanvas : public QQuickPaintedItem
..
..
void cCanvas::paint(QPainter *ppainter)

    ppainter->setPen(QPen(colorValue()));
    ppainter->drawLine(0, 0, rand() % 255 ,100);

QML

MultiPointTouchArea 
    onPressed 
        canvas.update();
    

它可以工作，但是在绘制每一行时，画布被清除，前一行被删除。但我希望这些台词留下来。

QML Canvas 有 requestPaint();

QQuickPaintedItem如何调用这个方法？

如何在 QQuickPaintedItem 上正确创建鼠标绘图功能？

（由于工作速度的原因，在 QML 画布上绘图本身不适合，因为绘图是使用计算进行的）

【参考方案1】：

Qt 不会缓存已绘制的内容，因此您只能看到最后绘制的内容。一种可能的解决方案是将行指令保存在 QPainterPath 中：

#ifndef CCANVAS_H
#define CCANVAS_H

#include <QPainterPath>
#include <QQuickPaintedItem>

class CCanvas : public QQuickPaintedItem

    Q_OBJECT
    Q_PROPERTY(QColor color READ color WRITE setColor NOTIFY colorChanged)
    QML_ELEMENT
public:
    CCanvas(QQuickItem *parent = nullptr);
    Q_INVOKABLE void requestPaint();
    void paint(QPainter *painter);
    const QColor &color() const;
    void setColor(const QColor &newColor);

signals:
    void colorChanged();

private:
    QPainterPath m_path;
    QColor m_color;
;

#endif // CCANVAS_H

#include "ccanvas.h"

#include <QPainter>

CCanvas::CCanvas(QQuickItem *parent):QQuickPaintedItem(parent)




void CCanvas::requestPaint()

    QPointF start(0, 0);
    QPointF end(rand() % 255, 100);
    m_path.moveTo(start);
    m_path.lineTo(end);
    update();


void CCanvas::paint(QPainter *painter)

    painter->setPen(QPen(m_color));
    painter->drawPath(m_path);


const QColor &CCanvas::color() const

    return m_color;


void CCanvas::setColor(const QColor &newColor)

    if (m_color == newColor)
        return;
    m_color = newColor;
    emit colorChanged();
    update();

import QtQuick 2.12
import QtQuick.Window 2.12
import Canvas 1.0

Window 
    width: 640
    height: 480
    visible: true
    title: qsTr("Hello World")

    CCanvas
        id: canvas
        anchors.fill: parent
        color: "red"
    

    Timer 
        interval: 500; running: true; repeat: true
        onTriggered: canvas.requestPaint()
    

QT += quick

CONFIG += c++11
SOURCES += \
        ccanvas.cpp \
        main.cpp

HEADERS += \
        ccanvas.h

RESOURCES += qml.qrc

CONFIG += qmltypes
QML_IMPORT_NAME = Canvas
QML_IMPORT_MAJOR_VERSION = 1

可以使用 QImage 完成类似的解决方案。