fix fill patter scale for text. close #720

This commit is contained in:
Anton Lavrenov
2020-09-14 16:37:25 -05:00
parent 37466422d8
commit 44f79edbbb
6 changed files with 24 additions and 25 deletions

View File

@@ -2152,9 +2152,6 @@
if (fillPatternRotation) { if (fillPatternRotation) {
this.rotate(fillPatternRotation); this.rotate(fillPatternRotation);
} }
if (fillPatternScaleX || fillPatternScaleY) {
this.scale(fillPatternScaleX, fillPatternScaleY);
}
if (fillPatternOffsetX || fillPatternOffsetY) { if (fillPatternOffsetX || fillPatternOffsetY) {
this.translate(-1 * fillPatternOffsetX, -1 * fillPatternOffsetY); this.translate(-1 * fillPatternOffsetX, -1 * fillPatternOffsetY);
} }
@@ -7003,15 +7000,16 @@
if (this.fillPatternImage()) { if (this.fillPatternImage()) {
var ctx = getDummyContext(); var ctx = getDummyContext();
var pattern = ctx.createPattern(this.fillPatternImage(), this.fillPatternRepeat() || 'repeat'); var pattern = ctx.createPattern(this.fillPatternImage(), this.fillPatternRepeat() || 'repeat');
// TODO: how to enable it? It doesn't work in FF... if (pattern && pattern.setTransform) {
// pattern.setTransform({ pattern.setTransform({
// a: this.fillPatternScaleX(), // Horizontal scaling. A value of 1 results in no scaling. a: this.fillPatternScaleX(),
// b: 0, // Vertical skewing. b: 0,
// c: 0, // Horizontal skewing. c: 0,
// d: this.fillPatternScaleY(), // Vertical scaling. A value of 1 results in no scaling. d: this.fillPatternScaleY(),
// e: 0, // Horizontal translation (moving). e: 0,
// f: 0 // Vertical translation (moving). f: 0,
// }); });
}
return pattern; return pattern;
} }
}; };

2
konva.min.js vendored

File diff suppressed because one or more lines are too long

View File

@@ -676,7 +676,7 @@ export class SceneContext extends Context {
} }
if (fillPatternScaleX || fillPatternScaleY) { if (fillPatternScaleX || fillPatternScaleY) {
this.scale(fillPatternScaleX, fillPatternScaleY); // this.scale(fillPatternScaleX, fillPatternScaleY);
} }
if (fillPatternOffsetX || fillPatternOffsetY) { if (fillPatternOffsetX || fillPatternOffsetY) {

View File

@@ -242,15 +242,16 @@ export class Shape<Config extends ShapeConfig = ShapeConfig> extends Node<
this.fillPatternImage(), this.fillPatternImage(),
this.fillPatternRepeat() || 'repeat' this.fillPatternRepeat() || 'repeat'
); );
// TODO: how to enable it? It doesn't work in FF... if (pattern && pattern.setTransform) {
// pattern.setTransform({ pattern.setTransform({
// a: this.fillPatternScaleX(), // Horizontal scaling. A value of 1 results in no scaling. a: this.fillPatternScaleX(), // Horizontal scaling. A value of 1 results in no scaling.
// b: 0, // Vertical skewing. b: 0, // Vertical skewing.
// c: 0, // Horizontal skewing. c: 0, // Horizontal skewing.
// d: this.fillPatternScaleY(), // Vertical scaling. A value of 1 results in no scaling. d: this.fillPatternScaleY(), // Vertical scaling. A value of 1 results in no scaling.
// e: 0, // Horizontal translation (moving). e: 0, // Horizontal translation (moving).
// f: 0 // Vertical translation (moving). f: 0, // Vertical translation (moving).
// }); });
}
return pattern; return pattern;
} }
} }

View File

@@ -1,4 +1,4 @@
suite.only('Stage', function () { suite('Stage', function () {
// ====================================================== // ======================================================
test('instantiate stage with id', function () { test('instantiate stage with id', function () {
var container = Konva.document.createElement('div'); var container = Konva.document.createElement('div');

View File

@@ -1183,7 +1183,7 @@ suite('Text', function () {
imageObj.src = 'assets/darth-vader.jpg'; imageObj.src = 'assets/darth-vader.jpg';
}); });
test.skip('image gradient for text with scale', function (done) { test('image gradient for text with scale', function (done) {
Konva.pixelRatio = 1; Konva.pixelRatio = 1;
var imageObj = new Image(); var imageObj = new Image();
imageObj.onload = function () { imageObj.onload = function () {