[开发者心得] 分享一下计算一串字符串的长度的方法

[复制链接]
621 |0
本帖最后由 羽逸之光(恶魔灵👿) 于 2023-5-9 18:31 编辑

const FontDefinition = {
    originSize: 24,
    "32": { char: "空格", width: 11, xoffset: 0 },
    "33": { char: "!", width: 8, xoffset: 0 },
    "34": { char: '"', width: 10.667, xoffset: 0 },
    "35": { char: "#", width: 18.667, xoffset: 0 },
    "36": { char: "$", width: 18.667, xoffset: 0 },
    "37": { char: "%", width: 24, xoffset: 0 },
    "38": { char: "&", width: 18.667, xoffset: 0 },
    "39": { char: "'", width: 8, xoffset: 0 },
    "40": { char: "(", width: 10.667, xoffset: 0 },
    "41": { char: ")", width: 10.667, xoffset: 0 },
    "42": { char: "*", width: 13.333, xoffset: 0 },
    "43": { char: "+", width: 18.667, xoffset: 0 },
    "44": { char: ",", width: 5.333, xoffset: 0 },
    "45": { char: "-", width: 13.333, xoffset: 0 },
    "46": { char: ".", width: 8, xoffset: 0 },
    "47": { char: "/", width: 13.333, xoffset: 0 },

    "48": { char: "0", width: 18.667, xoffset: 0 },
    "49": { char: "1", width: 18.667, xoffset: 0 },
    "50": { char: "2", width: 18.667, xoffset: 0 },
    "51": { char: "3", width: 18.667, xoffset: 0 },
    "52": { char: "4", width: 18.667, xoffset: 0 },
    "53": { char: "5", width: 18.667, xoffset: 0 },
    "54": { char: "6", width: 18.667, xoffset: 0 },
    "55": { char: "7", width: 18.667, xoffset: 0 },
    "56": { char: "8", width: 18.667, xoffset: 0 },
    "57": { char: "9", width: 18.667, xoffset: 0 },

    "65": { char: "A", width: 21.333, xoffset: 0 },
    "66": { char: "B", width: 21.333, xoffset: 0 },
    "67": { char: "C", width: 21.333, xoffset: 0 },
    "68": { char: "D", width: 21.333, xoffset: 0 },
    "69": { char: "E", width: 18.667, xoffset: 0 },
    "70": { char: "F", width: 18.667, xoffset: 0 },
    "71": { char: "G", width: 21.333, xoffset: 0 },
    "72": { char: "H", width: 21.333, xoffset: 0 },
    "73": { char: "I", width: 8, xoffset: 0 },
    "74": { char: "J", width: 18.667, xoffset: 0 },
    "75": { char: "K", width: 21.333, xoffset: 0 },
    "76": { char: "L", width: 18.667, xoffset: 0 },
    "77": { char: "M", width: 26.667, xoffset: 0 },
    "78": { char: "N", width: 21.333, xoffset: 0 },
    "79": { char: "O", width: 21.333, xoffset: 0 },
    "80": { char: "P", width: 21.333, xoffset: 0 },
    "81": { char: "Q", width: 21.333, xoffset: 0 },
    "82": { char: "R", width: 21.333, xoffset: 0 },
    "83": { char: "S", width: 18.667, xoffset: 0 },
    "84": { char: "T", width: 18.667, xoffset: 0 },
    "85": { char: "U", width: 21.333, xoffset: 0 },
    "86": { char: "V", width: 21.333, xoffset: 0 },
    "87": { char: "W", width: 26.667, xoffset: 0 },
    "88": { char: "X", width: 21.333, xoffset: 0 },
    "89": { char: "Y", width: 21.333, xoffset: 0 },
    "90": { char: "Z", width: 18.667, xoffset: 0 },
    "91": { char: "[", width: 8.667, xoffset: 0 },
    "92": { char: "\\", width: 13.333, xoffset: 0 },
    "93": { char: "]", width: 8.667, xoffset: 0 },
    "94": { char: "^", width: 13.333, xoffset: 0 },
    "95": { char: "_", width: 13.333, xoffset: 0 },
    "96": { char: "`", width: 10.667, xoffset: 0 },

    "97": { char: "a", width: 18.667, xoffset: 0 },
    "98": { char: "b", width: 18.667, xoffset: 0 },
    "99": { char: "c", width: 18.667, xoffset: 0 },
    "100": { char: "d", width: 18.667, xoffset: 0 },
    "101": { char: "e", width: 16, xoffset: 0 },
    "102": { char: "f", width: 10.667, xoffset: 1 },
    "103": { char: "g", width: 18.667, xoffset: 0 },
    "104": { char: "h", width: 18.667, xoffset: 0 },
    "105": { char: "i", width: 8, xoffset: 0 },
    "106": { char: "j", width: 8, xoffset: 0 },
    "107": { char: "k", width: 16, xoffset: 0 },
    "108": { char: "l", width: 8, xoffset: 0 },
    "109": { char: "m", width: 26.667, xoffset: 0 },
    "110": { char: "n", width: 18.667, xoffset: 0 },
    "111": { char: "o", width: 18.667, xoffset: 0 },
    "112": { char: "p", width: 18.667, xoffset: 0 },
    "113": { char: "q", width: 18.667, xoffset: 0 },
    "114": { char: "r", width: 10.667, xoffset: 0 },
    "115": { char: "s", width: 16, xoffset: 0 },
    "116": { char: "t", width: 10.667, xoffset: 0 },
    "117": { char: "u", width: 18.667, xoffset: 0 },
    "118": { char: "v", width: 16, xoffset: 0 },
    "119": { char: "w", width: 24, xoffset: 0 },
    "120": { char: "x", width: 16, xoffset: 0 },
    "121": { char: "y", width: 16, xoffset: 0 },
    "122": { char: "z", width: 16, xoffset: 0 },
    "123": { char: "{", width: 10.667, xoffset: 0 },
    "124": { char: "|", width: 8, xoffset: 0 },
    "125": { char: "}", width: 10.667, xoffset: 0 },
    "126": { char: "~", width: 21.333, xoffset: 0 },
};
export class Utils {

/**计算字符串的长度
     * @param str 字符串
     * @param fontSize 字体大小
     */
    public static caculateStringWidth(str: string, fontSize: number) {
        let length = 0;
        for (let i = 0; i < str.length; ++i) {
            let unicode = str.charCodeAt(i);
            if (unicode < 127) {
                if (FontDefinition[unicode] != undefined) {
                    length += Math.ceil(((FontDefinition[unicode].width + FontDefinition[unicode].xoffset) * fontSize) / FontDefinition.originSize);
                }
            } else {
                length += (32 * fontSize) / FontDefinition.originSize;
            }
        }
        return length;
    }

}

使用方法:使用Utils.caculateStringWidth()调用即可
image.png
回复

使用道具 举报

热门版块
快速回复 返回顶部 返回列表