var __extends = (this && this.__extends) || (function () {
var extendStatics = function (d, b) {
extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return extendStatics(d, b);
};
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
/**
* @module annie
*/
var annie;
(function (annie) {
/**
* 动态文本类,有时需要在canvas里有一个动态文本,能根据我们的显示内容来改变
* @class annie.TextField
* @extends annie.Bitmap
* @since 1.0.0
* @public
*/
var TextField = /** @class */ (function (_super) {
__extends(TextField, _super);
function TextField() {
var _this = _super.call(this, null) || this;
_this._textAlign = "left";
_this._textAlpha = 1;
_this._textHeight = 0;
_this._lineHeight = 14;
_this._textWidth = 120;
_this._lineType = "single";
_this._text = "";
_this._font = "Arial";
_this._size = 12;
_this._color = "#fff";
_this._italic = false;
_this._bold = false;
_this._border = false;
_this._stroke = 0;
_this._strokeColor = "#000";
_this.realLines = [];
_this.a2x_ut = true;
_this._instanceType = "annie.TextField";
_this.bitmapData = window.document.createElement("canvas");
return _this;
}
Object.defineProperty(TextField.prototype, "textAlign", {
get: function () {
return this._textAlign;
},
/**
* 文本的对齐方式
* @property textAlign
* @public
* @since 1.0.0
* @type {string}
* @default left
*/
set: function (value) {
var s = this;
if (value != s._textAlign) {
s._textAlign = value;
s.a2x_ut = true;
}
},
enumerable: true,
configurable: true
});
Object.defineProperty(TextField.prototype, "textAlpha", {
get: function () {
return this._textAlpha;
},
/**
* @property textAlpha
* @since 2.0.0
* @public
*/
set: function (value) {
var s = this;
if (value != s._textAlpha) {
s._textAlpha = value;
s.a2x_ut = true;
}
},
enumerable: true,
configurable: true
});
Object.defineProperty(TextField.prototype, "textHeight", {
get: function () {
return this._textHeight;
},
/**
* 文本的行高
* @property textHeight
* @public
* @since 1.0.0
* @type {number}
* @default 0
*/
set: function (value) {
var s = this;
if (value != s._textHeight) {
s._textHeight = value;
s.a2x_ut = true;
}
},
enumerable: true,
configurable: true
});
Object.defineProperty(TextField.prototype, "lineHeight", {
get: function () {
return this._lineHeight;
},
/**
* @property lineHeight
* @public
* @since 1.0.0
* @param {number} value
*/
set: function (value) {
var s = this;
if (value != s._lineHeight) {
s._lineHeight = value;
s.a2x_ut = true;
}
},
enumerable: true,
configurable: true
});
Object.defineProperty(TextField.prototype, "textWidth", {
get: function () {
return this._textWidth;
},
/**
* 文本的宽
* @property textWidth
* @public
* @since 1.0.0
* @type {number}
* @default 0
*/
set: function (value) {
var s = this;
if (value != s._textWidth) {
s._textWidth = value;
s.a2x_ut = true;
}
},
enumerable: true,
configurable: true
});
Object.defineProperty(TextField.prototype, "lineType", {
get: function () {
return this._lineType;
},
/**
* 文本类型,单行还是多行 single multi
* @property lineType
* @public
* @since 1.0.0
* @type {string} 两种 single和multi
* @default single
*/
set: function (value) {
var s = this;
if (value != s._lineType) {
s._lineType = value;
s.a2x_ut = true;
}
},
enumerable: true,
configurable: true
});
Object.defineProperty(TextField.prototype, "text", {
get: function () {
return this._text;
},
/**
* 文本内容
* @property text
* @type {string}
* @public
* @default ""
* @since 1.0.0
*/
set: function (value) {
var s = this;
value += "";
if (value != s._text) {
s._text = value;
if (s._text == "") {
s.a2x_ut = false;
s._texture = null;
s._bitmapData.width = 0;
s._bitmapData.height = 0;
s.clearBounds();
}
else {
s.a2x_ut = true;
}
}
},
enumerable: true,
configurable: true
});
Object.defineProperty(TextField.prototype, "font", {
get: function () {
return this._font;
},
/**
* 文本的css字体样式
* @property font
* @public
* @since 1.0.0
* @type {string}
* @default 12px Arial
*/
set: function (value) {
var s = this;
if (value != s._font) {
s._font = value;
s.a2x_ut = true;
}
},
enumerable: true,
configurable: true
});
Object.defineProperty(TextField.prototype, "size", {
get: function () {
return this._size;
},
/**
* 文本的size
* @property size
* @public
* @since 1.0.0
* @type {number}
* @default 12
*/
set: function (value) {
var s = this;
if (value != s._size) {
s._size = value;
s.a2x_ut = true;
}
},
enumerable: true,
configurable: true
});
Object.defineProperty(TextField.prototype, "color", {
get: function () {
return this._color;
},
/**
* 文本的颜色值
* @property color
* @type {string}
* @public
* @since 1.0.0
* @default #fff
*/
set: function (value) {
var s = this;
if (value != s._color) {
s._color = value;
s.a2x_ut = true;
}
},
enumerable: true,
configurable: true
});
Object.defineProperty(TextField.prototype, "italic", {
get: function () {
return this._italic;
},
/**
* 文本是否倾斜
* @property italic
* @public
* @since
* @default false
* @type {boolean}
*/
set: function (value) {
var s = this;
if (value != s._italic) {
s._italic = value;
s.a2x_ut = true;
}
},
enumerable: true,
configurable: true
});
Object.defineProperty(TextField.prototype, "bold", {
get: function () {
return this._bold;
},
/**
* 文本是否加粗
* @property bold
* @public
* @since
* @default false
* @type {boolean}
*/
set: function (value) {
var s = this;
if (value != s._bold) {
s._bold = value;
s.a2x_ut = true;
}
},
enumerable: true,
configurable: true
});
Object.defineProperty(TextField.prototype, "border", {
get: function () {
return this._border;
},
/**
* 设置或获取是否有边框
* @property property
* @param {boolean} show true或false
* @public
* @since 1.0.6
*/
set: function (value) {
var s = this;
if (value != s._border) {
s._border = value;
s.a2x_ut = true;
}
},
enumerable: true,
configurable: true
});
Object.defineProperty(TextField.prototype, "stroke", {
get: function () {
return this._stroke;
},
/**
* 描边宽度 默认为0，不显示. 值为正数则是外描边，值为负数则是内描边
* @property stroke
* @param {number} value
* @since 2.0.2
*/
set: function (value) {
var s = this;
if (value != s._stroke) {
s._stroke = value;
s.a2x_ut = true;
}
},
enumerable: true,
configurable: true
});
Object.defineProperty(TextField.prototype, "strokeColor", {
get: function () {
return this._strokeColor;
},
/**
* 描边颜色 默认黑色
* @property strokeColor
* @param {string} value
* @since 2.0.2
*/
set: function (value) {
var s = this;
if (value != s._strokeColor) {
s._strokeColor = value;
s.a2x_ut = true;
}
},
enumerable: true,
configurable: true
});
//设置文本在canvas里的渲染样式
TextField.prototype._prepContext = function (ctx) {
var s = this;
var font = s.size || 12;
font += "px ";
font += s.font;
//font-weight:bold;font-style:italic;
if (s._bold) {
font = "bold " + font;
}
if (s._italic) {
font = "italic " + font;
}
ctx.font = font;
ctx.textAlign = s._textAlign || "left";
ctx.textBaseline = "top";
ctx.lineJoin = "miter";
ctx.miterLimit = 2.5;
ctx.fillStyle = annie.Shape.getRGBA(s._color, s._textAlpha);
//实线文字
ctx.strokeStyle = s.strokeColor;
ctx.lineWidth = Math.abs(s._stroke);
};
Object.defineProperty(TextField.prototype, "lines", {
/**
* 获取当前文本行数
* @property lines
* @type {number}
* @public
* @readonly
* @since 2.0.0
*/
get: function () {
return this.realLines.length;
},
enumerable: true,
configurable: true
});
// 获取文本宽
TextField.prototype._getMeasuredWidth = function (text) {
var ctx = this._bitmapData.getContext("2d");
//ctx.save();
var w = ctx.measureText(text).width;
//ctx.restore();
return w;
};
TextField.prototype._updateMatrix = function (isOffCanvas) {
if (isOffCanvas === void 0) { isOffCanvas = false; }
var s = this;
if (s.a2x_ut) {
var texture = s._bitmapData;
var ctx = texture.getContext("2d");
s.a2x_ut = false;
var hardLines = s._text.toString().split(/(?:\r\n|\r|\n)/);
var realLines = [];
s.realLines = realLines;
s._prepContext(ctx);
var wordW = 0;
var lineH = s._lineHeight;
if (s._text.indexOf("\n") < 0 && s.lineType == "single") {
realLines[realLines.length] = hardLines[0];
var str = hardLines[0];
var lineW = s._getMeasuredWidth(str);
if (lineW > s._textWidth) {
var w = s._getMeasuredWidth(str[0]);
var lineStr = str[0];
var strLen = str.length;
for (var j = 1; j < strLen; j++) {
wordW = ctx.measureText(str[j]).width;
w += wordW;
if (w > s._textWidth) {
realLines[0] = lineStr;
break;
}
else {
lineStr += str[j];
}
}
}
}
else {
for (var i = 0, l = hardLines.length; i < l; i++) {
var str = hardLines[i];
if (!str)
continue;
var w = s._getMeasuredWidth(str[0]);
var lineStr = str[0];
var strLen = str.length;
for (var j = 1; j < strLen; j++) {
wordW = ctx.measureText(str[j]).width;
w += wordW;
if (w > s._textWidth) {
realLines[realLines.length] = lineStr;
lineStr = str[j];
w = wordW;
}
else {
lineStr += str[j];
}
}
realLines[realLines.length] = lineStr;
}
}
var maxH = lineH * realLines.length + 4 >> 0;
var maxW = s._textWidth >> 0;
var tx = 0;
if (s._textAlign == "center") {
tx = maxW * 0.5;
}
else if (s._textAlign == "right") {
tx = maxW;
}
texture.width = maxW;
texture.height = maxH;
ctx.clearRect(0, 0, texture.width, texture.width);
if (s.border) {
ctx.beginPath();
ctx.strokeStyle = "#000";
ctx.lineWidth = 1;
ctx.strokeRect(0, 0, maxW, maxH);
ctx.closePath();
}
ctx.setTransform(1, 0, 0, 1, tx + 2, 2);
s._prepContext(ctx);
for (var i = 0; i < realLines.length; i++) {
if (s._stroke > 0) {
ctx.strokeText(realLines[i], 0, i * lineH, maxW);
}
ctx.fillText(realLines[i], 0, i * lineH, maxW);
if (s._stroke < 0) {
ctx.strokeText(realLines[i], 0, i * lineH, maxW);
}
}
if (s._filters.length > 0) {
s.a2x_uf = true;
}
else {
s._texture = texture;
}
}
_super.prototype._updateMatrix.call(this, isOffCanvas);
};
return TextField;
}(annie.Bitmap));
annie.TextField = TextField;
})(annie || (annie = {}));