SwiftUI/SwiftUI 사용

[SwiftUI] 커스텀 버튼 만들기

hyunjuntyler 2023. 5. 18. 21:39

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

아래와 같은 방법으로 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)
}
}