[SwiftUI] 커스텀 버튼 만들기

보통 앱을 만들다 보면 버튼들이 많이 생긴다. 버튼을 만들고 여러 가지 세부설정들을 붙이지만 그 버튼이 많이 쓰일 경우 색이나 크기, 모서리값을 미리 설정해 놓으면 편하다. 어떻게 커스텀 버튼을 만드는지 간단하게 알아보자. 더 편하고 좋은 방법이 나오면 업데이트 예정이다.

아래와 같은 방법으로 CustomButton 이라는 구조체를 만든 후 label, disable, action 만 입력하면 자동적으로 아래와 같은 버튼을 간단하게 만들어 줄 수 있다.

import SwiftUI

struct ContentView: View {
    var body: some View {
        VStack {
            CustomButton(label: "Custom Button", disable: false) {
                // action
            }
        }
    }
}

이 CustomButton 은 이렇게 구현되어 있다. 아래와 같이 CustomButton 을 선언해 준 뒤 아래와 같이 받아올 입력값을 정해준다. 

struct CustomButton: View {
    
    var label: String
    var disable: Bool
    var action: () -> Void

그리고 아래에 세부 설정을 해주면 끝!

struct CustomButton: View {
    
    var label: String
    var disable: Bool
    var action: () -> Void
    
    var body: some View {
        Button(action: action) {
            Text(label)
                .foregroundColor(.white)
                .bold()
                .frame(width: 300, height: 60)
                .background(
                    RoundedRectangle(cornerRadius: 20, style: .continuous)
                        .fill(Color.orange)
                        .shadow(color: .gray, radius: 5,y: 5)
                )
        }
        .disabled(disable)
    }
}