QMl自定義繪制圖形(二)

QML繪制圖形——Path

• • 步驟
  • 邏輯的代碼

這篇文章介紹如何實作繪制path，path的邏輯用C++實作，界面隻負責綁定資料，

步驟

第一步：建立一個Qt Quick Application -Empty 項目

第二步：添加一個C++類 并且繼承自 QQuickPaintedItem

第三步：把類型注冊到Qml裡，在qml調用的話直接import “module” 即可

邏輯的代碼

qmlPath.h

Q_INVOKABLE void pressEvent(const QPointF &p);
    Q_INVOKABLE void moveEvent(const QPointF &p);
    Q_INVOKABLE void releaseEvent(const QPointF &p);
           

qmlPath.cpp

void QmlPath::pressEvent(const QPointF &p)
{
    m_path.moveTo(p);
    update();
}

void QmlPath::moveEvent(const QPointF &p)
{
    m_path.lineTo(p);
    update();
}

void QmlPath::releaseEvent(const QPointF &p)
{
    m_path.lineTo(p);
    m_path.closeSubpath();
    update();
}
           

main.qml

onPressed: {
    qmlPath.pressEvent(Qt.point(mouse.x,mouse.y))
}
onPositionChanged: {
    qmlPath.moveEvent(Qt.point(mouse.x,mouse.y))
}
onReleased: {
    qmlPath.releaseEvent(Qt.point(mouse.x,mouse.y))
}
           

源代碼下載下傳位址