EaselJS的Text中文不会自动换行的问题

雷乌斯

于 2016-03-28 19:21:32 发布

阅读量2.7k

点赞数 1

分类专栏： html5 文章标签： createjs

本文链接：https://blog.youkuaiyun.com/yyf1990cs/article/details/51000447

版权

本文档主要讨论EaselJS在处理中文文本时遇到的自动换行问题。默认情况下，EaselJS根据英文单词间的空格进行换行，导致中文文本无法正确换行。作者发现这一问题并分享了解决方案，包括修改EaselJS源代码中的_p_drawText方法来适应中文文本的换行需求。此外，还提到了一个关于多行文本的奇数字符数导致的末尾出现'Undefined'的BUG及其修正方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一开始还没发现这个问题，只是在想为什么设了textWidth却无法换行。去官方找例子，都是好的，到我这里就不行了。

最后才想起来自己的文本都是汉字，别人的都是英文。你妈嗨，怪不得

原来默认是根据英文单词中间的空格来换的，汉字的情况就gg了。。。

修改easeljs的源文件，p._drawText方法如下

/**
	 * Draws multiline text.
	 * @method _drawText
	 * @param {CanvasRenderingContext2D} ctx
	 * @param {Object} o
	 * @param {Array} lines
	 * @return {Object}
	 * @protected
	 **/
	p._drawText = function(ctx, o, lines) {
		var paint = !!ctx;
		if (!paint) {
			ctx = Text._workingContext;
			ctx.save();
			this._prepContext(ctx);
		}
		var lineHeight = this.lineHeight||this.getMeasuredLineHeight();

		var maxW = 0, count = 0;
		var hardLines = String(this.text).split(/(?:\r\n|\r|\n)/);
		for (var i=0, l=hardLines.length; i<l; i++) {
			var str = hardLines[i];
			var w = null;

			if (this.lineWidth != null && (w =

最低0.47元/天解锁文章