SwiftUI 文本意外的底部和顶部填充

问题描述

我需要精确控制 Text 占用的区域。我创建了最基本的程序，它显示了添加到文本中的意外顶部和底部间距。这个额外的填充来自哪里？如何摆脱它？

@main struct myApp：应用{

init() {    }

var body: some Scene {
    WindowGroup {
        Text("80")
            .font(.system(size: 30,weight: .bold,design: .default))
            .background(Color.red)
    }
}

}

解决方法

文本似乎具有默认填充，如此处所示

您可以通过将填充调整为负数来克服这一点

用这个替换你的代码

Text("80")
        .font(.system(size: 30,weight: .bold,design: .default))
        .padding(.vertical,-6)
        .background(Color.red)

如果你想让它动态，这里有一个解决方案

  struct TestView: View {
    var fontSize: CGFloat = 110
    var paddingSize: CGFloat {
        -(fontSize * 0.23)
    }
    var body: some View {
        Text("80")
            .font(.system(size: fontSize,design: .default))
            .padding(.vertical,paddingSize)
            .background(Color.red)
        Text("Hello")
    }
}

因此，即使使用图片中的 110 大字体，您也可以按照自己的喜好进行渲染

您需要根据自己的喜好调整乘数

,

事实证明，填充顶部和底部实际上根本不存在。在我的数字示例中，这看起来像是浪费空间，但实际上某些字符确实需要这个空间，如下图所示：

因为我只打算显示数字，所以我使用了@Sergio 的解决方案来纠正这个空间。