[SwiftUI] 버튼 스타일 (ButtonStyle) 만들어 쉽게 재사용하기

반응형

  앱 하나에 사용하는 버튼 스타일은 보통 규격화되어 있습니다. 따라서 버튼을 추가할 때마다 해당하는 스타일 값을 일일이 세팅하게되면 매우 수고스러운 일일 것입니다. UIKit을 사용하고 있다면 UIButton 클래스를 상속받아 커스텀 클래스를 활용하여 이 문제를 해결하였을 것입니다. SwiftUI에서는 ButtonStyle 프로토콜을 채용한 구조체를 만들어 쉽게 버튼 스타일을 재사용할 수 있습니다.

 

ButtonStyle을 적용하지 않은 Button

Button(action: viewModel.refresh) {
    Text(viewModel.refreshButtonTitle)
}
.frame(width: 230, height: 45)
.font(.system(size: 14))
.foregroundColor(Color(hex: 0x191919))
.background(Color(hex: 0x000000, alpha: 0.04))
.cornerRadius(6.0)

ButtonStyle 만들기

struct NormalButtonStyle: ButtonStyle {
    func makeBody(configuration: Self.Configuration) -> some View {
        configuration.label
            .frame(width: 230, height: 45)
            .font(.system(size: 14))
            .foregroundColor(Color(hex: 0x191919))
            .background(Color(hex: 0x000000, alpha: 0.04))
            .cornerRadius(6.0)
    }
}

ButtonStyle 활용하기

Button(action: viewModel.refresh) {
    Text(viewModel.refreshButtonTitle)
}.buttonStyle(NormalButtonStyle())

 

반응형

저작자표시

'Swift' 카테고리의 다른 글

[Swift] Metatype 이란? (.Type, .self, .Protocol) (번역)  (0)	2021.03.06
[Swift] defer의 동작 원리는 무엇일까? (번역)  (0)	2021.03.05
[SwiftUI] AutoLayout의 Center Y 처럼 비율 위치를 구현하는 방법  (1)	2020.03.22
[SwiftUI] Property wrappers for data flow  (0)	2020.03.10
[Swift] Computed Property 는 언제 쓰는지 알아보자  (0)	2019.12.15