mirror of
https://github.com/konvajs/konva.git
synced 2025-06-28 04:42:02 +08:00
fix shadow + corner radius for images, close #1734
This commit is contained in:
parent
ac1587fac8
commit
3f6f9f9365
@ -65,6 +65,11 @@ export class Image extends Shape<ImageConfig> {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
_useBufferCanvas() {
|
_useBufferCanvas() {
|
||||||
|
const hasCornerRadius = !!this.cornerRadius();
|
||||||
|
const hasShadow = this.hasShadow();
|
||||||
|
if (hasCornerRadius && hasShadow) {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
return super._useBufferCanvas(true);
|
return super._useBufferCanvas(true);
|
||||||
}
|
}
|
||||||
_sceneFunc(context: Context) {
|
_sceneFunc(context: Context) {
|
||||||
|
@ -413,4 +413,39 @@ describe('Image', function () {
|
|||||||
done();
|
done();
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
it('corner radius with shadow', function (done) {
|
||||||
|
// that will trigger buffer canvas
|
||||||
|
loadImage('darth-vader.jpg', (imageObj) => {
|
||||||
|
var stage = addStage();
|
||||||
|
|
||||||
|
var layer = new Konva.Layer();
|
||||||
|
var darth = new Konva.Image({
|
||||||
|
x: 20,
|
||||||
|
y: 20,
|
||||||
|
image: imageObj,
|
||||||
|
cornerRadius: 10,
|
||||||
|
draggable: true,
|
||||||
|
stroke: 'red',
|
||||||
|
strokeWidth: 100,
|
||||||
|
strokeEnabled: false,
|
||||||
|
shadowColor: 'black',
|
||||||
|
shadowBlur: 10,
|
||||||
|
shadowOffsetX: 10,
|
||||||
|
shadowOffsetY: 10,
|
||||||
|
scaleX: 0.5,
|
||||||
|
scaleY: 0.5,
|
||||||
|
});
|
||||||
|
|
||||||
|
layer.add(darth);
|
||||||
|
stage.add(layer);
|
||||||
|
|
||||||
|
assert.equal(
|
||||||
|
layer.getContext().getTrace(true),
|
||||||
|
'clearRect();save();shadowColor;shadowBlur;shadowOffsetX;shadowOffsetY;drawImage();restore();'
|
||||||
|
);
|
||||||
|
|
||||||
|
done();
|
||||||
|
});
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
Loading…
Reference in New Issue
Block a user