浏览器上字体实际显示位置与FairyGUI中字体位置不一致,位置会偏上
具体表现如图所示。
CCC在不设置ttf字体的情况下默认使用Arial字体,所以这里文本字体设置成Arial消除字体的影响。
问题产生的原因在于CCC的字体渲染是通过canvas画布画出来的,先预留一行行高的空间,然后顶着画一行字体,再预留一行再画一行
[i]fgui给ccc label设定的行高是[/i]
这个问题有没有什么解决方案啊[/i]
CCC在不设置ttf字体的情况下默认使用Arial字体,所以这里文本字体设置成Arial消除字体的影响。
问题产生的原因在于CCC的字体渲染是通过canvas画布画出来的,先预留一行行高的空间,然后顶着画一行字体,再预留一行再画一行
_updateTexture: function() {
_context.clearRect(0, 0, _canvas.width, _canvas.height);
_context.font = _fontDesc;
var startPosition = this._calculateFillTextStartPosition();
var lineHeight = this._getLineHeight();
_context.lineJoin = "round";
_context.fillStyle = "rgba(" + _color.r + ", " + _color.g + ", " + _color.b + ", " + _color.a / 255 + ")";
var underlineStartPosition = void 0;
for (var i = 0; i < _splitedStrings.length; ++i) {
if (_isOutlined) {
var strokeColor = _outlineColor || WHITE;
_context.strokeStyle = "rgba(" + strokeColor.r + ", " + strokeColor.g + ", " + strokeColor.b + ", " + strokeColor.a / 255 + ")";
_context.lineWidth = 2 * _outlineWidth;
_context.strokeText(_splitedStrings[i], startPosition.x, startPosition.y + i * lineHeight);
}
//这里以lineHeight来定位画笔的起始位置
_context.fillText(_splitedStrings[i], startPosition.x, startPosition.y + i * lineHeight);
if (_isUnderline) {
underlineStartPosition = this._calculateUnderlineStartPosition();
_context.save();
_context.beginPath();
_context.lineWidth = _fontSize / 8;
_context.strokeStyle = "rgba(" + _color.r + ", " + _color.g + ", " + _color.b + ", " + _color.a / 255 + ")";
_context.moveTo(underlineStartPosition.x, underlineStartPosition.y + i * lineHeight - 1);
_context.lineTo(underlineStartPosition.x + _canvas.width, underlineStartPosition.y + i * lineHeight - 1);
_context.stroke();
_context.restore();
}
}
_texture.handleLoadedTexture();
}[/i][/i]
[i]fgui给ccc label设定的行高是[/i]
[i][i]this._label.lineHeight = fontSize + this._leading;[/i][/i][i]然后在FairyGUI编辑器里面,文本显示时是有默认的上下留白的,即使留白设置为0也有,导致编辑器显示和浏览器显示不一致
这个问题有没有什么解决方案啊[/i]
没有找到相关结果
已邀请:
5 个回复
谷主
赞同来自:
谷主
赞同来自:
canghai
赞同来自:
canghai
赞同来自:
谷主
赞同来自: