字号自适应 plugin-text-auto
约 585 字大约 2 分钟
...
2026-09-28
插件说明
文本字号自适应插件:给 text 元素增加 autoSizeMin 选项(下拉「不适应 / 最小 Xpt」),在固定盒子内自动缩小字号直到内容不溢出。实现方式为克隆元素测量 + 二分查找 + 精确试探。无第三方依赖。
安装:
npm install @sv-print/plugin-text-auto示例代码
import pluginTextAuto from '@sv-print/plugin-text-auto';
await hiprint.register({
// 需 await 注册;init 不收插件数组
plugins: [
pluginTextAuto({
sizeList: [12, 5, 4, 3, 2, 1], // 适应最小字体选项(下拉"最小Xpt")
maxIterations: 15, // 适应次数(二分最大次数)
enablePrecision: true, // 启用精确适应
precision: 0.5, // 适应精确 step
precisionCount: 10, // 适应精确次数
lineHeightMode: 'auto', // 行高模式 auto | original | normal | unset
overrideHidden: false, // 超出是否隐藏
extendsCss: {
// 扩展 css
'word-wrap': 'break-word', // 单词换行
},
}),
],
});高级用法
config 参数(TextAutoOptions)
| 参数 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| sizeList | number[] | [] | 下拉可选的「最小 Xpt」字号列表 |
| maxIterations | number | 15 | 二分查找最大次数 |
| enablePrecision | boolean | true | 是否启用精确适应 |
| precision | number | 0.5 | 精确适应步长 |
| precisionCount | number | 10 | 精确适应最大次数 |
| lineHeightMode | 'auto' | 'original' | 'normal' | 'unset' | 'auto' | 行高模式;auto 跟随字号、original 用元素行高选项、normal / unset 对应同名 CSS 值 |
| overrideHidden | boolean | false | 超出时是否加 overflow: hidden 隐藏 |
| overFontSize | boolean | true | 是否允许适应结果大于当前字号 |
| extendsCss | object | {} | 适应时附加的扩展 CSS,如 word-wrap: break-word |
注意事项
- 选中 text 元素后,在属性面板通过
autoSizeMin下拉选择「不适应 / 最小 Xpt」 - 适应在打印渲染时按当前盒子尺寸计算,字号过小会影响可读性,建议结合
sizeList控制最小字号
版权所有
版权归属:sv-print
