Post

Replies

Boosts

Views

Activity

Implement Geometryreader in a tabview
Hello, I'm trying to implement Geometryreader in a tabview and I'm having difficulties. My application is divided in 4 parent views and on which we go with a tabBar. In the first view "Home", there is also a custom tabBar. I would like that when I scroll the child view given by the custom tabview, the title of the mother view "Home //(Accueil)" moves in the toolbar. When I follow the tutorials on internet to print the minY when I scroll, nothing appears. Here is the code of my mother view: struct HomeView: View {     @State var top = UIApplication                         .shared                         .connectedScenes                         .flatMap { ($0 as? UIWindowScene)?.windows ?? [] }                         .first { $0.isKeyWindow }     @State var currentTab: Int = 0     var body: some View {         VStack(alignment: .leading){             VStack {                 HStack{                     friendsButton                     Spacer()                     profilButton                     settingsButton                 }                 .padding()             }             title             ZStack(alignment: .topLeading){                 //selectedView                 TabView(selection: self.$currentTab){                                    NewsView() .tag(0)                     ProgressView().tag(1)                     MyTrophiesView().tag(2)                                     }                 .tabViewStyle(.page(indexDisplayMode: .never)).edgesIgnoringSafeArea(.all)                                     //tabBar                 TabBarHomeView(currentTab: self.$currentTab)             }         }     } } struct HomeView_Previews: PreviewProvider {     static var previews: some View {         HomeView()     } } extension HomeView{     private var settingsButton: some View{...}     private var profilButton: some View{...}     private var friendsButton: some View{...}     private var title: some View{...}     }       Here is the code for my child view "News":     @State var offset: CGFloat = 0        var body: some View {         ScrollView(showsIndicators: false){             VStack{                 Spacer()                     .frame(height:50)                 SeasonPopUpView()                 newPoisView()                 randomDrawView()                 toursView()                 Spacer()             }                     }         .padding(.top, 10)         .overlay(             GeometryReader{proxy -> Color in                 let minY = proxy.frame(in: .global).minY                           print(minY)                 return Color.clear         }         )     } } Here is the code of my custom tabBar: import SwiftUI //TabBar Model struct TabBarHomeView: View{     @Binding var currentTab: Int     @Namespace var namespace     var tabBarOptions: [String] = ["Actualité", "Progression", "Trophées"]     var body: some View{                      HStack(spacing: 0){                 ForEach(Array(zip(self.tabBarOptions.indices, self.tabBarOptions)),                                                  id:\.0,                         content: {                     index, name in                     TabBarHomeItem(currentTab: self.$currentTab,                                    namespace: namespace.self,                                    tabBarItemName: name,                                    tab: index)                 })             }             .padding(.horizontal)             .background(.ultraThinMaterial)             .frame(height: 43)             .cornerRadius(5)             .padding(.horizontal, 5)             .padding(.vertical, 0)         //.edgesIgnoringSafeArea(.all)     } } // TabBar buttons model struct TabBarHomeItem: View{     @Binding var currentTab: Int     let namespace: Namespace.ID     var tabBarItemName: String     var tab: Int     var body: some View{         Button{             self.currentTab = tab         } label: {             VStack(spacing:7){                 Spacer(minLength: 3)                 Text(tabBarItemName)                     .font(.title3)                     .fontWeight(.medium)                 if currentTab == tab{                     Color.primary                         .frame(height: 5)                         .matchedGeometryEffect(id: "underline",                                                in: namespace,                                                properties: .frame)                 }else{                     Color.clear.frame(height: 5)                 }             }             .animation(.spring(), value: self.currentTab)                  }         .buttonStyle(.plain)     } } My goal is that the title appear in small between the top buttons, that the custom tabBar come to stay blocked under the toolBar (like a pinned section title in a list), and that the whole takes the background color of the custom tabBar in its initial state. Here is a picture of the HomeView: If you have any hints I'm interested. Thanks for reading.
1
0
1.5k
Dec ’22
Colors according to the value of a variable
Hello, I code a surface application to present a prototype. I want the compatibility squares (currently green) to vary between green, yellow, orange and red depending on the value of the atribute Proposal.Compatibility . I have two documents for this: the view layout struct ProposalsView: View {         var proposals: [Proposal] = ProposalList.TopTen     var body: some View {         ZStack{             Color.black                 .opacity(0.85)                 .edgesIgnoringSafeArea(.all)             ZStack{                 NavigationView{                     VStack(spacing:0){                         //List                         List(proposals, id: \.id){ Proposal in                             HStack{                                 Image(Proposal.ProfilePicture)                                     .resizable()                                     .aspectRatio(contentMode: .fill)                                     .frame(width: 70, height: 70)                                     .clipShape(Circle())                                 Spacer()                                     .frame(width: 5)                                 VStack(alignment: .leading, spacing: 5){                                     Text(Proposal.Name)                                         .fontWeight(.semibold)                                         .font(.system(size: 27))                                         .lineLimit(1)                                         .minimumScaleFactor(0.5)                                     Text(Proposal.Age)                                         .font(.system(size: 20))                                 }                                 // rectangle distance                                 ZStack{                                     Rectangle()                                         .fill(Color.blue)                                         .frame(width: 45, height: 45)                                         .cornerRadius(8)                                     Rectangle()                                         .fill(Color.white)                                         .frame(width: 40, height: 40)                                         .cornerRadius(6)                                     VStack(spacing: -5){                                         Text(Proposal.Distance)                                             .fontWeight(.semibold)                                             .font(.system(size: 23))                                                                                  Text(" kms")                                             .font(.system(size: 10))                                     }                                     .foregroundColor(.blue)                                 }                                 .frame(maxWidth: .infinity, alignment: .trailing)                                 // rectangle compatibility                                 ZStack{                                     Rectangle()                                         .fill(Color.green)                                         .frame(width: 45, height: 45)                                         .cornerRadius(8)                                     Text(Proposal.Compatibility)                                         .font(.system(size: 24))                                         .fontWeight(.semibold)                                 }                             }                         }                         .background(Color.blue)                         .padding(.horizontal, -20)                     }                 }                 .hiddenNavigationBarStyle()                 .ignoresSafeArea()                           }         }     } } struct ProposalsView_Previews: PreviewProvider {     static var previews: some View {         ProposalsView()     } } the contact information.     let id = UUID()     let ProfilePicture: String     let Name : String     let Age : String     let Description : String     let Distance : String     let Compatibility : String } struct ProposalList{     static let TopTen = [         Proposal(                  ProfilePicture: "John",                  Name: "John",                  Age: "24",                  Description: "description",                  Distance: "21",                  Compatibility: "94") ] I tried to change the compatibility from String to Int and create a variable with a return on the view, but I did not find the solution. If you have an idea I would be grateful. Thank you for reading and have a nice day.
2
0
712
Dec ’22
Make a header of a View 1 disappear according to the position of the body of a View 2
Good evening, I am a beginner in SwiftUI (and in code in general). I am currently trying to make an application for a university project. I would like to organize the layout of my different tabs. I'm trying to manage by taking different pieces of code from the internet to form what I want to achieve. Currently I'm stuck for 8 hours on something that seems simple: A code I copied allowed me to put a presentation name that disappears when you scroll up the page content. I didn't like the TabBar, so I replaced it with a template that has a more fluid animation. I am in the following situation: I would like to form a "Home" tab with 2 categories: "News" and "Challenges". For this, I have four Swift files: i. MixView ii. MixTabBar iii. NewsView iv. ChallengesView The problem comes from the fact that initially on the viewed youtube video, the data of the "News" page was present on the home page. Scrolling this data made the header disappear. As I also have the "Challenges", I have to (I think) find a way to make the body contained in the views iii and iv to trigger the hiding of the header on my central page.                 if !isHide{                     HStack(spacing:12){                                                  Text("Home")                             .font(.largeTitle)                             .fontWeight(.heavy)                             .foregroundColor(Color(.black))                                                  Spacer(minLength: 0)                                                  Button(action:{}) {                                                          Image(systemName:"gear")                                 .foregroundColor(.black)                                 .padding(10)                                 .font(.title2)                                 .clipShape(Circle())                         }                     }                     .padding(.horizontal)                 }                            GeometryReader{reader -> AnyView in let yAxis = reader.frame(in: .global).minY               if yAxis < -30 && !isHide{   DispatchQueue.main.async{ withAnimation{isHide = true}                                     }                    }               if yAxis > -30 && isHide{ DispatchQueue.main.async{ withAnimation{isHide = false}                                    }            }               return AnyView( Text("") .frame(width: 0, height: 0)                                 )                             }                            I specify that the code worked very well with the View one, but it is the implementation of the second one that causes problems. The final goal would be to have a page that has a title that disappears when I scroll (on the news sub-tab as on the Challenges sub-tab). As well as being able to swipe from one sub-tab to another (which is the case). On the second part of the screen, I left the text with the initial code, it makes the header disappear. I have seen examples with @State and @Binding, but I could not solve my problem. I recorded my screen so that you have as much information as possible. https://youtu.be/bf_EjFBXKWU Thanks in advance and have a great week.
0
0
438
Nov ’22