相关疑难解决方法(0)

可能重复:
撤消引擎的设计模式

一般来说,您如何处理在应用程序中支持"撤消"功能？我一直在研究网络应用程序和桌面应用程序,我从来没有真正对任何"撤消"系统感到满意.

我有一个画布 HTML5 绘图板。

我想创建一个具有撤消功能的按钮。

我该怎么做？

我的想法是拥有一个数组堆栈。每当您绘制并释放鼠标时，它都会通过推送将画布图像保存到撤消数组堆栈中。但是当我尝试它时，它并没有真正起作用......有更好的主意吗？

先感谢您！

var canvas = document.getElementById('paint');
var ctx = canvas.getContext('2d');
var sketch = document.getElementById('sketch');
var sketch_style = getComputedStyle(sketch);

var mouse = {x: 0, y: 0};

canvas.addEventListener('mousemove', function(e) {
mouse.x = e.pageX - this.offsetLeft;
mouse.y = e.pageY - this.offsetTop;
}, false);

ctx.lineJoin = 'round';
ctx.lineCap = 'round';

ctx.strokeStyle = "red";
function getColor(colour){ctx.strokeStyle = colour;}

function getSize(size){ctx.lineWidth = size;}

canvas.addEventListener('mousedown', function(e) {
ctx.beginPath();
ctx.moveTo(mouse.x, mouse.y);

canvas.addEventListener('mousemove', onPaint, false);
}, false);

canvas.addEventListener('mouseup', function() {
canvas.removeEventListener('mousemove', onPaint, false);
}, …