Mirrors/phaser
2
0
Fork 0
mirror of https://github.com/photonstorm/phaser synced 2024-11-23 21:24:09 +00:00
Code Issues Projects Releases Packages Wiki Activity

Updating TextStyle component to allow for setters and more style options.

Browse source
This commit is contained in:
photonstorm 2017-03-16 17:15:58 +00:00
parent 4838b9da1d
commit aa080cfe7b
2 changed files with 60 additions and 28 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

81
v3/src/gameobjects/text/TextStyle.js
View file

@ -1,44 +1,64 @@
var Class = require('../../utils/Class');
var GetObjectValue = require('../../utils/object/GetObjectValue');
// Key: [ Object Key, Default Value ]
var propertyMap = {
font: [ 'font', '16px Courier' ],
backgroundColor: [ 'backgroundColor', null ],
fill: [ 'fill', '#fff' ],
stroke: [ 'stroke', '#fff' ],
strokeThickness: [ 'strokeThickness', 0 ],
shadowOffsetX: [ 'shadow.offsetX', 0 ],
shadowOffsetY: [ 'shadow.offsetY', 0 ],
shadowColor: [ 'shadow.color', '#000' ],
shadowBlur: [ 'shadow.blur', 0 ],
shadowStroke: [ 'shadow.stroke', false ],
shadowFill: [ 'shadow.fill', false ],
align: [ 'align', 'left' ],
maxLines: [ 'maxLines', 0 ]
};
var TextStyle = new Class({
initialize:
function TextStyle (text, style)
{
if (style === undefined) { style = {}; }
// Needed?
this.text = text;
this.font = GetObjectValue(style, 'font', '16px Arial');
this.font = propertyMap.font[1];
this.backgroundColor = propertyMap.backgroundColor[1];
this.fill = propertyMap.fill[1];
this.stroke = propertyMap.stroke[1];
this.strokeThickness = propertyMap.strokeThickness[1];
this.shadowOffsetX = propertyMap.shadowOffsetX[1];
this.shadowOffsetY = propertyMap.shadowOffsetY[1];
this.shadowColor = propertyMap.shadowColor[1];
this.shadowBlur = propertyMap.shadowBlur[1];
this.shadowStroke = propertyMap.shadowStroke[1];
this.shadowFill = propertyMap.shadowFill[1];
this.align = propertyMap.align[1];
this.maxLines = propertyMap.maxLines[1];
this.backgroundColor = GetObjectValue(style, 'backgroundColor', null);
this.fill = GetObjectValue(style, 'fill', '#fff');
this.stroke = GetObjectValue(style, 'stroke', '#fff');
this.strokeThickness = GetObjectValue(style, 'strokeThickness', 0);
this.shadowOffsetX = GetObjectValue(style, 'shadow.offsetX', 0);
this.shadowOffsetY = GetObjectValue(style, 'shadow.offsetY', 0);
this.shadowColor = GetObjectValue(style, 'shadow.color', '#000');
this.shadowBlur = GetObjectValue(style, 'shadow.blur', 0);
this.shadowStroke = GetObjectValue(style, 'shadow.stroke', false);
this.shadowFill = GetObjectValue(style, 'shadow.fill', false);
this.align = GetObjectValue(style, 'align', 'left');
this.tabs = GetObjectValue(style, 'tabs', 0);
this.maxLines = GetObjectValue(style, 'maxLines', 0);
this.wordWrap = GetObjectValue(style, 'wordWrap', 0);
if (style !== undefined)
{
this.setStyle(style);
}
},
syncStyle: function (canvas, context)
setStyle: function (style)
{
for (var key in propertyMap)
{
this[key] = GetObjectValue(style, propertyMap[key][0], this[key]);
}
return this;
},
syncToCanvas: function (canvas, context)
{
context.font = this.font;
context.textBaseline = 'alphabetic';
@ -49,7 +69,14 @@ var TextStyle = new Class({
context.lineWidth = this.strokeThickness;
context.lineCap = 'round';
context.lineJoin = 'round';
}
},
setFont: function (font)
{
this.font = font;
// Tell Text it changed
},
});

7
v3/src/gameobjects/text/static/Text.js
View file

@ -81,6 +81,11 @@ var Text = new Class({
return this;
},
setStyle: function (style)
{
return this.style.setStyle(style);
},
updateText: function ()
{
var canvas = this.canvas;
@ -115,7 +120,7 @@ var Text = new Class({
context.fillRect(0, 0, canvas.width, canvas.height);
}
style.syncStyle(canvas, context);
style.syncToCanvas(canvas, context);
var linePositionX;
var linePositionY;