Observable 객체와 Environment 객체 듀토리얼

🏰 Observable

- 시간이 지남에 따라 반복적으로 변하는 데이터 값인 동적 데이터를 래핑하는 데 사용될 때 유용!!
- Foundation 프레임워크의 Timer 객체를 사용하여 데이터를 시뮬레이션

• Observable 객체 추가하기

//Swift File로 작성

import Foundation
import Combine

//observableObject프로토콜
class TimerData : ObservableObject {
    
    //@published 레퍼를 활용하여 프로젝트 내에 있는 뷰에서 관찰 될 수 있다 - 외부 접근 가능
    @Published var timeCount = 0
    
    //Timer 인스턴스
    var timer : Timer?
    
    init(){
        //매초마다 timerDidFire()를 호출
        timer = Timer.scheduledTimer(timeInterval: 1.0, target: self, selector: #selector(timerDidFire), userInfo: nil, repeats: true)
    }
    
    @objc func timerDidFire(){
        timeCount+=1
    }
  
    //타이머 초기화
    func resetCount(){
        timeCount = 0
    }
}

• ContentView 레이아웃 설계 (첫번째 화면)

import SwiftUI

struct ContentView: View {
    
    @ObservedObject var timerData: TimerData = TimerData()
    
    var body: some View {
        NavigationView{
            VStack{
                Text("Timer count = \(timerData.timeCount)")
                    .font(.largeTitle)
                    .fontWeight(.bold)
                    .padding()
                Button(action: timerData.resetCount){
                    Text("Reset Counter")
                }
                
                NavigationLink(
                    destination: SecondView(timerData : timerData),
                    label: {
                        /*@START_MENU_TOKEN@*/Text("Navigate")/*@END_MENU_TOKEN@*/
                    })
            }
        }
    }
}

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

• 두번째 화면

import SwiftUI

struct ContentView: View {
    
    @ObservedObject var timerData: TimerData = TimerData()
    
    var body: some View {
        NavigationView{
            VStack{
                Text("Timer count = \(timerData.timeCount)")
                    .font(.largeTitle)
                    .fontWeight(.bold)
                    .padding()
                Button(action: timerData.resetCount){
                    Text("Reset Counter")
                }
                
                NavigationLink(
                    destination: SecondView(timerData : timerData),
                    label: {
                        /*@START_MENU_TOKEN@*/Text("Navigate")/*@END_MENU_TOKEN@*/
                    })
            }
        }
    }
}

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

• 실행화면
  

• Observable 객체를 사용하면 뷰를 이동할 때 마다 객체를 전달해야한다

• 이를 해결하는 방법은 Environment 객체로 변환 하면 된다

• 그리고 Environment 객체는 SceneDelegate에 추가해주어야한다