import { Leafer, Text } from 'leafer-ui'
const leafer = new Leafer({ view: window })
const text1 = new Text({ text: 'Welcome to LeaferJS', lineHeight: { type: "percent", value: 1 } })
const text2 = new Text({ text: 'Welcome to LeaferJS', lineHeight: { type: "percent", value: 0.9 } })
leafer.add([text1, text2])
{
const { width, height } = text1.getBounds('content', 'inner')
console.log("行高:", text1.lineHeight.value, " 宽度:", parseInt(width), " 高度:", parseInt(height))
}
{
const { width, height } = text2.getBounds('content', 'inner')
console.log("行高:", text2.lineHeight.value, " 宽度:", parseInt(width), " 高度:", parseInt(height))
}
/*
行高: 1 宽度: 119 高度: 12
行高: 0.9 宽度: 131 高度: 22
*/
import { Leafer, Text } from 'leafer-ui'
const leafer = new Leafer({ view: window })
const text1 = new Text({ text: 'Welcome to LeaferJS', fontSize: 150, lineHeight: 150 })
const text2 = new Text({ text: 'Welcome to LeaferJS', fontSize: 150, lineHeight: 149 })
leafer.add([text1, text2])
{
const { width, height } = text1.getBounds('content', 'inner')
console.log("字号:", text1.fontSize, "行高:", text1.lineHeight, " 宽度:", parseInt(width), " 高度:", parseInt(height))
}
{
const { width, height } = text2.getBounds('content', 'inner')
console.log("字号:", text2.fontSize, "行高:", text2.lineHeight, " 宽度:", parseInt(width), " 高度:", parseInt(height))
}
/*
字号: 150 行高: 150 宽度: 1494 高度: 150
字号: 150 行高: 149 宽度: 1644 高度: 299
*/
百分比行高:
像素行高:
行高设置的越小,文字尺寸反而越大