SwiftUI 시작하기2

작성일

이번 시간에 알아낸 것.
SwiftUI에서는 @State,Spacer() 란 키워드가 있다.

@State란?

  • 뷰 내부에서 특정 View 의 상태를 나타내는 변수
  • 뷰내부에서 밖에 사용이 불가능함 때문에 private로 선언
  • 하위 뷰나 다른 뷰에서 참조하기 위해선 @Binding 해야함

Spacer()

  • 포함하는 스택 레이아웃의 주요 축을 따라 확장되거나, 스택에 포함되지 않은 경우, 두 축 모두에서 확장되는 유연한 공간
  • 기본적으로 사용 가능한 전체 공간을 띄워버린다

    minLength

  • 사용법: Spacer(minLength: n)
  • Spacer가 가지는 여백의 최소 보장되는 크기

frame

  • 사용법: Spacer().frame(wieth: n)
  • 여백의 크기를 직접 지정해준다.

만든 앱 이미지 image

전체코드

import SwiftUI

struct ContentView: View {
    
    @State var leftDiceNumber = 1
    @State var rightDiceNumber = 1
    
    var body: some View {
        ZStack {
            Image("background")
                .resizable()
                .edgesIgnoringSafeArea(.all)
            VStack {
                Image("diceeLogo")
                Spacer()
                HStack {
                    DiceView(n: leftDiceNumber)
                    DiceView(n: rightDiceNumber)
                }
                .padding(.horizontal)
                Spacer()
                Button(action: {
                    self.leftDiceNumber = Int.random(in: 1...6)
                    self.rightDiceNumber = Int.random(in: 1...6)
                }) {
                    Text("Roll")
                        .font(.system(size: 50))
                        .fontWeight(.heavy)
                        .foregroundColor(.white)
                        .padding(.horizontal)
                }
                .background(.red)
                .padding(.bottom)
            }
        }
    }
}

struct DiceView: View {
    
    let n: Int
    
    var body: some View {
        Image("dice\(n)")
            .resizable()
            .aspectRatio(1, contentMode: .fit)
            .padding()
    }
}

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