[Day18] WeSplit (1)

(1) Creating a form and Adding a navigation bar

import SwiftUI

struct ContentView: View {
    //Views are a function of their state
    var body: some View {
        NavigationStack {
        // 사용자가 현재 계층을 파악할 수 있도록 하는 기능 
        // 제목, 버튼 등의 요소가 있음 
        
            Form {
            // 텍스트나 이미지 같은 static controls의 스크롤 목록
            // 텍스트 필드, 토글 스위치, 버튼 등의 user interactive controls 포함 가능
           
                Section {
                // text와 같은 형식을 시각적인 덩어리로 분리할 때
                
                    Text("Hello, world!")
                }
                
                 Section {
                    Text("Hello, world!")
                }
            }
            .navigationTitle("SwiftUI")
            .navigationBarTitleDisplayMode(.inline)
        }
        .padding()
    }
}

#Preview {
    ContentView()
}

 

 

 

(2) Modifying Program state

import SwiftUI

struct ContentView: View {
    @State private var tapCount = 0
    // @State -> property Wrapper
    // simple properties that are stored in one view
    
    var body: some View {
        Button("Tap Count: \(tapCount)") {
            self.tapCount += 1
        }
    }
}

#Preview {
    ContentView()
}

 

 

(3) Binding state to user interface controls

import SwiftUI

struct ContentView: View {
    @State private var name = ""
    // @State -> property Wrapper
    // simple properties that are stored in one view
    
    var body: some View {
        Form {
             TextField("Enter your name", text: $name)
            // $ : two-way binding(read and written)
            
            Text("Your name is \(name)")
            // read만 가능
        }
    }
}

#Preview {
    ContentView()
}

 

 

(4) Creating views in a loop

import SwiftUI

struct ContentView: View {
    let students = ["Soy", "Harry", "Hermione", "Ron"]
    @State private var selectedStudent = "Harry"
    
    var body: some View {
        NavigationStack {
            Form {
                Picker("Select your student", selection: $selectedStudent) {
                    ForEach(students, id: \.self) {
                        // \.self : array 안 문자열이 고유하다(unique)는 의미
                        Text($0)
                        // $0 : Foreach 안에서 현재 반복중인 항목을 나타냄
                    }
                }
            }
        }
    }
}

#Preview {
    ContentView()
}