How SwiftUI sets the spacing between the underline and the text?

Viewed 1681

Code to set underline,I want to make the space between the text and the underline larger.

 Text("underline text")
 .underline()
3 Answers

Underline is a font feature, you can do custom under just by drawing line anywhere needed

demo

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

How about use a custom view instead of .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)

You could create a custom view that takes the text and underline padding as parameters

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)
           }
        }
    }
}

And use it as follows

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