[SwiftUI] @State, padding, frame

1.  @State

struct ContentView: View {
    
    @State var name: String = ""
    
    var body: some View {
        
        VStack {
            Text("Hi \(name)")
            
            Button{
                name = "Pado"
            }label: {
                Text("Click")
            }
            
        }
    }
}

클릭 전

클릭 후

• @State 변수가 바뀌면 화면을 다시 그린다.

 

 

2. padding

VStack {
    Image(systemName: "heart")
        .resizable()
        .aspectRatio(contentMode: .fit)
        .frame(width: 100)
        .padding([.bottom, .top], 100)
        .background(.yellow)
        .foregroundColor(.red)
    
    Image(systemName: "heart")
        .resizable()
        .aspectRatio(contentMode: .fit)
        .frame(width: 100)
        .padding(.leading, 100)
        .background(.yellow)
        .foregroundColor(.red)
}

• .padding : 위, 아래, 좌, 우 패딩 값을 줄 수 있다.

 

 

3. frame

Image(systemName: "heart")
    .resizable()
    .aspectRatio(contentMode: .fit)
    .frame(width: 300, height: 200, alignment: .trailing)
    .background(.green)

• .frame : 폭, 높이, 정렬을 설정할 수 있다.