Untitled
unknown
plain_text
2 months ago
36 kB
6
Indexable
// // SessionDetailsView.swift // Fitness // // Created by Phoenix@TNM#Mac on 30/09/24. // import Foundation import SwiftUI //import BottomSheet //struct SessionDetailsView: View2 struct SessionDetailsView_Previews: PreviewProvider { static var previews: some View { SessionDetailsView() } } import SwiftUI struct SessionDetailsView: View { @State private var showBottomSheet = false @State private var note: String = "It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution..." @State private var firstsession: [(String)] = [("5x"), ("5x"), ("5x")] @State private var firstsecond: [(String)] = [( "10s"), ("10s"), ( "10s")] @State private var secondsession: [(String)] = [("5x"), ("5x"), ("5x")] @State private var secondsecond: [(String)] = [( "10s"), ("10s"), ( "10s")] @Environment(\.presentationMode) var presentationMode var body: some View { VStack (spacing: 10){ VStack{ ScrollView(showsIndicators: false) { VStack(alignment: .leading, spacing: 15) { // Header Image with Text Overlay ZStack(alignment: .bottomLeading) { Image("session_expand") // Replace with your image name .resizable() .scaledToFill() //.frame(height: 250) .clipped() VStack(alignment: .leading, spacing: 8) { Text("Yoga Session") .font(.plusJakartaSans(size: 22 , weight: .bold)) .foregroundColor(Color.white) HStack{ Image("clock_session") Text("24 minutes") .font(.plusJakartaSans(size: 11 , weight: .bold)) .foregroundColor(Color.white) } Text("Strengthen your core and enhance flexibility with this low-impact workout.") .font(.plusJakartaSans(size: 11 , weight: .medium)) .lineLimit(2) .foregroundColor(Color.white) } .padding() HStack{ Spacer() VStack{ Image("more_img") .padding(.top,15) Spacer() } } .padding(.top,40) .padding(.horizontal,20) VStack{ Text("Today") .font(.plusJakartaSans(size: 18 , weight: .bold)) .foregroundColor(.white) .padding(.top,15) Spacer() } .padding(.top,40) .frame(maxWidth: .infinity, maxHeight: .infinity) // .background( // LinearGradient( // colors: [Color.black.opacity(0.6), Color.clear], // startPoint: .bottom, // endPoint: .top // ) // ) } .cornerRadius(5) // First session content HStack(alignment: .center) { VStack(alignment: .leading, spacing: 4) { Text("Arnold press") .foregroundColor(Color.green) .font(.plusJakartaSans(size: 18 , weight: .semibold)) Text("10 kcal") .font(.plusJakartaSans(size: 12, weight: .medium)) .foregroundColor(Color(hex: "#8F8F8F")) } Spacer() Image("arnold_Press") // Replace with actual image .resizable() .scaledToFit() .frame(width: 60, height: 60) } .padding(.horizontal,10) VStack(spacing: 20) { ScrollView(.horizontal, showsIndicators: false) { HStack(spacing: 20) { ForEach(firstsession.indices, id: \.self) { index in VStack { Text(firstsession[index]) .font(.plusJakartaSans(size: 18, weight: .semibold)) .foregroundColor(.black) // Text(firstsession[index].1) // .font(.plusJakartaSans(size: 12, weight: .medium)) // .foregroundColor(Color(hex: "8F8F8F")) } .padding() .background(Color(hex:"#E6EBED")) .frame(width: 64,height: 56) .cornerRadius(5) } // Plus Button Button(action: { firstsession.append("5x") firstsecond.append("10s") }) //plus image { Image(systemName: "plus") .font(.headline) .foregroundColor(.gray) .frame(width: 80,height: 20) .padding() .background(Color(hex:"#E6EBED")) .cornerRadius(5) } } // Second horizontal session HStack(spacing: 20) { ForEach(firstsecond.indices, id: \.self) { index in VStack { Text("10s") .foregroundColor(Color(hex: "#7A7A7A")) } .padding() .background(Color(hex:"#E6EBED")) .frame(width: 64,height: 30) .cornerRadius(5) } // Plus Button Button(action: {}) { Image(systemName: "") .font(.headline) .foregroundColor(.gray) .frame(maxWidth: .infinity, maxHeight: .infinity) .padding() .background(Color(hex:"#E6EBED")) .cornerRadius(5) .frame(height: 30) } } } } .padding(.horizontal,10) // Second session content (similar to first session) // Second session horizontal scroll HStack(alignment: .center) { VStack(alignment: .leading, spacing: 4) { Text("nick press") .foregroundColor(Color.green) .font(.plusJakartaSans(size: 18 , weight: .semibold)) Text("10 kcal") .font(.plusJakartaSans(size: 12, weight: .medium)) .foregroundColor(Color(hex: "8F8F8F")) } Spacer() Image("arnold_Press") // Replace with actual image .resizable() .scaledToFit() .frame(width: 60, height: 60) } .padding(.horizontal,10) VStack(spacing: 20) { ScrollView(.horizontal, showsIndicators: false) { HStack(spacing: 20) { ForEach(secondsession.indices, id: \.self) { index in VStack { Text(secondsession[index]) .font(.system(size: 16, weight: .bold)) .foregroundColor(.black) // Text(secondsession[index].1) // .font(.subheadline) // .foregroundColor(.gray) } .padding() .background(Color(hex:"#E6EBED")) .frame(width: 64,height: 56) .cornerRadius(5) } // Plus Button Button(action: { secondsession.append("5x") secondsecond.append("10s") }) { Image(systemName: "plus") .font(.headline) .foregroundColor(.gray) .frame(width: 80,height: 20) .padding() .background(Color(hex: "#E6EBED")) .cornerRadius(5) } } // Second horizontal second HStack(spacing: 20) { ForEach(secondsecond.indices, id: \.self) { index in VStack { Text("10s") .foregroundColor(Color(hex: "#7A7A7A")) } .padding() .background(Color(hex:"#E6EBED")) .frame(width:64,height: 30) .cornerRadius(5) } Button(action: {}) { Image(systemName: "") .font(.headline) .foregroundColor(.gray) .frame(maxWidth: .infinity, maxHeight: .infinity) .padding() .background(Color(hex:"#E6EBED")) .cornerRadius(8) .frame(height: 30) } } } } .padding(.horizontal,10) } } .overlay { VStack{ Spacer() HStack{ Spacer() Button(action: { showBottomSheet = true }) { Image("create_icon") .resizable() .scaledToFit() .frame(width: 66, height: 66) } // Spacer() } .padding(.trailing,10) //.padding(.leading,250) } } // } .edgesIgnoringSafeArea(.top) .sheet(isPresented: $showBottomSheet) { BottomSheetWithButtons() .presentationDetents([.fraction(0.5)]) } } // Add Workout Button } .navigationBarBackButtonHidden(true) // Hide the default back button .toolbar { ToolbarItem(placement: .navigationBarLeading) { Button(action: { // Dismiss the view manually presentationMode.wrappedValue.dismiss() }) { ZStack { Image("btnBackRound") .resizable() .scaledToFit() .frame(width: 40, height: 40) } } } } // .navigationBarBackButtonHidden(true) .navigationBarTitleDisplayMode(.inline) // .navigationTitle("Push-ups") // // .ignoresSafeArea(edges: .top) // Ensures it ignores the top safe area } } // Reusable component for exercise details struct ExerciseView: View { let exerciseName: String let kcal: String let repetitions: [String] let imageName: String var body: some View { VStack { VStack(alignment: .leading, spacing: 10) { HStack { VStack(alignment: .leading, spacing: 10) { Text(exerciseName) .font(Font.custom("PlusJakartaSans", size: 18).weight(.semibold)) .foregroundColor(Color(red: 0.13, green: 0.77, blue: 0.37)) Text(kcal) .font(Font.custom("PlusJakartaSans", size: 12).weight(.medium)) .foregroundColor(Color.gray) } Spacer() Image(imageName) .frame(width: 60, height: 60) .cornerRadius(30) .padding(.trailing,60) .padding(.top,10) .padding(.bottom,10) } .padding(.leading,60) } .padding(.horizontal, 20) }.background(.white) } } struct BottomSheetWithButtons: View { @State private var selectedScreen: Int = 0 var body: some View { VStack{ Rectangle() .foregroundColor(.clear) .frame(width: 60, height: 6) .background(.white) .cornerRadius(23) // Horizontal ScrollView with Buttons ScrollView(.horizontal, showsIndicators: false) { HStack(spacing: 10) { HStack { Button(action: { selectedScreen = 0 // Switch to Screen 1 }) { Text("Notes") .font(Font.custom("PlusJakartaSans", size: 21.46).weight(.bold)) .foregroundColor(Color(red: 0.15, green: 0.16, blue: 0.21)) } } .padding() .frame(maxWidth: .infinity,maxHeight: 30) .background(selectedScreen == 0 ? Color(red: 0.60, green: 0.89, blue: 0.71) : Color(red: 0.90, green: 0.92, blue: 0.93) ) .cornerRadius(16) HStack { Button(action: { selectedScreen = 1 // Switch to Screen 1 }) { Text("Voice notes") .font(Font.custom("PlusJakartaSans", size: 21.46).weight(.bold)) .foregroundColor(Color(red: 0.15, green: 0.16, blue: 0.21)) } } .padding() .frame(maxWidth: .infinity,maxHeight: 30) .background(selectedScreen == 1 ? Color(red: 0.60, green: 0.89, blue: 0.71) : Color(red: 0.90, green: 0.92, blue: 0.93) ) .cornerRadius(16) HStack { Button(action: { selectedScreen = 2 // Switch to Screen 3 }) { Text("Video notes") .font(Font.custom("PlusJakartaSans", size: 21.46).weight(.bold)) .foregroundColor(Color(red: 0.15, green: 0.16, blue: 0.21)) } } .padding() .frame(maxWidth: .infinity,maxHeight: 30) .background(selectedScreen == 2 ? Color(red: 0.60, green: 0.89, blue: 0.71) : Color(red: 0.90, green: 0.92, blue: 0.93) ) .cornerRadius(16) } .padding(.horizontal, 10) } .padding(.top, 5) // Switch between the different screen views VStack { if selectedScreen == 0 { ScreenOneView() } else if selectedScreen == 1 { ScreenTwoView() } else if selectedScreen == 2 { ScreenThreeView() } } .animation(.easeInOut, value: selectedScreen) } .background(Color(red: 0.91, green: 0.98, blue: 0.94)) } } struct ScreenOneView: View { var body: some View { VStack{ ScrollView{ VStack(spacing: 20) { Text("Lorem ipsum dolor sit amet consectetur. Id amet amet est pellentesque enim sagittis. Eu vitae molestie iaculis tellus. Egestas venenatis amet pretium sit enim aliquam. Pharetra commodo sed diam lectus ornare ultrices malesuada integer. Molestie tellus nisl tellus cras.") .font(Font.custom("PlusJakartaSans", size: 14).weight(.medium)) .foregroundColor(Color(red: 0.34, green: 0.46, blue: 0.53)) Text("Lorem ipsum dolor sit amet consectetur. Id amet amet est pellentesque enim sagittis. Eu vitae molestie iaculis tellus. Egestas venenatis amet pretium sit enim aliquam. Pharetra commodo sed diam lectus ornare ultrices malesuada integer. Molestie tellus nisl tellus cras.") .font(Font.custom("PlusJakartaSans", size: 14).weight(.medium)) .foregroundColor(Color(red: 0.34, green: 0.46, blue: 0.53)) } .padding(.horizontal, 20) .padding(.top, 20) } } .background(Color(red: 0.91, green: 0.98, blue: 0.94)) } } struct ScreenTwoView: View { var body: some View { VStack{ VStack{ ScrollView{ VStack(spacing: 20) { HStack{ VStack(spacing: 10){ Text("Sunday at 11:27") .font(Font.custom("PlusJakartaSans", size: 16).weight(.semibold)) .foregroundColor(Color.mainTitleBlack) .frame(maxWidth: .infinity,alignment: .leading) Text("June 12, New york") .font(Font.custom("PlusJakartaSans", size: 14).weight(.semibold)) .foregroundColor(Color.gray) .frame(maxWidth: .infinity,alignment: .leading) Rectangle() .fill(LinearGradient(gradient: Gradient(colors: [.red, .green, .blue]), startPoint: .leading, endPoint: .trailing)) .frame(height: 5) // Adjust thickness here // .padding() .padding(.top,10) .frame(maxWidth: .infinity) } Spacer() VStack(spacing: 10){ Image("play_Circled") .resizable() .frame(width: 24, height: 24) .background(.green) .cornerRadius(15) Text("00:43") .font(Font.custom("PlusJakartaSans", size: 16).weight(.semibold)) .foregroundColor(Color.mainTitleBlack) } .padding(.bottom,20) } .padding(15) .background(.white) .cornerRadius(15) HStack{ VStack(spacing: 10){ Text("Sunday at 11:27") .font(Font.custom("PlusJakartaSans", size: 16).weight(.semibold)) .frame(maxWidth: .infinity,alignment: .leading) .foregroundColor(Color.mainTitleBlack) Text("June 12, New york") .font(Font.custom("PlusJakartaSans", size: 14).weight(.semibold)) .frame(maxWidth: .infinity,alignment: .leading) .foregroundColor(Color.gray) Rectangle() .fill(LinearGradient(gradient: Gradient(colors: [.red, .green, .blue]), startPoint: .leading, endPoint: .trailing)) .frame(height: 5) // Adjust thickness here // .padding() .padding(.top,10) // .cornerRadius(1) } Spacer() VStack(spacing: 10){ Image("play_Circled") .resizable() .frame(width: 24, height: 24) .background(.green) .cornerRadius(15) Text("00:43") .font(Font.custom("PlusJakartaSans", size: 16).weight(.semibold)) .foregroundColor(Color.mainTitleBlack) } .padding(.bottom,20) } .padding(15) .background(.white) .cornerRadius(15) } .padding(.horizontal, 24) .padding(.top, 20) .cornerRadius(15) } .background(Color(red: 0.91, green: 0.98, blue: 0.94)) } HStack(spacing: 30) { Circle() .fill(Color.gray.opacity(0.2)) .frame(width: 50, height: 50) .overlay( Image(systemName: "xmark") .font(.title) .foregroundColor(.black) ) ZStack { Circle() .fill(Color.green) .frame(width: 70, height: 70) Circle() .fill(Color.white) .frame(width: 30, height: 30) } Circle() .fill(Color.gray.opacity(0.2)) .frame(width: 50, height: 50) .overlay( Image(systemName: "pause") .font(.title) .foregroundColor(.black) ) } } .background(.white) } } struct ScreenThreeView: View { @State private var isShowingCamera = false @State private var selectedImage: UIImage? // To store captured image var body: some View { VStack{ VStack(spacing: 20) { ScrollView{ VStack(spacing: 20) { HStack{ Image("videonote_img") .frame(width: 72, height: 72) //.cornerRadius(5) // .background( // Image("play_Circled") // .resizable() // .frame(width: 24, height: 24) // .cornerRadius(5) // // ) // VStack(alignment: .leading,spacing: 10){ Text("Clip One") .foregroundColor(Color(red: 0.12, green: 0.12, blue: 0.13)) .padding(.leading,10) Text("Description") .foregroundColor(Color(red: 0.61, green: 0.61, blue: 0.76)) .padding(.leading,10) } Spacer() VStack(alignment: .trailing){ Image("delete") .resizable() .frame(width: 20, height: 21) } } .padding() .background(Color.white) .cornerRadius(15) .overlay( RoundedRectangle(cornerRadius: 5) .stroke(Color.gray.opacity(0.3), lineWidth: 0.5) ) } .padding(.horizontal, 24) .cornerRadius(15) .background(.clear) VStack(alignment: .leading,spacing: 20){ HStack(spacing: 10){ Image("videonote_img") .frame(width: 72, height: 72) .cornerRadius(5) VStack(alignment: .leading,spacing: 10){ Text("Clip One") .font(Font.custom("Overpass", size: 16).weight(.semibold)) .foregroundColor(Color(red: 0.12, green: 0.12, blue: 0.13)) Text("Description") .font(Font.custom("Overpass", size: 14)) .foregroundColor(Color(red: 0.61, green: 0.61, blue: 0.76)) } Spacer() VStack(alignment: .trailing){ Image("delete") .resizable() .frame(width: 20, height: 21) } } .padding() .background(Color.white) .cornerRadius(15) // .overlay( // RoundedRectangle(cornerRadius: 5) // .stroke(Color.gray.opacity(0.3), lineWidth: 0.5) // ) // } .padding(.horizontal, 24) .padding(.top, 20) .cornerRadius(15) } } .background(Color(red: 0.91, green: 0.98, blue: 0.94)) VStack { Button(action: { isShowingCamera = true }) { Circle() .fill(Color.green) .frame(width: 70, height: 90) .overlay( Image(systemName: "camera.fill") // Use system image or your custom image .font(.title) .foregroundColor(.black) ) } .sheet(isPresented: $isShowingCamera) { CameraView(isPresented: $isShowingCamera, selectedImage: $selectedImage) } // Show Captured Image if let image = selectedImage { Image(uiImage: image) .resizable() .frame(width: 100, height: 100) .clipShape(RoundedRectangle(cornerRadius: 10)) } } // Image("camera_img") // .resizable() // .scaledToFit() // // .frame(width: 43,height: 90) // .background(.green) } .background(.white) } } //struct BottomSheetWithButtonsView_Previews: PreviewProvider { // static var previews: some View { // BottomSheetWithButtons() // } //}
Editor is loading...
Leave a Comment