How to add .fullScreenCover() to a button by condition in SwiftUI?

Question

I created a simple collection with navigation from the last page to the next screen. How to correctly write transition condition if I need to apply the .fullScreenCover modifier to the button on the last page array index? How do I correctly place the background image on the first collection screen so that it is not on the following screens, by convention, if the index is the first?

import SwiftUI

struct IntroView: View {
    
    @ObservedObject var viewModel = IntroViewModel()
    @State private var tabSelection = 0
    @State private var isLastPage = false
    
    var body: some View {
        ZStack {
            TabView(selection: $tabSelection) {
                
                ForEach(0..<viewModel.pages.endIndex) { index in
                    
                    VStack {
                        Image("icnDE")
                            .padding(.bottom, 20)
                            .padding(.top, 50)
                            .frame(alignment: /*@START_MENU_TOKEN@*/.center/*@END_MENU_TOKEN@*/)
                        
                        Text(viewModel.pages[index].name)
                            .font(Font.custom("TeXGyreAdventor-Bold", size: 32))
                            .foregroundColor(.white)
                            .multilineTextAlignment(.center)
                            .padding(.horizontal,30)
                        
                        Button(action: {
                            self.tabSelection += 1
                            self.isLastPage = false
                        }) {
                            Text(viewModel.pages[index].buttonName)
                                .font(Font.custom("TeXGyreAdventor-Bold", size: 18))
                                .frame(width: 335, height: 56, alignment: /*@START_MENU_TOKEN@*/.center/*@END_MENU_TOKEN@*/)
                                .foregroundColor(Color.white)
                                .background(Color.blue)
                                .cornerRadius(12)
                                .padding(.top, 50)
                        }
                        
                        if tabSelection == viewModel.pages.count - 1, isLastPage == true {
                            Button(action: {
                                self.tabSelection += 1
                                self.isLastPage = false
                            }) {
                                Text(viewModel.pages[index].buttonName)
                                    .font(Font.custom("TeXGyreAdventor-Bold", size: 18))
                                    .frame(width: 335, height: 56, alignment: /*@START_MENU_TOKEN@*/.center/*@END_MENU_TOKEN@*/)
                                    .foregroundColor(Color.white)
                                    .background(Color.blue)
                                    .cornerRadius(12)
                                    .padding(.top, 50)
                            }.fullScreenCover(isPresented: $isLastPage, content: {
                                LoginView()})
                        }
                    }
                }
            }
            .tabViewStyle(PageTabViewStyle())
            .indexViewStyle(PageIndexViewStyle(backgroundDisplayMode: .always))
            .tabViewStyle(PageTabViewStyle.init(indexDisplayMode: .never))
            .edgesIgnoringSafeArea(.all)
        }
        .background(
            Image("imgHappypeople")
                .resizable()
                .edgesIgnoringSafeArea(.all)
                .frame(width: UIScreen.main.bounds.width, height: UIScreen.main.bounds.height))
    }
}


struct Intro_Previews: PreviewProvider {
    static var previews: some View {
        IntroView()
            .previewDevice("iPhone 11")
    }
}

Answer 1

For open full screen cover, Add .fullScreenCover at the top of the ZStack and no need to add a condition for two-button.

struct IntroView: View {
    
    @ObservedObject var viewModel = IntroViewModel()
    @State private var tabSelection = 0
    @State private var isLastPage = false
    
    var body: some View {
        ZStack {
            TabView(selection: $tabSelection) {
                
                ForEach(0..<viewModel.pages.endIndex) { index in
                    
                    VStack {
                        Image("icnDE")
                            .padding(.bottom, 20)
                            .padding(.top, 50)
                            .frame(alignment: /*@START_MENU_TOKEN@*/.center/*@END_MENU_TOKEN@*/)
                        
                        Text(viewModel.pages[index].name)
                            .font(Font.custom("TeXGyreAdventor-Bold", size: 32))
                            .foregroundColor(.white)
                            .multilineTextAlignment(.center)
                            .padding(.horizontal,30)
                        
                        Button(action: {
                           if self.tabSelection == viewModel.pages.count - 1 {
                                self.isLastPage = true
                            } else {
                                self.tabSelection += 1
                            } //<-- Use this condition
                            
                        }) {
                            Text("\(index)")
                                .font(Font.custom("TeXGyreAdventor-Bold", size: 18))
                                .frame(width: 335, height: 56, alignment: /*@START_MENU_TOKEN@*/.center/*@END_MENU_TOKEN@*/)
                                .foregroundColor(Color.white)
                                .background(Color.blue)
                                .cornerRadius(12)
                                .padding(.top, 50)
                        }
                    }
                }
            }
            .tabViewStyle(PageTabViewStyle())
            .indexViewStyle(PageIndexViewStyle(backgroundDisplayMode: .always))
            .tabViewStyle(PageTabViewStyle.init(indexDisplayMode: .never))
            .edgesIgnoringSafeArea(.all)
        }
        .fullScreenCover(isPresented: $isLastPage, content: {
                            Text("Details")}) //<== Use fullScreenCover here
        .background(
            Image("imgHappypeople")
                .resizable()
                .edgesIgnoringSafeArea(.all)
                .frame(width: UIScreen.main.bounds.width, height: UIScreen.main.bounds.height))
    }
}