Problem with Photo Gallery App course

Hi everyone,

The chat on the site is not working and I have some trouble with my code. How do I get some help?

Best,
Sem

@SemC

Hi Sem,

Welcome to the community.

Ask your question here and the folks like me will help out if we can.

If applicable, post your code that you are having trouble with. When you do, copy the code from Xcode and paste in your editing window and then format it by selecting the code block and tapping on the </> button in the toolbar. That formats it nicely so that it is easy to copy and do some testing to offer a solution.

1 Like

Hi Chris,

To be sure, do I just post the code as a reply on your post?

Best,
Sem

Yes, post your code as part of your reply. You can post more that one block of code if there is more than one View that is troubling you. Each block of code can be formatted separately. As an example, this is what code looks like when formatted.

struct ContentView: View {
    @Environment(\.modelContext) var modelContext

    @State private var sortOrder = SortDescriptor(\Restaurant.name)
    @State private var navPath = [Restaurant]()
    @State private var searchText = ""

    var body: some View {
        NavigationStack(path: $navPath) {
            RestaurantListingView(sort: sortOrder, searchString: searchText)
                .navigationTitle("Gusto")
                .navigationDestination(for: Restaurant.self, destination: { restaurant in
                    EditRestaurantView(restaurant: restaurant)
                })
                .searchable(text: $searchText)
                .toolbar {
                    Button("Add Samples", action: addSamples)

                    Button(action: addNewRestaurant) {
                        Label("Add new restaurant", systemImage: "plus")
                    }

                    Menu("Sort") {
                        Picker("Sort", selection: $sortOrder) {
                            Text("Name")
                                .tag(SortDescriptor(\Restaurant.name))

                            Text("Price")
                                .tag(SortDescriptor(\Restaurant.priceRating, order: .reverse))

                            Text("Quality")
                                .tag(SortDescriptor(\Restaurant.qualityRating, order: .reverse))

                            Text("Speed")
                                .tag(SortDescriptor(\Restaurant.speedRating, order: .reverse))
                        }
                        .pickerStyle(.inline)
                    }
                }
        }
    }

You can reply to my post directly or just tap on the Blue Reply button a little lower. It makes no difference which reply button you use.

import SwiftUI
import WebKit

struct ContentView: View {
    
    let columns = [GridItem(.flexible()), GridItem(.flexible())]
    @State var openMenu:Bool = false
    @State var aboutLink:Bool = false
    @State var licenseLink:Bool = false
    
    init(){
        (UIApplication.shared.connectedScenes.first as? UIWindowScene)?.windows.first!.overrideUserInterfaceStyle = .dark
    }
    
    var body: some View {
        GeometryReader{ geo in
            ScrollView{
                LazyVGrid(columns: columns){
                    ForEach(1...10, id: \.self){I in
                        Color.orange.frame(width: geo.size.width/2, height: geo.size.height/2)
                    }
                }
                HStack{
                    VStack{
                        Text("50 Soap Bubbles")
                            .foregroundColor(.white)
                            .font(.title2)
                        Text("See what's coming in the next update")
                            .foregroundColor(.white)
                        Link("Follow Irisdesfera on Instagram >",destination: URL(string: "https://www.codewithchris.com")!)
                    }
                }
                /*
                NavigationLink(destination: AboutPage(), label: {
                    EmptyView()
                 }*/
            }
        }
        .navigationBarBackButtonHidden(true)
        /*.navigationBarItems(trailing:
        Button(action:{
            openMenu = true
            print("triggered")
        },
        label:{
            Image(systemName: "chevron.down")
                .font(.title)
        }))
        */
        .navigationBarTitleDisplayMode(.inline)
        .overlay(alignment: .topTrailing, content: {
            Button(action:{
                openMenu.toggle()
            }, label: {
                Image(systemName: "chevron.down").font(.largeTitle)
            })
        })
        .sheet(isPresented: $openMenu, content: {
            NavigationView {
                ZStack{
                    Color.white.opacity(0).edgesIgnoringSafeArea(.all)
                    VStack(spacing: 30){
                        Text("").padding(30)
                        NavigationLink(destination: AboutPage()) {
                            Button("About", action: {
                                aboutLink.toggle()
                                // openMenu.toggle()
                            }).font(.title)
                        }
                        
                        NavigationLink(destination: WebView(request: URLRequest(url: URL(string: "https://iridisfera.app/legal/ios/")!))) {
                                    Text("Get in Touch")
                                        .font(.title)
                        }
                        
                        NavigationLink(destination: WebView(request: URLRequest(url: URL(string: "https://iridisfera.app/privacy/")!))) {
                            Text("Privacy Policy")
                                .font(.title)
                        }
                        Spacer()
                        Text("App veriosn 1.0").font(.subheadline).padding(20)
                    }
                }
                .navigationBarTitleDisplayMode(.inline)
                .navigationBarBackButtonHidden()
                .background(BackgroundBlurView())
                }
            .background(BackgroundBlurView())
        })
    }
}

struct AboutPage:View {
    var body: some View{
        HStack(alignment:.top){
            VStack(alignment: .leading, spacing: 20){
                Text("About Iridisfera").font(.largeTitle).foregroundColor(.white).padding()
                Text("After two years of global pandemic, we all worked out ways of maintaining balance while social distancing. The soap film is my window; an extension of vision over great expanses. My name is Bogdan Chesaru. I made Iridisfera so you can wander with me.\n\nA soap film is a thin layer of water bounded by two layers of surfactant molecules. The iridescent colors arise from the interference of light waves reflecting off the front and back surfaces of the film. This natural phenomenon is known as thin-film interference.\n\nThank you for joining my soap bubble odyssey. If you want to make my day, leave a review.").font(.body).foregroundColor(.gray).multilineTextAlignment(.leading).frame(alignment: .topTrailing).padding()
                Spacer()
        }
    }
}
}


struct WebView: UIViewRepresentable{
    let request:URLRequest
                    
    func makeUIView(context: Context) -> WKWebView {
        return WKWebView()
                    }
                    
    func updateUIView(_ uiView: WKWebView, context: Context) {
        uiView.load(request)
    }
}


struct BackgroundBlurView:UIViewRepresentable{
    func makeUIView(context: Context) -> some UIView {
        let view = UIVisualEffectView(effect: UIBlurEffect(style: .systemThinMaterial))
        
        DispatchQueue.main.async{
            view.superview?.superview?.backgroundColor = .clear
        }
        
        return view
    }
    
    func updateUIView(_ uiView: UIViewType, context: Context) {
        
    }
}



#Preview {
    ContentView()
}
````Preformatted text`

Please keep in mind that my code is a bit different due to some*updates in iOS 16. Also I did all the other links as a webview since I think it’s nicer.

OK so what exactly is the issue you are facing? Can you describe briefly what you wanted to achieve and what it is not doing properly.

The menu should display in a see trough and blurred way and the link to the about part is not working

I followed this course a long time ago and running the same code I have now does not yield the same result that it did back then.

The other point to note is that the Gallery App is part of the legacy group of courses and the disclaimer that Chris posted was that it is not recommended that you follow them since they are not up to date. It also states that there is no support on them. I personally don’t know what the answer is to make it work as intended as a lot has changed in iOS since that course was released.

Hi Chris,

Yes, same things changed with iOS 16. I think I managed to solve those problems but some other problems came up, maybe also because of that. Nevertheless, thanks for looking.

Have a great weekend!

Cheers Sam,

I’ll still have a look and see if there is a way to make it work.

I got the blur to work but didn’t use the UIViewRepresentable since there is a SwiftUI modifier that does that nicely.

I could not get the MenuView to be opaque and show ContentView through. I suspect that iOS17 has changed and you can’t do that. I fiddled around for ages with it. I also changed each instance of NavigationView to NavigationStack (That’s the preferred option for iPhone devices.

If you are interested this is the code that I have.

1 Like

Thanks a lot Chris!

@SemC

I found a solution to getting the presented sheet to have a translucent background in the project that I shared with you.

In the .sheet modifier code in ContentView, add the following modifier .presentationBackground(Color.clear) to the MenuView() like this:

        .sheet(isPresented: $isMenuOpen) {
            MenuView(isMenuOpen: $isMenuOpen, isShowingLicense: $isShowingLicense, isShowingAboutPage: $isShowingAboutPage)
                .presentationBackground(Color.clear)
        }
        .blur(radius: isMenuOpen ? 7.0 : 0)

I also increased the blur to 7 and this is what it looks like:

I made the presentationBackground color gray with quite a bit of opacity
.presentationBackground(Color.gray.opacity(0.3))
and to me it looks a little better than using just clear as the sheet outline is a little more obvious. Horses for course I guess.

1 Like