How can I handle NavigationLink for HStack row

Question

Created Jun ’21

Replies 6

Boosts 0

Views 1.9k

Participants 3

I want to use NavigationLink for open the chat detail view when I click the rows items. Here example of code I mentioned. Any idea will be appreciated.

RecentRowView:

import SwiftUI

struct RecentRowView: View {

    var recent: Profile
    var animation: Namespace.ID

    // Environment Object...
    @EnvironmentObject var profileData: ProfileDetailModel

    var body: some View {

        HStack(spacing: 15){

            // Making it as clickable Button....

            Button(action: {
                withAnimation{
                    profileData.selectedProfile = recent
                    profileData.showProfile.toggle()
                }
            }, label: {

                ZStack{

                    // Without matched geometry effect simply showing image...
                    Image(recent.profile)
                        .resizable()
                        .aspectRatio(contentMode: .fill)
                        .frame(width: 60, height: 60)
                        .clipShape(Circle())

                    if !profileData.showProfile{

                        Image(recent.profile)
                            .resizable()
                            .aspectRatio(contentMode: .fill)
                            // Matched Geometry Effect...
                            // Giving unique ID that is from UUID from profile Model....
                            .matchedGeometryEffect(id: recent.id, in: animation)
                            .frame(width: 60, height: 60)
                            .clipShape(Circle())
                    }
                }
            })
            // it decreased the highlight color....
            .buttonStyle(PlainButtonStyle())

            VStack{
  NavigationLink(destination: ChatDetailView(), isActive: $profileData.show) {
                HStack{

                    VStack(alignment: .leading, spacing: 8, content: {

                        Text(recent.userName)
                            .fontWeight(.bold)

                        Text(recent.lastMsg)
                            .font(.caption)
                            .foregroundColor(.gray)
                    })

                    Spacer(minLength: 10)

                    Text(recent.time)
                        .font(.caption2)
                        .foregroundColor(.gray)
                }

                Divider()
            }
        }
}
        .padding(.horizontal)
    }
}

struct RecentRowView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

ContentView:


struct ContentView: View {

    // ANimation Namespace...
    @Namespace var animation

    // StateObject...
    @StateObject var profileData = ProfileDetailModel()

    var body: some View {

        Home(animation: animation)
        // setting Environment Object...
            .environmentObject(profileData)
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
    NavigationView{
        ContentView()
    }
}
}

ChatDetailView:

import SwiftUI

struct ChatDetailView: View {
  var body: some View {
    Text(/*@START_MENU_TOKEN@*/"Hello, World!"/*@END_MENU_TOKEN@*/)
  }
}

struct ChatDetailView_Previews: PreviewProvider {
  static var previews: some View {
    ChatDetailView()
  }
}

Answered by Claude31 in 677262022

Here is a very simplistic example:

struct ContentView: View {
    var body: some View {
        NavigationView {
            List {
                NavigationLink(destination: DetailView() .navigationBarTitle("Test Detail")){
                    Text("Goto Detail").foregroundColor(.blue)
                }
                .navigationBarTitle("Welcome")
            }
        }
    }
}

Boost

Answer 1

Claude31 OP

Jun ’21

Could you describe what is the problem, what it is you cannot get working ?

0

Answer 2

workingdogintokyo OP

Jun ’21

Since you don't ask a question here, nor provide sufficient code, I can only guess. For NavigationLink to work you need a NavigationView. There is no NavigationView in ContentView, maybe you have one in Home?

0

Answer 3

skysoft13 OP

Jun ’21

`struct ContentView_Previews: PreviewProvider { static var previews: some View { NavigationView{ ContentView() } } here I mentioned if you look at carefully

0

Answer 4

Claude31 OP

Jun ’21

Accepted Answer

Here is a very simplistic example:

struct ContentView: View {
    var body: some View {
        NavigationView {
            List {
                NavigationLink(destination: DetailView() .navigationBarTitle("Test Detail")){
                    Text("Goto Detail").foregroundColor(.blue)
                }
                .navigationBarTitle("Welcome")
            }
        }
    }
}

1

Answer 5

workingdogintokyo OP

Jun ’21

yes, if you read my comment carefully, I say in ContentView not ContentView_Previews. Try putting NavigationView in ContentView like @Claude31 answer.

0

Answer 6

skysoft13 OP

Jun ’21

in question, I put the same except 'ContentView_Previews' , but even still I did not get the answer for question. I guess still my question not understood.

0