Click circle image and navigate new SwiftUI

Question

Created Mar ’21

Replies 9

Boosts 0

Views 2.3k

Participants 2

I have custom search bar and custom circle image in toolbar, when I click the circle image, I want to navigate new SwiftUI. Any idea will be appreciated.

ImageView:

Code Block VStack(alignment: .leading, spacing:0){      
      HStack(spacing: 0){
       
        TextField("Search", text: $search)
          .padding(.vertical,5)
          .padding(.horizontal)
          .background(Color.gray.opacity(0.090))
          .cornerRadius(30)
          .frame(width: 330, height: 32)
        
        Image("imgage")
          .resizable()
          .aspectRatio(contentMode: .fill)
          .frame(width: 32, height: 32)
          .clipShape(Circle())
          .overlay(Circle().stroke(Color("fig"), lineWidth: 1))
       
      }
}

ContentView:

Code Block var body: some View {
   //I have tabview here//
}

Boost

Answer 1

OOPer OP

Mar ’21

I want to navigate new SwiftUI.

Can you explain what you want to do more specifically? Do you want to navigate to another View as if NavigationLink is tapped?

0

Answer 2

skysoft13 OP

Mar ’21

I have circle image button in toolbar, When I click the image button, I want to open new View.

0

Answer 3

OOPer OP

Mar ’21

I want to open new View.

Sorry, but I do not understand what you mean by open new View. I'll be watching this thread and when you explain what I do understand, I will visit this thread again.

0

Answer 4

skysoft13 OP

Mar ’21

Hi, again :), I will try to explain again. I have custom image button in toolbar, when I click the image button, I want to navigate "NaturalView" for example. here some one ask.

0

Answer 5

OOPer OP

Mar ’21

I really appreciate your effort to explain, but I am saying I do not understand what you mean by the word navigate or open. Please try to explain without using such words.

The question in the link is marked as This question needs details or clarity.
Quite reasonable. You need to add details or clarify your question without using ambiguous words like navigate or open.

What do you want?

NavigationLink like behavior?
sheet?
fullScreenCover?

0

Answer 6

skysoft13 OP

Mar ’21

Definitely NavigationLink, when you click the image button, jumping any other page .

0

Answer 7

OOPer OP

Mar ’21

Definitely NavigationLink, when you click the image button, jumping any other page .

Can you show the whole code of your source View including the image button. Please clarify it already is embedded in a NavigationView or not.

0

Answer 8

skysoft13 OP

Mar ’21

All my code here, tnx to help me. When I write my code like that circle image in toolbar padding bottom. I want to fixed image in toolbar.

Code Block struct NatureView: View {  @State var search = ""
  var borderColor: Color = Color("color")
  var body: some View {
    NavigationView() {
    VStack(alignment: .leading, spacing:0){
      
      HStack(spacing: 0){
        Spacer()
        TextField("Search", text: $search)
          .padding(.vertical,5)
          .padding(.horizontal)
          .background(Color.gray.opacity(0.090))
          .cornerRadius(30)
          .frame(width: 330, height: 32)
        Spacer()
        NavigationLink(LocalizedStringKey, destination:SettingsView())
        Image("image")
          .resizable()
          .aspectRatio(contentMode: .fill)
          .frame(width: 32, height: 32)
          .clipShape(Circle())
          .overlay(Circle().stroke(Color("color"), lineWidth: 1))
      }
        Spacer()
         
      }
    VStack {
      Spacer()
      Button(action: {}) {
      Image("image-white")
        .padding()
        .background(Color("color"))
        .foregroundColor(Color.white)
        .clipShape(Circle())
        .frame(width: 40, height: 40)
        .shadow(color: Color("color"), radius: 1, x: 0.0 , y: 0.0)
             
        }
      }
      .frame(maxWidth: .infinity, alignment: .trailing)
      .padding()
       
    }
}
}
}

0

Answer 9

OOPer OP

Mar ’21

All my code here

Thanks for showing your code. But your code does not compile showing error on line 16.

Can you show a buildable code?
(Please do not forget to include the first line of your View.)

When I write my code like that circle image in toolbar padding bottom.
I want to fixed image in toolbar.

Sorry, I do not understand this part.

0