能否以当前字号为度量计算自定义几何形状参数？如何获取字体度量？

获取当前字体的度量信息 #

完全可行，不同UI框架下都有对应的API可以获取字号、行高这类字体度量信息，以下是主流场景的实现方式：

• Web前端（JavaScript）：通过getComputedStyle直接获取元素计算后的字号，示例：

  const textElement = document.getElementById('your-text-element');
  const fontSize = parseFloat(getComputedStyle(textElement).fontSize);
  const borderRadius = fontSize / 4; // 按需求计算圆角半径
  

  如果需要更精细的字体度量（如上移量、下移量），可以用CanvasRenderingContext2D的measureText方法：

  const canvas = document.createElement('canvas');
  const ctx = canvas.getContext('2d');
  ctx.font = getComputedStyle(textElement).font;
  const metrics = ctx.measureText('A'); // 用任意字符获取基准度量
  const totalFontHeight = metrics.actualBoundingBoxAscent + metrics.actualBoundingBoxDescent;
  

• WPF（C#）：直接读取TextBlock的FontSize属性，或用FormattedText获取更详细度量：

  var textBlock = new TextBlock { FontSize = 12, FontFamily = new FontFamily("Arial") };
  var fontSize = textBlock.FontSize;
  var borderRadius = fontSize / 4;
  
  // 获取精细字体度量
  var formattedText = new FormattedText("A", CultureInfo.CurrentCulture, 
      FlowDirection.LeftToRight, new Typeface(textBlock.FontFamily, textBlock.FontStyle, 
      textBlock.FontWeight, textBlock.FontStretch), textBlock.FontSize, Brushes.Black);
  var ascentHeight = formattedText.Ascent;
  

• Android（Kotlin）：通过TextView的textSize属性获取（单位为px），或用Paint类获取字体度量：

  val textView = findViewById<TextView>(R.id.your_text_view)
  val fontSizePx = textView.textSize
  val borderRadius = fontSizePx / 4
  
  // 获取精细字体度量
  val paint = Paint()
  paint.textSize = textView.textSize
  paint.typeface = textView.typeface
  val fontMetrics = paint.fontMetrics
  val totalFontHeight = fontMetrics.descent - fontMetrics.ascent
  

同步更新几何形状匹配字号变化 #

这也完全可行，核心是监听字体/字号的变化事件，触发形状参数的重新计算与渲染：

• Web前端：用MutationObserver监听元素样式变化，示例：

  const textElement = document.getElementById('your-text-element');
  const shapeElement = document.getElementById('your-custom-shape');
  
  const observer = new MutationObserver(() => {
      const fontSize = parseFloat(getComputedStyle(textElement).fontSize);
      shapeElement.style.borderRadius = `${fontSize / 4}px`;
      // 此处可添加其他形状参数的更新逻辑
  });
  
  observer.observe(textElement, { attributes: true, attributeFilter: ['style'] });
  

• WPF（C#）：监听TextBlock的FontSize或FontFamily属性变化，回调中更新形状：

  textBlock.FontSizeChanged += (sender, e) => {
      var newFontSize = textBlock.FontSize;
      yourCustomShape.CornerRadius = new CornerRadius(newFontSize / 4);
      yourCustomShape.InvalidateVisual(); // 触发形状重绘
  };
  

• Android（Kotlin）：通过布局变化监听或自定义属性监听来更新形状：

  textView.addOnLayoutChangeListener { _, _, _, _, _, _, _, _, _ ->
      val newFontSize = textView.textSize
      yourCustomShape.setCornerRadius(newFontSize / 4)
      yourCustomShape.invalidate() // 触发形状重绘
  }
  

内容的提问来源于stack exchange，提问作者Mark A. Donohoe