How to make an App-lesson7: 스위프트 UI 스터디

https://www.youtube.com/watch?v=q3KRE-MyCO8&list=RDCMUC2D6eRvCeMtcF5OGHf1-trw&index=3 

스위프트 수업 day 7 입니다

공부좀 하다가 도무지 머리가 안돌아가서 코딩이나 했습니다

저번 수업에서 만들어낸 UI인데요 

이번 수업에선 button이 작동하도록 만들고, 실제 게임을 만들기전 작업을 했습니다(변수 선언등)

이번 수업에서 중요한것 

1. 작동하는 버튼 만들기

2. 변수선언과 function 정의

Button {
                    deal()
                } label: {
                    Image("button")
                }

라이브러리에서 버튼을 가져오거나, 코드를 치고 ()를 만들면 안에 action, label을 선택할 수 있습니다

 

둘중 한 변수를 더블클릭하면

이런식으로  code를 넣을 수 있습니다

버튼을 눌렀을 때 'Deal card'가 프린트 되게 하기 위해 print하는 function을  var body {} 밑에 선언해주었습니다

그후 action에 deal()을 넣어주고 label에는 Image("button")을 넣어줍니다

이제 이 버튼을 눌러줄때마다 console창에 프린트가 됩니다 참고로 콘솔창은 캔버스, 오른쪽에 사각형에 선이 하나있는 부분을 누르면 볼 수 있습니다

잘 작동하네요

 

그리고 카드를 게임이 끝날때마다 바꿔줘야하고, 점수또한 바껴야하기때문에 

다음과 같이 정의해줍니다 변수로요!

이제 넣어줘야 하는데요 점수를 text로 설정했기때문에 string만 들어갈 수 있습니다

근데 받는값이 int이기 때문에 string안에 넣어줘 형변환을 시켜줍니다

 

전체코드입니다

import SwiftUI

struct ContentView: View {
    //card store
    var playerCard = "card7"
    var CPUCard = "card13"
    
    var playerScore = 0
    var cpuScore = 0
    
    var body: some View {
        ZStack{
            Image("background-plain")
            //imagesize가 screen size 보다 클경우 ignoresafearea를 안해줘도 다 채운다
            VStack{
                Spacer()
                Image("logo")
                Spacer()

                HStack{
                    Spacer()
                    Image(playerCard)
                    Spacer()
                    Image(CPUCard)
                    Spacer()
                }
                Spacer()
                //더블클릭하면 코드를 넣을 수 있게 만들어짐
                Button {
                    deal()
                } label: {
                    Image("button")
                }

                Spacer()
                HStack{
                    Spacer()
                    VStack{
                        Text("Plyaer")
                            .font(.headline)
                            .padding(.bottom,10.0)
                        //int값을 string으로 바꿔준다
                        Text(String(playerScore)).font(.largeTitle)
                        
                    }
                    Spacer()
                    VStack{
                        Text("CPU")              .font(.headline)
                            .padding(.bottom,10.0)


                        Text(String(cpuScore)).font(.largeTitle)
                        
                    }
                    Spacer()

                }
                .foregroundColor(.white)
                Spacer()
            }
        }
    }
    //print deal card하는 함수
    func deal(){
        print("Deal cards")
    }
}

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