mirror of
https://github.com/konvajs/konva.git
synced 2025-09-19 02:37:59 +08:00
fixed flickering when a node was added to the stage, updated, and redraw due to throttling
This commit is contained in:
7
dist/kinetic-core.js
vendored
7
dist/kinetic-core.js
vendored
@@ -1685,6 +1685,13 @@ Kinetic.Stage.prototype = {
|
|||||||
// draw layer and append canvas to container
|
// draw layer and append canvas to container
|
||||||
layer.draw();
|
layer.draw();
|
||||||
this.content.appendChild(layer.canvas);
|
this.content.appendChild(layer.canvas);
|
||||||
|
|
||||||
|
/*
|
||||||
|
* set layer last draw time to zero
|
||||||
|
* so that throttling doesn't take into account
|
||||||
|
* the layer draws associated with adding a node
|
||||||
|
*/
|
||||||
|
layer.lastDrawTime = 0;
|
||||||
},
|
},
|
||||||
/**
|
/**
|
||||||
* get mouse position for desktop apps
|
* get mouse position for desktop apps
|
||||||
|
4
dist/kinetic-core.min.js
vendored
4
dist/kinetic-core.min.js
vendored
File diff suppressed because one or more lines are too long
@@ -309,6 +309,13 @@ Kinetic.Stage.prototype = {
|
|||||||
// draw layer and append canvas to container
|
// draw layer and append canvas to container
|
||||||
layer.draw();
|
layer.draw();
|
||||||
this.content.appendChild(layer.canvas);
|
this.content.appendChild(layer.canvas);
|
||||||
|
|
||||||
|
/*
|
||||||
|
* set layer last draw time to zero
|
||||||
|
* so that throttling doesn't take into account
|
||||||
|
* the layer draws associated with adding a node
|
||||||
|
*/
|
||||||
|
layer.lastDrawTime = 0;
|
||||||
},
|
},
|
||||||
/**
|
/**
|
||||||
* get mouse position for desktop apps
|
* get mouse position for desktop apps
|
||||||
|
@@ -40,8 +40,37 @@ Test.prototype.tests = {
|
|||||||
stage.add(layer);
|
stage.add(layer);
|
||||||
layer.add(group);
|
layer.add(group);
|
||||||
layer.draw();
|
layer.draw();
|
||||||
|
},
|
||||||
|
'STAGE - test layer throttle': function(containerId) {
|
||||||
|
var stage = new Kinetic.Stage({
|
||||||
|
container: containerId,
|
||||||
|
width: 578,
|
||||||
|
height: 200
|
||||||
|
});
|
||||||
|
var layer = new Kinetic.Layer();
|
||||||
|
var group = new Kinetic.Group();
|
||||||
|
var circle = new Kinetic.Circle({
|
||||||
|
x: stage.getWidth() / 2,
|
||||||
|
y: stage.getHeight() / 2,
|
||||||
|
radius: 70,
|
||||||
|
fill: 'green',
|
||||||
|
stroke: 'black',
|
||||||
|
strokeWidth: 4,
|
||||||
|
name: 'myCircle'
|
||||||
|
});
|
||||||
|
|
||||||
console.log(circle);
|
group.add(circle);
|
||||||
|
layer.add(group);
|
||||||
|
stage.add(layer);
|
||||||
|
|
||||||
|
/*
|
||||||
|
* if throttling isn't working correctly, then the circle will
|
||||||
|
* flash green and then turn red
|
||||||
|
*/
|
||||||
|
circle.setFill('red');
|
||||||
|
layer.draw();
|
||||||
|
|
||||||
|
|
||||||
},
|
},
|
||||||
'STAGE - add shape with linear gradient fill': function(containerId) {
|
'STAGE - add shape with linear gradient fill': function(containerId) {
|
||||||
var stage = new Kinetic.Stage({
|
var stage = new Kinetic.Stage({
|
||||||
|
Reference in New Issue
Block a user