added setDrawFunc() method to Shape so that you can dynamically change the drawing function. added new unit test

This commit is contained in:
Eric Rowell 2012-03-31 00:14:18 -07:00
parent 9994e8a37e
commit 99d9381411
4 changed files with 52 additions and 1 deletions

View File

@ -1971,6 +1971,13 @@ Kinetic.Shape.prototype = {
getStrokeWidth: function() {
return this.strokeWidth;
},
/**
* set draw function
* @param {Function} func drawing function
*/
setDrawFunc: function(func) {
this.drawFunc = func;
},
/**
* draw shape
* @param {Layer} layer Layer that the shape will be drawn on

File diff suppressed because one or more lines are too long

View File

@ -133,6 +133,13 @@ Kinetic.Shape.prototype = {
getStrokeWidth: function() {
return this.strokeWidth;
},
/**
* set draw function
* @param {Function} func drawing function
*/
setDrawFunc: function(func) {
this.drawFunc = func;
},
/**
* draw shape
* @param {Layer} layer Layer that the shape will be drawn on

View File

@ -806,6 +806,43 @@ Test.prototype.tests = {
layer.add(shape);
stage.add(layer);
},
'SHAPES - change custom shape draw func': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,
width: 578,
height: 200
});
var layer = new Kinetic.Layer();
var shape = new Kinetic.Shape({
drawFunc: function() {
var context = this.getContext();
context.beginPath();
context.moveTo(0, 0);
context.lineTo(100, 0);
context.lineTo(100, 100);
context.closePath();
this.fillStroke();
},
x: 200,
y: 100,
fill: 'green',
stroke: 'blue',
strokeWidth: 5
});
shape.setDrawFunc(function() {
var context = this.getContext();
context.beginPath();
context.moveTo(0, 0);
context.lineTo(200, 0);
context.lineTo(200, 100);
context.closePath();
this.fillStroke();
});
layer.add(shape);
stage.add(layer);
},
'SHAPES - init with position, scale, rotation, then change scale': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,