说明:几乎整个内容都是抄的,理解一下就好,原文参考处有链接。
先来理解一下这张图(字体)
image.png- The ascent is the distance from the baseline to the top of the text (as defined by the font, not any particular glyph)---绿色部分
- The decent is the distance from the baseline to the bottom of the text (as defined by the font, not any particular glyph)---粉色部分
- The leading (pronounced "ledding", as in the the lead metal that the old typesetters used to use between lines of type) is the distance between the bottom of one line and the top of the next(也就是说上下两行之间的间距). In the strut, half of the leading is put on top and half one bottom(在strut中,leading被拆成了两部分,上下个一半). The is the gray area in the illustration.
解释
- The colored rectangle on the left is the strut (although in actuality a strut has no width).
- The height of that rectangle is the minimum line height. The line can't be any shorter than that. But it can be taller.(也就是说高度没办法调整的再小了?)
如何控制这个高度呢?
You can change the vertical size of the strut by using a multiplier.
- In the StrutStyle class, the height parameter is the multiplier for the ascent and the descent(绿色和粉色的部分). In the illustration the height is approximately 1.7, making the green ascent and the pink descent proportionally larger than in the original image.
- The leading height multiplier can be controlled separately. You use the leading parameter to set it. I used the same multiplier as for the ascent and descent, though. The baseline stays the same.
const Text(
'My text', // use 'My text \nMy text' to see multiple lines
style: TextStyle(
fontSize: 10,
fontFamily: 'Roboto',
),
strutStyle: StrutStyle(
fontFamily: 'Roboto',
fontSize: 14,
height: 1.7,
leading: 1.7,
),
),
image.png
网友评论