fix cliping with zero size. close #1723

This commit is contained in:
Anton Lavrenov 2024-03-03 10:42:25 +07:00
parent e7672858b7
commit eb4e2b4fef
2 changed files with 40 additions and 7 deletions

View File

@ -392,7 +392,9 @@ export abstract class Container<
clipWidth = this.clipWidth(), clipWidth = this.clipWidth(),
clipHeight = this.clipHeight(), clipHeight = this.clipHeight(),
clipFunc = this.clipFunc(), clipFunc = this.clipFunc(),
hasClip = (clipWidth && clipHeight) || clipFunc; hasClip =
(typeof clipWidth === 'number' && typeof clipHeight === 'number') ||
clipFunc;
const selfCache = top === this; const selfCache = top === this;
@ -408,7 +410,7 @@ export abstract class Container<
} else { } else {
var clipX = this.clipX(); var clipX = this.clipX();
var clipY = this.clipY(); var clipY = this.clipY();
context.rect(clipX, clipY, clipWidth, clipHeight); context.rect(clipX || 0, clipY || 0, clipWidth, clipHeight);
} }
context.clip.apply(context, clipArgs); context.clip.apply(context, clipArgs);
m = transform.copy().invert().getMatrix(); m = transform.copy().invert().getMatrix();

View File

@ -55,15 +55,43 @@ describe('Group', function () {
var path = new Konva.Group({ var path = new Konva.Group({
width: 100, width: 100,
height: 100, height: 100,
clipFunc: () => [new Path2D('M0 0v50h50Z')] clipFunc: () => [new Path2D('M0 0v50h50Z')],
}); });
layer.add(path); layer.add(path);
stage.add(layer); stage.add(layer);
const trace = layer.getContext().getTrace() const trace = layer.getContext().getTrace();
assert.equal(trace, 'clearRect(0,0,578,200);save();transform(1,0,0,1,0,0);beginPath();clip([object Path2D]);transform(1,0,0,1,0,0);restore();'); assert.equal(
trace,
'clearRect(0,0,578,200);save();transform(1,0,0,1,0,0);beginPath();clip([object Path2D]);transform(1,0,0,1,0,0);restore();'
);
});
it('clip group with by zero size', function () {
var stage = addStage();
var layer = new Konva.Layer();
var group = new Konva.Group({
width: 100,
height: 100,
clipWidth: 0,
clipHeight: 0,
});
layer.add(group);
stage.add(layer);
const trace = layer.getContext().getTrace();
console.log(trace);
assert.equal(
trace,
'clearRect(0,0,578,200);save();transform(1,0,0,1,0,0);beginPath();rect(0,0,0,0);clip();transform(1,0,0,1,0,0);restore();'
);
}); });
it('clip group with a Path2D and clipRule', function () { it('clip group with a Path2D and clipRule', function () {
@ -80,8 +108,11 @@ describe('Group', function () {
layer.add(path); layer.add(path);
stage.add(layer); stage.add(layer);
const trace = layer.getContext().getTrace() const trace = layer.getContext().getTrace();
assert.equal(trace, 'clearRect(0,0,578,200);save();transform(1,0,0,1,0,0);beginPath();clip([object Path2D],evenodd);transform(1,0,0,1,0,0);restore();'); assert.equal(
trace,
'clearRect(0,0,578,200);save();transform(1,0,0,1,0,0);beginPath();clip([object Path2D],evenodd);transform(1,0,0,1,0,0);restore();'
);
}); });
}); });