[SwiftUI] Button - 커스텀 버튼 만들기 ButtonStyle, Custom Button

(예시 GIF 색상 변화가 크지 않습니다. 눌렀을 때 변화가 있습니다.)

 

 

 버튼이 눌리기 전/후 색상을 원하는 값으로 지정하는 커스텀 버튼입니다. UIKit은 class를 상속 받아서 만들었습니다. SwiftUI는

ButtonStyle을 사용해서 원하는 스타일을 낼 수 있습니다.

 

struct PrimaryButtonStyle: ButtonStyle {
    
    let normalColor: Color = .primary5
    let pressedColor: Color = .primary6
    
    func makeBody(configuration: Configuration) -> some View {
        configuration.label
            .font(.pretendard(type: .bold, size: 20))
            .frame(height: 54)
            .frame(maxWidth: .infinity)
            .background(configuration.isPressed ? self.pressedColor : self.normalColor)
            .cornerRadius(6)
            .padding(.leading, 24)
            .padding(.trailing, 24)
            .foregroundColor(.white)
            .animation(nil, value: configuration.isPressed)
    }
}

 

 위는 ButtonStyle의 코드입니다. 색상은 변수로 선언하고 옵션을 적용해준게 전부입니다. 크게 설명할 부분도 없는지라, 원하는 옵션에 맞게 style을 적용하시면 될 것 같습니다. 

 

Button("다음") {
    return
}
.buttonStyle(PrimaryButtonStyle())

 

 ButtonStyle 적용은 원하는 Button을 상대로 위 Style을 적용하면됩니다. 

---

 안녕하세요! 저는 단순한 코딩을 넘어, 서비스와 사용자 경험을 깊이 고민하며 발전하는 개발자가 되기 위해 끊임없이 노력하고 있습니다. 함께 재미있는 이야기 나누고 싶으시거나, 채용 소개 및 커피챗에 관심 있으신 분들은 언제든지 환영합니다.

 

 궁금한 점이 있거나 더 많은 이야기를 나눠보고 싶다면, wlxo0401@gmail.com으로 편하게 연락주세요! 감사합니다.