Method renderCharacter

packages/fairygui/src/text/DynamicFont.ts:277–328

* Render a character to the atlas * 将字符渲染到图集

(charCode: number)

     * 将字符渲染到图集
     */
    private renderCharacter(charCode: number): boolean {
        const ctx = this._ctx;
        const char = String.fromCharCode(charCode);

        // Measure character
        ctx.font = `${this._fontSize}px "${this._fontFamily}"`;
        const metrics = ctx.measureText(char);
        const charWidth = Math.ceil(metrics.width);
        const charHeight = Math.ceil(this._lineHeight);

        // Check if we need a new row
        if (this._cursorX + charWidth + this._padding * 2 > this._atlasWidth) {
            this._cursorX = 0;
            this._cursorY += this._rowHeight + this._padding;
            this._rowHeight = 0;
        }

        // Check if we're out of space
        if (this._cursorY + charHeight + this._padding * 2 > this._atlasHeight) {
            console.warn(`[DynamicFont] Atlas full, cannot add character: ${char}`);
            return false;
        }

        const x = this._cursorX + this._padding;
        const y = this._cursorY + this._padding;

        // Render character
        ctx.fillStyle = 'white';
        ctx.fillText(char, x, y);

        // Create glyph info
        const glyph: IDynamicGlyph = {
            charCode,
            x,
            y,
            width: charWidth,
            height: charHeight,
            advance: charWidth,
            baseline: this._ascent
        };

        this._glyphs.set(charCode, glyph);

        // Update cursor
        this._cursorX += charWidth + this._padding * 2;
        this._rowHeight = Math.max(this._rowHeight, charHeight);

        // Mark dirty region
        this.markDirty(x, y, charWidth, charHeight);

        return true;
    }

    /**
     * Mark a region as dirty