非等宽字体（non-monospaced）下，如何获取与目标字符串宽度一致的空格数？

前端（浏览器环境） #

不需要额外依赖，直接用浏览器原生的Canvas API就能搞定，核心是通过文本宽度测量来换算空格数量：

function getEquivalentSpaces(targetText, font) {
  const canvas = document.createElement('canvas');
  const ctx = canvas.getContext('2d');
  ctx.font = font; // 格式示例：'16px Arial'
  const targetWidth = ctx.measureText(targetText).width;
  const singleSpaceWidth = ctx.measureText(' ').width;
  return Math.round(targetWidth / singleSpaceWidth);
}

调用时传入目标字符串和完整的字体声明（包含字号、字体名），就能得到需要的空格数。

Python #

用Pillow库可以轻松实现字体宽度测量，需要先安装pillow包：

from PIL import ImageFont

def get_equivalent_spaces(target_text, font_path, font_size):
    # 加载指定字体，font_path可以是系统字体路径或自定义字体文件路径
    font = ImageFont.truetype(font_path, font_size)
    target_width = font.getlength(target_text)
    single_space_width = font.getlength(' ')
    return round(target_width / single_space_width)

比如Windows系统中Arial字体的路径可能是C:/Windows/Fonts/arial.ttf，Mac则是/Library/Fonts/Arial.ttf。

Java #

借助AWT的FontMetrics类来测量文本宽度，无需额外依赖：

import java.awt.Font;
import java.awt.FontMetrics;
import java.awt.Graphics2D;
import java.awt.image.BufferedImage;

public class SpaceWidthCalculator {
    public static int getEquivalentSpaces(String targetText, String fontName, int fontSize) {
        Font font = new Font(fontName, Font.PLAIN, fontSize);
        BufferedImage tempImg = new BufferedImage(1, 1, BufferedImage.TYPE_INT_ARGB);
        Graphics2D g2d = tempImg.createGraphics();
        FontMetrics metrics = g2d.getFontMetrics(font);
        
        int targetWidth = metrics.stringWidth(targetText);
        int singleSpaceWidth = metrics.stringWidth(" ");
        
        g2d.dispose();
        return Math.round((float) targetWidth / singleSpaceWidth);
    }
}

注意字体名要和系统已安装的字体一致，比如"Arial"、"微软雅黑"等。

通用思路 #

所有方案的核心逻辑都是：先测目标字符串的总宽度，再测单个空格的宽度，最后用总宽度除以单个空格宽度得到空格数。这种方法比逐个字符计算等效宽度高效得多，而且能适配任意非等宽字体。

如果对精度要求极高，可以根据实际渲染效果选择用ceil()（向上取整）或floor()（向下取整）代替round()，避免微小的宽度偏差。

内容的提问来源于stack exchange，提问作者lautaro ialea