How to reload view in SwiftUI (after specific interval of time)

This tutorial will guide you on reloading a view in SwiftUI after a specific time interval.

I will be using DispatchQueue to delay reloading the view for 1 min. And after 1 min it will change the view automatically.

You can use the same view but here to reflect the changes I will use two different views. And I’ll switch from view1 to view2 after 1 min using the dispatch queue.

Reload view in SwiftUI (after a specific interval of time)

What this blog will cover:

1. How to switch two views
2. How to change the view after a specific interval

Syntax:

DispatchQueue.main.asyncAfter(deadline: .now() + 60) {

//your code goes here 

            }

• Deadline: here I’ll mention the delaying time in seconds.

Now let’s say I have two views:

View1:

struct View1 : View {
    var body: some View {
        VStack{
            Rectangle().fill().padding(20).foregroundColor(.mint)
            Text("View 1").bold()
        }
    }
}

It’s a simple view with a vStack that contains a rectangle and text only.

• Vstack allows us to stack views from top to bottom.
• Rectangle is just another UIView of rectangle shape.

View2:

struct View2 : View {
     var body: some View {
        VStack{
            Rectangle().fill().padding(20).foregroundColor(.indigo)
            Text("View 2").bold()
            
        }
    }
}

Both of the views are similar I just changed the background color for reflecting the changes.

now here is the code for ContentView main view of the app, in this, I have given this condition that on the first loading of the screen show View1, at the same time I have called this function delayView and what this function does is calls the dispatchQueue which will change the view after 1 min to View2.

Code (Content View):

struct ContentView: View {
    @State var viewReloaded = false
    @State var title = "View will be changed after 1 min"
    var body: some View {
        VStack{
            Text("\(title)").padding(10).bold()
            if viewReloaded{
                View2()
            }
            else{
                View1()
            }
        }
        .onAppear(perform: delayView)
     }
    private func delayView() {
            // Delay of 60 seconds
        DispatchQueue.main.asyncAfter(deadline: .now() + 60) {
            viewReloaded.toggle()
            }
    }
    
}

• OnAppear: It’s a function that Performs an action when a view appears. so as soon as the ContentView appears on the screen onAppear calls the delayView function that will change the view after 1 min.
• Toggle: It’s a function that changes the state of a boolean variable. i.e: if It’s true it will change it to false and vice versa.

So here the viewReloaded boolean variable was false at the begining of the application so the app will show view1, else block of the if-else check will run first, then this delayView method that runs the dispatchqueue it will change the state of viewReloaded variable to true that will trigger the if block of if-else statement and in that View2 is being called. You can use the same view and reload the view after 1 min in the same way.

here is the complete code for your reference:

Complete code:

//
//  ContentView.swift
//  myfirstapp
//
//  Created by apple on 01/04/2023.
//
import SwiftUI
struct ContentView: View {
    @State var viewReloaded = false
    @State var title = "View will be changed after 1 min"
    var body: some View {
        VStack{
            Text("\(title)").padding(10).bold()
            if viewReloaded{
                View2()
            }
            else{
                View1()
            }
        }
        .onAppear(perform: delayView)
     }
    private func delayView() {
            // Delay of 60 seconds
        DispatchQueue.main.asyncAfter(deadline: .now() + 60) {
            viewReloaded.toggle()
            }
    }
    
}
struct View1 : View {
    var body: some View {
        VStack{
            Rectangle().fill().padding(20).foregroundColor(.mint)
            Text("View 1").bold()
        }
    }
}
struct View2 : View {
     var body: some View {
        VStack{
            Rectangle().fill().padding(20).foregroundColor(.indigo)
            Text("View 2").bold()
            
        }
    }
}
struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}