Buttons inside overlay not clickable SwiftUI

Question

I have an overlay modifier with some Buttons that I'd like to make clickable, but they are not working for some reason. It seems like a simple fix, but moving the offsets to different subviews didn't seem to work.

struct MyView: View {
  @State private var textOffset = 300
  let users = ["first","second","third","fourth","fifth","sixth","seventh"]
  var body: some View {
    Color.yellow
    .frame(width: 200, height: 20)
    .overlay (
      HStack {
        ForEach(users, id: \.self) { user in
          if user == users.first {
            Link(user, destination: URL(string: "myelin")!)
          } else {
            Text("•")
            Link(user, destination: URL(string: "mylink2")!)
          }
        }
      }
      .fixedSize()
      .offset(x: textoffset, y: 0)
    )
    .animation(.linear(duration: 10)
    .repeatForever(autoreverses: false), value: textoffset)
    .clipped()
    .onAppear {
       textoffset = -300.0
    }
  }
}

@Yodagama If I wrap the Color.yellow and the HStack inside a Stack (removing the overlay), and I move the .frame(), .clipped(), and .onAppear() to the ZStack, the buttons are still unresponsive. — nickcoding2, Oct 19 '22 at 16:20
we can fix it, but another question ; do you want those buttons to be scrollable , because the space (.frame(width: 200, height: 20)) of the Yello is not enough for all of those buttons. — YodagamaHeshan, Oct 20 '22 at 01:16

score 0 · Answer 1 · edited Aug 01 '23 at 18:14

0

.overlay() adds an another layer on top of the view. We can achive this with ZStack that arrange views in z axis.

struct ContentView: View {
    let users = ["first","second","third","fourth","fifth","sixth","seventh"]
    var body: some View {
        ZStack {
            Color.yellow
            ScrollView(.horizontal) {
                HStack {
                    ForEach(users, id: \.self) { user in
                        if user == users.first {
                            Link(user, destination: URL(string: "myelin")!)
                        } else {
                            Text("•")
                            Link(user, destination: URL(string: "mylink2")!)
                        }
                    }
                }
            }
        }
        .frame(width: 200, height: 20)
    }
}

edited Aug 01 '23 at 18:14

Dmytro Titov

2,802
6
38
60

answered Oct 20 '22 at 01:20

YodagamaHeshan

4,996
2
26
36

I don't just want a scrollview. I need to have the animation. – nickcoding2 Oct 20 '22 at 02:18
does this answer your question https://stackoverflow.com/questions/65480452/swiftui-textfield-shake-animation-when-input-is-not-valid – YodagamaHeshan Oct 20 '22 at 02:34
I'm just trying to add a marquee effect where the buttons move from right to left over and over but are still clickable and contained in the yellow area. – nickcoding2 Oct 20 '22 at 03:06

Buttons inside overlay not clickable SwiftUI

1 Answers1