fix: merge two strokecanvas into one + better cursorShape and pointer handling
This commit is contained in:
@@ -8,13 +8,13 @@ Item {
|
||||
|
||||
property color inkColor: "#ff3b30"
|
||||
property real inkWidth: 4
|
||||
required property Rectangle selection
|
||||
property string tool: "none"
|
||||
|
||||
signal changed
|
||||
|
||||
function clearAll() {
|
||||
committedCanvas.clear();
|
||||
previewCanvas.clear();
|
||||
canvas.clear();
|
||||
changed();
|
||||
}
|
||||
|
||||
@@ -54,89 +54,82 @@ Item {
|
||||
}
|
||||
|
||||
function undo() {
|
||||
committedCanvas.undoLastGroup();
|
||||
canvas.undoLastGroup();
|
||||
changed();
|
||||
}
|
||||
|
||||
anchors.fill: parent
|
||||
|
||||
StrokeCanvas {
|
||||
id: committedCanvas
|
||||
id: canvas
|
||||
|
||||
anchors.fill: parent
|
||||
penColor: root.inkColor
|
||||
penWidth: root.inkWidth
|
||||
}
|
||||
|
||||
StrokeCanvas {
|
||||
id: previewCanvas
|
||||
|
||||
anchors.fill: parent
|
||||
penColor: root.inkColor
|
||||
penWidth: root.inkWidth
|
||||
}
|
||||
|
||||
PointHandler {
|
||||
MouseArea {
|
||||
id: drawHandler
|
||||
|
||||
property real startX
|
||||
property real startY
|
||||
property bool started: false
|
||||
|
||||
acceptedButtons: Qt.LeftButton | Qt.RightButton
|
||||
anchors.fill: parent
|
||||
cursorShape: undefined
|
||||
enabled: root.tool !== "none"
|
||||
hoverEnabled: true
|
||||
|
||||
onActiveChanged: {
|
||||
if (active)
|
||||
onPositionChanged: e => {
|
||||
const x = e.x;
|
||||
const y = e.y;
|
||||
|
||||
canvas.hoverPoint = Qt.point(x, y);
|
||||
|
||||
if (!pressed)
|
||||
return;
|
||||
|
||||
if (root.tool === "pen") {
|
||||
committedCanvas.endStroke();
|
||||
} else if (started) {
|
||||
const pts = root.sampleShape(root.tool, startX, startY, point.position.x, point.position.y);
|
||||
if (pts.length > 0) {
|
||||
committedCanvas.beginStroke(pts[0][0], pts[0][1], true);
|
||||
for (let i = 1; i < pts.length; i++)
|
||||
committedCanvas.appendPoint(pts[i][0], pts[i][1]);
|
||||
committedCanvas.endStroke();
|
||||
}
|
||||
previewCanvas.clear();
|
||||
}
|
||||
started = false;
|
||||
root.changed();
|
||||
}
|
||||
onPointChanged: {
|
||||
if (!active)
|
||||
canvas.appendPoint(x, y);
|
||||
return;
|
||||
}
|
||||
|
||||
if (point.pressedButtons & Qt.RightButton) {
|
||||
root.clearAll();
|
||||
return;
|
||||
const pts = root.sampleShape(root.tool, startX, startY, x, y);
|
||||
if (pts.length > 0) {
|
||||
canvas.beginStroke(pts[0][0], pts[0][1], true);
|
||||
for (let i = 1; i < pts.length; i++)
|
||||
canvas.appendPoint(pts[i][0], pts[i][1]);
|
||||
}
|
||||
}
|
||||
onPressed: e => {
|
||||
if (e.button & Qt.LeftButton) {
|
||||
startX = e.x;
|
||||
startY = e.y;
|
||||
canvas.beginStroke(e.x, e.y);
|
||||
} else if (e.button & Qt.RightButton) {
|
||||
root.clearAll();
|
||||
}
|
||||
}
|
||||
onPressedChanged: if (!pressed)
|
||||
canvas.endStroke()
|
||||
}
|
||||
|
||||
HoverHandler {
|
||||
cursorShape: {
|
||||
if (root.tool === "none")
|
||||
return undefined;
|
||||
|
||||
const x = point.position.x;
|
||||
const y = point.position.y;
|
||||
const withinXWidth = x > root.selection.x && x < root.selection.x + root.selection.implicitWidth;
|
||||
const withinYHeight = y > root.selection.y && y < root.selection.y + root.selection.implicitHeight;
|
||||
|
||||
if (root.tool === "pen") {
|
||||
if (!started) {
|
||||
started = true;
|
||||
committedCanvas.beginStroke(x, y);
|
||||
return;
|
||||
}
|
||||
committedCanvas.appendPoint(x, y);
|
||||
return;
|
||||
}
|
||||
|
||||
if (!started) {
|
||||
started = true;
|
||||
startX = point.pressPosition.x;
|
||||
startY = point.pressPosition.y;
|
||||
}
|
||||
const pts = root.sampleShape(root.tool, startX, startY, x, y);
|
||||
if (pts.length > 0) {
|
||||
previewCanvas.beginStroke(pts[0][0], pts[0][1], true);
|
||||
for (let i = 1; i < pts.length; i++)
|
||||
previewCanvas.appendPoint(pts[i][0], pts[i][1]);
|
||||
if (withinXWidth && withinYHeight) {
|
||||
canvas.showHover(x, y);
|
||||
return Qt.BlankCursor;
|
||||
} else {
|
||||
canvas.hideHover();
|
||||
return undefined;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -5,6 +5,7 @@ import QtQuick
|
||||
Item {
|
||||
id: root
|
||||
|
||||
required property int border
|
||||
property color handleBorder: "#3584e4"
|
||||
property color handleFill: "white"
|
||||
property real hs: 12
|
||||
@@ -13,6 +14,8 @@ Item {
|
||||
required property real selW
|
||||
required property real selX
|
||||
required property real selY
|
||||
required property Rectangle selection
|
||||
required property string tool
|
||||
|
||||
signal boundsChanged(x: real, y: real, w: real, h: real)
|
||||
signal dragFinished
|
||||
@@ -29,6 +32,7 @@ Item {
|
||||
property real accumX: 0
|
||||
property real accumY: 0
|
||||
|
||||
cursorShape: undefined
|
||||
target: null
|
||||
|
||||
onActiveChanged: {
|
||||
@@ -45,51 +49,63 @@ Item {
|
||||
}
|
||||
}
|
||||
|
||||
HoverHandler {
|
||||
cursorShape: {
|
||||
if (root.tool !== "move")
|
||||
return undefined;
|
||||
|
||||
if (moveHandler.centroid.pressedButtons & Qt.LeftButton)
|
||||
return Qt.ClosedHandCursor;
|
||||
else
|
||||
return Qt.OpenHandCursor;
|
||||
}
|
||||
}
|
||||
|
||||
Handle {
|
||||
edge: "tl"
|
||||
x: -root.hs / 2
|
||||
y: -root.hs / 2
|
||||
x: -(root.hs + root.border) / 2
|
||||
y: -(root.hs + root.border) / 2
|
||||
}
|
||||
|
||||
Handle {
|
||||
edge: "t"
|
||||
x: root.width / 2 - root.hs / 2
|
||||
y: -root.hs / 2
|
||||
y: -(root.hs + root.border) / 2
|
||||
}
|
||||
|
||||
Handle {
|
||||
edge: "tr"
|
||||
x: root.width - root.hs / 2
|
||||
y: -root.hs / 2
|
||||
x: root.width - root.hs / 2 + root.border / 2
|
||||
y: -(root.hs + root.border) / 2
|
||||
}
|
||||
|
||||
Handle {
|
||||
edge: "r"
|
||||
x: root.width - root.hs / 2
|
||||
x: root.width - root.hs / 2 + root.border / 2
|
||||
y: root.height / 2 - root.hs / 2
|
||||
}
|
||||
|
||||
Handle {
|
||||
edge: "br"
|
||||
x: root.width - root.hs / 2
|
||||
y: root.height - root.hs / 2
|
||||
x: root.width - root.hs / 2 + root.border / 2
|
||||
y: root.height - root.hs / 2 + root.border / 2
|
||||
}
|
||||
|
||||
Handle {
|
||||
edge: "b"
|
||||
x: root.width / 2 - root.hs / 2
|
||||
y: root.height - root.hs / 2
|
||||
y: root.height - root.hs / 2 + root.border / 2
|
||||
}
|
||||
|
||||
Handle {
|
||||
edge: "bl"
|
||||
x: -root.hs / 2
|
||||
y: root.height - root.hs / 2
|
||||
x: -(root.hs + root.border) / 2
|
||||
y: root.height - root.hs / 2 + root.border / 2
|
||||
}
|
||||
|
||||
Handle {
|
||||
edge: "l"
|
||||
x: -root.hs / 2
|
||||
x: -(root.hs + root.border) / 2
|
||||
y: root.height / 2 - root.hs / 2
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user