Category/iOS

SwiftUI - 현재 화면 닫기 @Environment(\.dismiss)

Corinee 2024. 9. 23. 22:06
728x90

@Environment(\.dismiss)는 SwiftUI에서 사용되는 환경 값(Environment Value)으로, 현재 화면을 닫는 기능을 제공합니다. 이 값은 모달 시트(Sheet)나 내비게이션 스택에서의 화면 전환 같은 상황에서 현재 뷰를 닫거나 뒤로 이동할 수 있게 해줍니다. 즉, 화면을 닫는 동작을 트리거할 수 있는 도구입니다.

1. 개념

  • @Environment(\.dismiss)는 현재 화면을 닫는 액션을 환경에서 가져오는 것입니다.
  • 이 dismiss 액션은 뷰를 내비게이션 스택에서 팝하거나, 모달로 표시된 시트(Sheet)를 닫는 동작을 할 때 주로 사용됩니다.
  • SwiftUI에서는 화면이 내비게이션 스택에 쌓이거나 모달로 표시될 때, 이를 닫을 수 있는 액션을 @Environment를 통해 제공합니다.

2. 기본 사용법

예시: 모달 시트를 닫는 경우

struct ContentView: View {
    @State private var showingSheet = false
    
    var body: some View {
        Button("Show Sheet") {
            showingSheet = true
        }
        .sheet(isPresented: $showingSheet) {
            SheetView()  // 모달 시트로 보여줄 뷰
        }
    }
}

struct SheetView: View {
    @Environment(\.dismiss) private var dismiss  // 환경에서 dismiss 액션 가져오기
    
    var body: some View {
        VStack {
            Text("This is a sheet.")
            
            Button("Dismiss") {
                dismiss()  // 화면을 닫음
            }
        }
        .padding()
    }
}

설명:

  • ContentView에서 버튼을 클릭하면 모달 시트가 표시됩니다.
  • SheetView 내부에서 @Environment(\.dismiss)를 사용해 dismiss 액션을 가져옵니다.
  • "Dismiss" 버튼을 클릭하면 dismiss()를 호출하여 현재 시트를 닫습니다.

3. NavigationStack에서 화면을 닫는 경우

@Environment(\.dismiss)는 모달 시트뿐만 아니라 내비게이션 스택에서의 화면 전환에서도 사용됩니다. 예를 들어, 내비게이션 스택에 쌓인 뷰에서 뒤로 가기 기능을 구현할 때 사용할 수 있습니다.

struct ContentView: View {
    var body: some View {
        NavigationStack {
            NavigationLink("Go to Detail View") {
                DetailView()
            }
            .navigationTitle("Home")
        }
    }
}

struct DetailView: View {
    @Environment(\.dismiss) private var dismiss  // 환경에서 dismiss 액션 가져오기
    
    var body: some View {
        VStack {
            Text("This is the detail view.")
            
            Button("Go Back") {
                dismiss()  // 화면을 닫고 이전 화면으로 돌아감
            }
        }
        .padding()
        .navigationTitle("Detail")
    }
}

설명:

  • NavigationStack에서 NavigationLink를 통해 DetailView로 이동합니다.
  • DetailView에서 dismiss()를 호출하면, 현재 화면을 닫고 이전 화면(Home 화면)으로 돌아갑니다.

4. 동작 원리

  • @Environment(\.dismiss)는 현재 뷰가 모달 시트로 표시된 상태내비게이션 스택의 일부일 때, 해당 뷰를 닫거나 뒤로 이동할 수 있게 해주는 환경 값입니다.
  • 이 값은 SwiftUI의 환경(Environment)에 의해 자동으로 제공되며, 모달이나 내비게이션 같은 상황에서 화면을 닫는 로직을 쉽게 구현할 수 있게 해줍니다.

5. 사용 시 주의 사항

  • 모달 시트(Sheet), 알림(Alert), 액션 시트(Action Sheet) 같은 SwiftUI의 임시 화면을 닫거나, 내비게이션 스택의 뷰를 뒤로 이동하는 데 사용됩니다.
  • dismiss()는 동기적으로 작동하며, 호출 즉시 해당 뷰를 닫거나 이전 화면으로 돌아갑니다.

6. 요약

  • @Environment(\.dismiss)는 현재 화면을 닫는 기능을 제공하는 SwiftUI의 환경 값입니다.
  • 모달 시트내비게이션 스택에서 사용하여 현재 화면을 닫거나 뒤로 이동할 때 사용됩니다.
  • SwiftUI에서 화면 전환을 간편하게 관리할 수 있도록 해주는 도구이며, 버튼 클릭과 같은 동작을 통해 쉽게 호출할 수 있습니다.

이를 통해, SwiftUI에서 화면을 닫는 동작을 쉽게 구현할 수 있고, UI 흐름을 자연스럽게 제어할 수 있습니다.

728x90