lsm/konva
1
0
Fork 0
mirror of https://github.com/konvajs/konva.git synced 2025-06-28 02:21:20 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

added new getTextSize(), getTextWidth(), and getTextHeight() methods

Browse Source
This commit is contained in:
Eric Rowell 2012-03-31 15:40:27 -07:00
parent 8398670a47
commit 8f104a6fad
4 changed files with 87 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
dist/kinetic-core.js vendored
View File

@ -2508,9 +2508,8 @@ Kinetic.Text = function(config) {
var context = this.getContext();
context.font = this.fontStyle + ' ' + this.fontSize + 'pt ' + this.fontFamily;
context.textBaseline = 'middle';
var metrics = context.measureText(this.text);
var textHeight = textHeight = parseInt(this.fontSize, 10);
var textWidth = metrics.width;
var textHeight = this.getTextHeight();
var textWidth = this.getTextWidth();
var p = this.padding;
var x = 0;
var y = 0;
@ -2699,6 +2698,32 @@ Kinetic.Text.prototype = {
*/
getText: function() {
return this.text;
},
/**
* get text width in pixels
*/
getTextWidth: function() {
return this.getTextSize().width;
},
/**
* get text height in pixels
*/
getTextHeight: function() {
return this.getTextSize().height;
},
/**
* get text size in pixels
*/
getTextSize: function() {
var context = this.getContext();
context.save();
context.font = this.fontStyle + ' ' + this.fontSize + 'pt ' + this.fontFamily;
var metrics = context.measureText(this.text);
context.restore();
return {
width: metrics.width,
height: parseInt(this.fontSize, 10)
};
}
};
// extend Shape

2
dist/kinetic-core.min.js vendored
View File

File diff suppressed because one or more lines are too long

31
src/shapes/Text.js
View File

@ -36,9 +36,8 @@ Kinetic.Text = function(config) {
var context = this.getContext();
context.font = this.fontStyle + ' ' + this.fontSize + 'pt ' + this.fontFamily;
context.textBaseline = 'middle';
var metrics = context.measureText(this.text);
var textHeight = textHeight = parseInt(this.fontSize, 10);
var textWidth = metrics.width;
var textHeight = this.getTextHeight();
var textWidth = this.getTextWidth();
var p = this.padding;
var x = 0;
var y = 0;
@ -227,6 +226,32 @@ Kinetic.Text.prototype = {
*/
getText: function() {
return this.text;
},
/**
* get text width in pixels
*/
getTextWidth: function() {
return this.getTextSize().width;
},
/**
* get text height in pixels
*/
getTextHeight: function() {
return this.getTextSize().height;
},
/**
* get text size in pixels
*/
getTextSize: function() {
var context = this.getContext();
context.save();
context.font = this.fontStyle + ' ' + this.fontSize + 'pt ' + this.fontFamily;
var metrics = context.measureText(this.text);
context.restore();
return {
width: metrics.width,
height: parseInt(this.fontSize, 10)
};
}
};
// extend Shape

31
tests/js/unitTests.js
View File

@ -905,7 +905,7 @@ Test.prototype.tests = {
layer.add(rect);
stage.add(layer);
},
'SHAPES - add text': function(containerId) {
'Text - add text': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,
width: 578,
@ -971,6 +971,35 @@ Test.prototype.tests = {
test(text.getTextStroke() === 'red', 'text stroke should be red');
test(text.getTextStrokeWidth() === 10, 'test stroke width should be 10');
},
'Text - get metrics': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,
width: 578,
height: 200
});
var layer = new Kinetic.Layer();
var text = new Kinetic.Text({
x: stage.width / 2,
y: stage.height / 2,
text: 'Hello World!',
fontSize: 60,
fontFamily: 'Calibri',
fontStyle: 'normal',
textFill: 'green',
fontStyle: 'italic',
align: 'center',
verticalAlign: 'middle'
});
layer.add(text);
stage.add(layer);
test(text.getTextSize().width === 407, 'text width should be 407px');
test(text.getTextSize().height === 60, 'text height should be 60px');
test(text.getTextWidth() === 407, 'text width should be 407px');
test(text.getTextHeight() === 60, 'text height should be 60px');
},
'SHAPES - get shape name': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,