I want to increase the spacing between the text and the underline. I tried using baselineOffset, but it increases the bottom spacing of the text rather than the spacing between the text and the underline.
This is my code:
View
HStack(alignment: .top, spacing: 0) {
Image(systemName: isAgreeConditionsAndTerms ? "checkmark.square.fill" : "square")
.font(.title2)
.foregroundColor(isAgreeConditionsAndTerms ? .wpink : .gray)
.padding(.trailing, 12)
.padding(.bottom, 12)
Text(getAttriText()).font(.system(size: 17))
}.onTapGesture {
isAgreeConditionsAndTerms.toggle()
}
AttributedString
private func getAttriText() -> AttributedString {
var attriString = AttributedString("I agree to the terms and conditions for posting a review".i18n)
attriString.foregroundColor = Color(Colors.Text.black)
if let privacyRange = attriString.range(of: "terms and conditions".i18n) {
attriString[privacyRange].link = URL(string: "termanconditions://")
attriString[privacyRange].underlineStyle = .single
attriString[privacyRange].baselineOffset = 10
}
return attriString
}
Result
Does anyone have a way to do this?
Thanks
you can make custom underline text component and then use it any where in the APP with spacing
struct UnderlinedText: View {
let text: String
let spacing: CGFloat
let lineColor: Color
let lineWidth: CGFloat
init(
_ text: String,
spacing: CGFloat = 4,
lineColor: Color = .blue,
lineWidth: CGFloat = 1
) {
self.text = text
self.spacing = spacing
self.lineColor = lineColor
self.lineWidth = lineWidth
}
var body: some View {
VStack(spacing: spacing) {
Text(text)
Rectangle()
.frame(height: lineWidth)
.foregroundColor(lineColor)
}
}
}
then use it in any view like this
HStack(alignment: .top) {
// Checkbox
Image(systemName: "square")
.foregroundColor(.gray)
// Agreement Text
Text("I agree to the")
// Underlined text with custom spacing
UnderlinedText("terms and conditions")
Text("for posting a review")
}