Skip to content

文字设置特定行高后,获取文字尺寸出现bug #853

@bgyh2003

Description

@bgyh2003

百分比行高:

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
 */


行高设置的越小,文字尺寸反而越大

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions