SwiftUI custom ButtonStyle example

CustomButtonStyle.swift

import SwiftUI

struct CapsuleButtonStyle: ButtonStyle {
  enum Appearance {
    case plain
    case outlined
  }
  
  let appearance: Appearance
  
  func makeBody(configuration: Configuration) -> some View {
    configuration.label
      .foregroundStyle(.primary)
      .fontWeight(.semibold)
      .padding()
      .background {
        switch appearance {
        case .plain:
          ContainerRelativeShape()
            .foregroundStyle(.secondary)
        case .outlined:
          ContainerRelativeShape()
            .stroke(.secondary, lineWidth: 2)
        }
      }
      .containerShape(Capsule())
  }
}

extension ButtonStyle where Self == CapsuleButtonStyle {
  static func capsule(appearance: CapsuleButtonStyle.Appearance = .plain) -> Self {
    return CapsuleButtonStyle(appearance: appearance)
  }
}

#Preview {
  VStack(spacing: 32) {
    Button(action: {}) {
      Text("Button Label")
    }
    .buttonStyle(.capsule())
    .foregroundStyle(.white, .red.gradient)
    
    Button(action: {}) {
      Label("Button Title", systemImage: "paperplane.fill")
    }
    .buttonStyle(.capsule(appearance: .outlined))
    .foregroundStyle(.tint)
  }
}