Laya的文本渲染会在不同的设备上有下沉偏移的效果,实测改动后下沉效果得到良好控制
复写Text类的_renderText方法

Laya.Text.prototype['_renderText'] = Text.prototype['_renderText']

方法实现如下


export class Text extends Laya.Text {
    declare _style: any;
    declare _width: number;
    declare _height: number;
    _renderText() {
        var padding = this.padding ;
        var visibleLineCount = this._lines.length;
        if (this.overflow != Text.VISIBLE) {
            visibleLineCount = Math.min(visibleLineCount, Math.floor((this.height - padding[0] - padding[2]) / (this.leading + this._charSize.height)) + 1);
        }
        var beginLine = this.scrollY / (this._charSize.height + this.leading) | 0;
        var graphics = this.graphics;
        graphics.clear(true);
        var ctxFont = this._getContextFont();
        Laya.Browser.context.font = ctxFont;
        var startX = padding[3];
        var textAlgin = "left";
        var lines = this._lines;
        var lineHeight = this.leading + this._charSize.height;
        var tCurrBitmapFont = this._style.currBitmapFont;
        if (tCurrBitmapFont) {
            lineHeight = this.leading + tCurrBitmapFont.getMaxHeight();
        }
        var startY = padding[0];
        if ((!tCurrBitmapFont) && this._width > 0 && this._textWidth <= this._width) {
            if (this.align == "right") {
                textAlgin = "right";
                startX = this._width - padding[1];
            }
            else if (this.align == "center") {
                textAlgin = "center";
                startX = this._width * 0.5 + padding[3] - padding[1];
            }
        }
        let bitmapScale = 1;
        if (tCurrBitmapFont && tCurrBitmapFont.autoScaleSize) {
            bitmapScale = tCurrBitmapFont.fontSize / this.fontSize;
        }
        if (this._height > 0) {
            var tempVAlign = (this._textHeight > this._height) ? "top" : this.valign;
            if (tempVAlign === "middle")
                startY = (this._height - visibleLineCount / bitmapScale * lineHeight) * 0.5 + padding[0] - padding[2];
            else if (tempVAlign === "bottom")
                startY = this._height - visibleLineCount / bitmapScale * lineHeight - padding[2];
        }
        if (this['_clipPoint']) {
            graphics.save();
            if (tCurrBitmapFont && tCurrBitmapFont.autoScaleSize) {
                var tClipWidth;
                var tClipHeight;
                this._width ? tClipWidth = (this._width - padding[3] - padding[1]) : tClipWidth = this._textWidth;
                this._height ? tClipHeight = (this._height - padding[0] - padding[2]) : tClipHeight = this._textHeight;
                tClipWidth *= bitmapScale;
                tClipHeight *= bitmapScale;
                graphics.clipRect(padding[3], padding[0], tClipWidth, tClipHeight);
            }
            else {
                graphics.clipRect(padding[3], padding[0], this._width ? (this._width - padding[3] - padding[1]) : this._textWidth, this._height ? (this._height - padding[0] - padding[2]) : this._textHeight);
            }
            this.repaint();
        }
        var style = this._style;
        var password = style.asPassword;
        if (("prompt" in this) && this['prompt'] == this._text)
            password = false;
        var x = 0, y = 0;
        var end = Math.min(this._lines.length, visibleLineCount + beginLine) || 1;
        for (var i = beginLine; i < end; i++) {
            var word = lines[i];
            var _word;
            if (password) {
                let len = word.length;
                word = "";
                for (var j = len; j > 0; j--) {
                    word += "●";
                }
            }
            if (word == null)
                word = "";
            x = startX - (this['_clipPoint'] ? this['_clipPoint'].x : 0);

            // CoderM: 这里+2会造成低分辨率下的文字向下偏移,不知道为什么这么做,先给它屏蔽掉,
            // y = startY + 2 + lineHeight * i - (this['_clipPoint'] ? this['_clipPoint'].y : 0);
            // 这里应该是每行渲染,防止单行的文字下沉,判断只有第一行的位置不往下
            y = startY + (i > 0 ? 2 : 0) + lineHeight * i - (this['_clipPoint'] ? this['_clipPoint'].y : 0);
            this.underline && this['_drawUnderline'](textAlgin, x, y, i);
            if (tCurrBitmapFont) {
                var tWidth = this.width;
                if (tCurrBitmapFont.autoScaleSize) {
                    tWidth = this.width * bitmapScale;
                    x *= bitmapScale;
                    y *= bitmapScale;
                }
                tCurrBitmapFont._drawText(word, this, x, y, this.align, tWidth);
            }
            else {
                this._words || (this._words = []);
                if (this._words.length > (i - beginLine)) {
                    _word = this._words[i - beginLine];
                }
                else {
                    _word = new Laya.WordText();
                    this._words.push(_word);
                }
                _word.setText(word);
                _word.splitRender = this['_singleCharRender'];
                if(style.strokeColor && !this['hasShadow']){
                    graphics.fillBorderText(_word, x, y, ctxFont, this.color, textAlgin, style.stroke, style.strokeColor)
                }else{
                    if(this['hasShadow']){
                        graphics.fillText(_word+" ", x+(this['shadowX'] || 0), y+(this['shadowY'] || 0), ctxFont, this['shadowColor'], textAlgin);
                    }
                    graphics.fillText(_word, x, y, ctxFont, this.color, textAlgin);
                }
            }
        }
        if (tCurrBitmapFont && tCurrBitmapFont.autoScaleSize) {
            var tScale = 1 / bitmapScale;
            this.scale(tScale, tScale);
        }
        if (this['_clipPoint'])
            graphics.restore();
        this._startX = startX;
        this._startY = startY;
    }
}