How to create a tappable button

 

Hacking with Swift 사이트의 강좌 번역본입니다.

 

[원문 : https://www.hackingwithswift.com/quick-start/swiftui/how-to-create-a-tappable-button]

 

How to create a tappable button

[동영상 강좌 : https://youtu.be/-3pTfaE0bSg]

SwiftUI의 버튼은 UIButton과 보여지는 컨텐츠 측면에서 더 유연하고 기존의 타겟/액션 시스템보다 액션에 대한 클로져를 사용하는 것을 제외하면 비슷합니다.

 

버튼을 만들려면 다음과 같은 코드로 시작합니다.

Button(action: {
    // your action here
}) {
    Text("Button title")
}

예를들어, 버튼을 탭했을때 세부 텍스트를 보여주거나 숨길지 만들수 있습니다.

struct ContentView: View {
    @State private var showDetails = false

    var body: some View {
        VStack {
            Button(action: {
                self.showDetails.toggle()
            }) {
                Text("Show details")
            }

            if showDetails {
                Text("You should follow me on Twitter: @twostraws")
                    .font(.largeTitle)
            }
        }
    }
}

 

팁: 프레임워크를 배울때 고전적인 방법은 언제 발생하는지를 보기 위해 여러군데에서 print()를 호출하는 것입니다. 버튼을 동작해보는 경우에, print() 호출이 동작하도록 하기 위해서, 먼저 미리보기 캔버스의 play 버튼에서 오른쪽 클릭을 하고 Debug Preview를 골라야 합니다.

 

버튼 내부의 제목은 모든 뷰가 될 수 있으므로, 다음과 같이 이미지 버튼을 만들 수 있습니다.

Button(action: {
    self.showDetails.toggle()
}) {
    Image("example-image")
}