본문 바로가기

프로젝트/ReminderApp clone

03. AddNewListView 수정 및 호출

 

//
//  ContentView.swift
//  ReminderApp
//

import SwiftUI

struct HomeView: View {
    
    @State private var isPresented: Bool = false

    var body: some View {
        NavigationStack {
            VStack {
                Text("Hello World")
                
                Button {
                    isPresented = true
                } label: {
                    Text("Add List")
                        .frame(maxWidth: .infinity, alignment: .trailing)
                        .font(.headline)
                }
                .padding()
            }
            .sheet(isPresented: $isPresented, content: {
                NavigationStack {
                    AddNewListView { name, color in
                        // TODO: save the list to the DB
                    }
                }
            })
        }
        .padding()
    }
}

이전에 작성한 AddNewListView를 호출하기 위해 HomeView를 작성한다.
해당 View는 이전의 ContentView를 대체해 메인 화면의 역할을 하게 된다.

//
//  AddNewListView.swift
//  ReminderApp
//

import SwiftUI

struct AddNewListView: View {
    
    @Environment(\.dismiss) private var dismiss
    @State private var name: String = ""
    @State private var selectedColor: Color = .yellow
    
    let onSave: (String, UIColor) -> Void
    
    private var isFormValid: Bool {
        !name.isEmpty
    }
    
    var body: some View {
        VStack {
            VStack {
                Image(systemName: "line.3.horizontal.circle.fill")
                    .foregroundColor(selectedColor)
                    .font(.system(size: 100))
                
                TextField("List Name", text: $name)
                    .multilineTextAlignment(.center)
                    .textFieldStyle(.roundedBorder)
            }
            .padding(30)
            .clipShape(RoundedRectangle(cornerRadius: 10.0, style: .continuous))
            
            ColorPickerView(selectedColor: $selectedColor)
        }
        .frame(maxWidth: .infinity, maxHeight: .infinity, alignment: .top)
        .toolbar {
            ToolbarItem(placement: .principal) {
                Text("New List")
                    .font(.headline)
            }
            
            ToolbarItem(placement: .topBarLeading) {
                Button("Close") {
                    dismiss()
                }
            }
            
            ToolbarItem(placement: .topBarTrailing) {
                Button("Done") {
                    
                    // TODO: save function
                    onSave(name, UIColor(selectedColor))
                    
                    dismiss()
                }
                .disabled(!isFormValid)
            }
        }

    }
}

AddNewListView는 이전에 이전에 누락됐던 selectedColor를 반영하도록 수정했다.