ios SwiftUI如何设置下划线和文本之间的间距?

368yc8dk  于 2023-03-20  发布在  iOS
关注(0)|答案(4)|浏览(191)

设置下划线的代码,我想让文本和下划线之间的空间变大。

Text("underline text")
 .underline()
1qczuiv0

1qczuiv01#

下划线是一种字体功能,你可以在任何需要的地方画线来进行自定义

var body: some View {
    HStack {
        Text("Before")
        Text("underline text")
            .overlay(
                Rectangle().frame(height: 1).offset(y: 4)
                , alignment: .bottom)
        Text("after.")
    }
}
yv5phkfx

yv5phkfx2#

使用自定义视图代替.underline如何?

struct MyUnderline: View {
      let color: Color = .black
      let height: CGFloat = 1
      var body: some View {
          Rectangle()
            .fill(color)
            .frame(height: height)
      }
}
Text("underline text")
MyUnderline()
  .padding(.top, -10)
but5z9lq

but5z9lq3#

你可以简单地在文本和覆盖层之间添加填充。这样你就不需要纠结于行高和偏移量了。

Text("Hello World")
    .padding(.bottom, 10) // <- play with distance
    .overlay(
        RoundedRectangle(cornerRadius: 20, style: .continuous)
            .fill(Color.blue).frame(height: 4), // <- thickness of line
        alignment: .bottom
    )
y3bcpkx1

y3bcpkx14#

您可以创建一个将文本和下划线填充作为参数的自定义视图

struct UnderlinedText: View {

   var text: String
   var underlinePadding: CGFloat

   var body: some View {
       VStack (spacing: underlinePadding) {
           Text(text)
           GeometryReader { proxy in
               Rectangle()
                   .frame(width: proxy.size.width, height: 1)
           }
        }
    }
}

并按如下方式使用

UnderlinedText(text: "Hello underlined text", underlinePadding: 10.0)

相关问题