SwiftUI - @State & Binding을 이용한 카운터

김시온·2021년 5월 9일
0

Swift

목록 보기
6/8

import SwiftUI

struct ContentView: View {
    
    @State private var counter1 = 1
    @State private var counter2 = 1
    @State private var counter3 = 1
    
    var body: some View {
        VStack {
            
            Text("\(counter1+counter2+counter3)")
                .font(.system(size: 220, weight: .black, design: .rounded))
                .padding()
            
            HStack {
                CounterButton(counter: $counter1, color: .blue)
                CounterButton(counter: $counter2, color: .green)
                CounterButton(counter: $counter3, color: .red)
            }
            .padding()
        }
    }
}

struct CounterButton: View {
    
    @Binding var counter: Int
    var color: Color
    
    var body: some View {
        
        Button(action: {
            counter += 1
        }) {
            Circle()
                .frame(width: 120, height: 120)
                .foregroundColor(color)
                .overlay(
                    Text("\(counter)")
                        .font(.system(size: 100, weight: .black ,design: .rounded))
                        .foregroundColor(.white)
                )
                
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

@Binding: ContentView와 SubView 간의 상호작용을 가능하게 해줌

0개의 댓글