0

I am building a fitness app where user selects one of the programs from the list and when he clicks on selected program a new view appears with video playing (video has it's countdown timer on it).

I built the screen using NavigationView/NavigationLink each having it's "destination view" with it's own params.

let sets: [TrainingSet]

init() {
    self.sets = [set1,set2,set3]
}

var body: some View {
    NavigationView {
        VStack {
            ForEach(self.sets) { set in
                NavigationLink(destination: ExerciseVideoView(items: set.items).navigationBarBackButtonHidden(true)) {
                    VStack {
                        Image("group-\(set.image)")
                            .resizable()
                            .renderingMode(.original)
                            .frame(height: 200, alignment: .leading)
                            .overlay(
                                Text(set.purpose)
                                    .font(.largeTitle)
                                    .fontWeight(.semibold)
                                    .foregroundColor(.white)
                        )
                        Color.blue
                            .frame(maxWidth: .infinity)
                            .overlay(
                                Text(set.purpose)
                                    .foregroundColor(.white)
                        )
                    }
                }
            }
        }
    }
}

1) I noticed that when the parent view is built, all destination views (ExerciseVideoView) get executed even before user clicks on corresponding button. My countdown timers start in background. I was supposed to see them launched when user click on NavigationLink and new view is "executed". Is that correct behaviour? Can I make destination view "executed/started" when they are shown?

2) The second problem is I wanna show the images with blue buttons below each of them (I put them both inside a VStack container). But when I launch my app only the images are shown but "Color.blue" rectangles are not visible. Why is that? How to make them visible as well?

eugene_prg
  • 948
  • 2
  • 12
  • 25

0 Answers0