Flutter Widget 之Baseline

在Flutter中一个部件垂直位置时候其顶部开始的位置和其高度的函数,其顶部开始的第一部分几乎和总是你想要的

image.png

但如果不是这样呢?

如果你在一个尺寸框内有一段文字,你需要将其底部对准一个已知的位置,怎么办?

因为在所有平台和设备上文字的大小很难预测的,所以要知道把文字的顶部放在哪里才能达到这个效果并不容易

image.png

但你知道把它的底部放在哪里这就是baseline的作用

用一个baseline来包裹的小部件,将它的baselineType设置为alphabetic,并为baseline值参数提供一个偏移

Baseline(
    baseline: 100,
    baselineType: TextBaseline.alphabetic,
    child: MyText(),
)

image.png

baseline值将告诉Flutter如何定位文本,这样它的底部将比其父体的顶部地许多像素

但是,如果小部件有100个像素高,但是baseline只设置为50,怎么办?

image.png

那个小部件就要和它的邻居们来个紧密接触了

如果想了解有关Baseline 的内容,或者关于Flutter的其他功能,请访问pu b.dev

原文翻译自视频:视频地址

© 版权声明
THE END
喜欢就支持一下吧
点赞9 分享
评论 抢沙发
头像
欢迎您留下宝贵的见解!
提交
头像

昵称

取消
昵称表情代码图片

    暂无评论内容