1

I am trying to build a custom view modifier. My code is below.

import SwiftUI

struct Heading: ViewModifier {
    let color: Color
    let size: CGFloat
    let align: TextAlignment
    
    func body(content: Content) -> some View {
        content
            .font(Font.custom("HunterHeartFreeFont", size: size))
            .baselineOffset(-14)
            .foregroundColor(color)
            .multilineTextAlignment(align)
      }
}

extension View {
  func heading(
    color: Color = .white,
    size: CGFloat = 42,
    align: TextAlignment = .center
  ) -> some View {
      modifier(Heading(color: color, size: size, align: align))
  }
}

I'm getting the error Value of type 'some View' has no member 'baselineOffset'

I'm very new to Swift and SwiftUI so I don't know how to fix this, and haven't had luck finding an answer. I'm assuming that the baselineOffset modifier only works on Text views, and that this modifier should work with any view.

Is there a way to make this modifier only work on Text views? Or is there another way to solve this issue?

Ryan Clare
  • 43
  • 5

1 Answers1

1

The baselineOffset modifier is available only for Text, but content in ViewModifier is opaque generic view.

Instead you can just make direct extension for Text, like

extension Text {
  func heading(
    color: Color = .white,
    size: CGFloat = 42,
    align: TextAlignment = .center
  ) -> some View {
        self.font(Font.custom("HunterHeartFreeFont", size: size))
        .baselineOffset(-14)
        .foregroundColor(color)
        .multilineTextAlignment(align)
  }
}
Asperi
  • 228,894
  • 20
  • 464
  • 690
  • Thank you! How to I add pass in the values for the variables now though? I want to be able to do something like: ```Text("Testing").heading(color = .black, size = 48)``` – Ryan Clare Jan 26 '22 at 15:40
  • nevermind, i figure it out. It should be ```Text("Testing").heading(color: .black, size: 48) – Ryan Clare Jan 26 '22 at 15:44