基于TTF文本列数调整TMPro字体大小,适配手机模拟老显示器
用TextMeshPro实现固定40列文本显示的方案
TMPro完全可以实现你要的老式显示器40列文本效果,下面是具体的实现思路和步骤:
核心逻辑
要精确实现40列显示,关键是基于屏幕可用宽度和等宽字体的字符宽度,反向计算出刚好适配的字号,具体步骤如下:
- 选对字体:必须使用等宽字体(老式显示器都是等宽字符),确保每个字符的显示宽度一致,避免列数错乱。
- 获取可用屏幕宽度:优先取手机屏幕的安全区宽度(
Screen.safeArea.width),避免刘海、底部栏占用显示空间;如果文本容器有左右内边距,还要减去内边距总和。 - 计算单字符宽度:从TMPro字体资产中获取字符的前进宽度(
glyphMetrics.advance),等宽字体所有字符的该值一致,可直接取任意字符(比如空格、'A')的数值。 - 反推目标字号:用可用宽度除以40得到单列的宽度,再结合字体的em尺寸比例,计算出刚好适配的字号,公式为:
目标字号 = (可用宽度 / 40) * (字体emSize / 字符前进宽度) - 批量应用字号:遍历所有TMP文本组件,统一设置计算好的字号,也可以通过TMPro样式表批量管控。
代码示例(Unity C#)
using UnityEngine; using TMPro; public class RetroDisplaySetup : MonoBehaviour { public TMP_FontAsset retroMonospaceFont; // 拖入你的等宽TMPro字体资产 public int targetColumns = 40; public float textHorizontalPadding = 0; // 文本容器的左右内边距总和 void Start() { CalculateAndApplyFontSize(); } // 屏幕尺寸变化时重新计算(比如横竖屏切换) void OnScreenSizeChanged() { CalculateAndApplyFontSize(); } void CalculateAndApplyFontSize() { // 获取安全区可用宽度 float availableWidth = Screen.safeArea.width - textHorizontalPadding; // 获取等宽字符的前进宽度 GlyphMetrics charMetrics = retroMonospaceFont.GetGlyphMetrics(' '); float singleCharWidth = charMetrics.advance; // 计算目标字号 float targetSize = (availableWidth / targetColumns) * (retroMonospaceFont.faceInfo.emSize / singleCharWidth); // 应用到所有TMP文本组件 foreach (var textComp in FindObjectsOfType<TMP_Text>()) { textComp.font = retroMonospaceFont; textComp.fontSize = targetSize; textComp.alignment = TextAlignmentOptions.TopLeft; } } }
注意事项
- 测试时要覆盖不同分辨率的手机,尤其是横竖屏切换场景,确保字号能动态调整。
- 如果用HTML标签控制字号,可将计算出的
targetSize插入到<size={targetSize}>标签中,但直接设置组件的fontSize属性更稳定统一。
内容的提问来源于stack exchange,提问作者Lame Brain
相关产品推荐
相关产品推荐

