Z Index and Status Bar

p5150j · Jul 19, 2021 · 1896ae8 · 1896ae8
1 parent 3ad79d4
commit 1896ae8
Showing 1 changed file with 28 additions and 16 deletions.
diff --git a/DesignCode/CourseList.swift b/DesignCode/CourseList.swift
@@ -10,28 +10,38 @@ import SwiftUI
 struct CourseList: View {
 
     @State var courses = courseData
+    @State var active = false
 
     var body: some View {
-        ScrollView {
-            VStack (spacing: 30){
-                Text("Title")
-                    .font(.largeTitle).bold()
-                    .frame(maxWidth: .infinity, alignment: .leading)
-                    .padding(.leading, 30)
-                    .padding(.top, 30)
+        ZStack {
+            Color.black.opacity(active ? 0.5 : 0)
+                .animation(.linear)
+                .edgesIgnoringSafeArea(.all)
+            ScrollView {
+                VStack (spacing: 30){
+                    Text("Title")
+                        .font(.largeTitle).bold()
+                        .frame(maxWidth: .infinity, alignment: .leading)
+                        .padding(.leading, 30)
+                        .padding(.top, 30)
+                        .blur(radius: active ? 20 : 0)
 
-
-                ForEach(courses.indices, id: \.self) { index in
-                    GeometryReader { geometry in
-                        CourseView(show: self.$courses[index].show, course: self.courses[index])
-                            .offset(y: self.courses[index].show ? -geometry.frame(in: .global).minY : 0)
+
+                    ForEach(courses.indices, id: \.self) { index in
+                        GeometryReader { geometry in
+                            CourseView(show: self.$courses[index].show, active: self.$active, course: self.courses[index])
+                                .offset(y: self.courses[index].show ? -geometry.frame(in: .global).minY : 0)
+                        }
+                        .frame(height: 280)
+                        .frame(maxWidth: self.courses[index].show ? .infinity : screen.width - 60)
+                        .zIndex(self.courses[index].show ? 1 : 0)
                     }
-                    .frame(height: 280)
-                    .frame(maxWidth: self.courses[index].show ? .infinity : screen.width - 60)
                 }
+                .frame(width: screen.width)
+                .animation(.spring(response: 0.5, dampingFraction: 0.6, blendDuration: 0))
             }
-            .frame(width: screen.width)
-            .animation(.spring(response: 0.5, dampingFraction: 0.6, blendDuration: 0))
+            .statusBar(hidden: active ? true : false)
+            .animation(.linear)
         }
     }
 }
@@ -44,6 +54,7 @@ struct CourseList_Previews: PreviewProvider {
 
 struct CourseView: View {
     @Binding var show: Bool
+    @Binding var active: Bool
     var course: Course
 
     var body: some View {
@@ -111,6 +122,7 @@ struct CourseView: View {
 
             .onTapGesture {
                 self.show.toggle()
+                self.active.toggle()
             }
 
         }