Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

SwiftUI DragGesture blocking List vertical scroll?

Tags:

swiftui

i am trying to add swipe inside list cell , swipe to show more options such as Delete, archive etc .

The swipe is working just fine , but the List ( vertical scroll ) is no longer scrolling up down .

Cell Bite :

import SwiftUI

struct cl_task: View {
    @State private var offset: CGSize = .zero
  
    var body: some View {
        
        //Swipe to custom options ,by "Jack" this option not yet available in SwiftUI
        let drag = DragGesture(minimumDistance: 0, coordinateSpace: .local)
       
                   .onChanged {
                    
                    if (self.offset.width > 0 ){  return }
                    self.offset.width = $0.translation.width
                
                   }.onEnded {
                   if $0.translation.width < -100 {
                       self.offset = .init(width: -100, height: 0)
                   } else {
                      self.offset = .zero
                   }
               }
        ZStack{
            Rectangle().foregroundColor(.blue).offset(x: offset.width, y: offset.height)
                .gesture(drag)
                .animation(.easeIn, value: offset)
            Text("test").foregroundColor(.white)
        }.frame(minWidth: 0,
                maxWidth: .infinity,
                minHeight: 100,
                maxHeight: .infinity,
                alignment: .topLeading
        )
        
    }
}

struct cl_task_Previews: PreviewProvider {
    static var previews: some View {
        cl_task().previewLayout(.sizeThatFits)
    }
}

List main view :

struct Item {
    let uuid = UUID()
    let value: String
}

struct w_tasks: View {
    
    @State private var items = [Item]()
      

      var body: some View {
          ZStack {
            
    
                        List(self.items, id: \.uuid) {item in
                      
                            cl_task() 
                            
                        
                        }
                        .simultaneousGesture(DragGesture().onChanged({ value in

                           //Scrolled
                        }))
                
      

              
              VStack {
                  Spacer()

                  HStack {
                      Spacer()

                      Button(action: {
                          self.items.append(Item(value: "Item"))
                      }, label: {
                          Text("+")
                          .font(.system(size: 50))
                          .frame(width: 77, height: 70)
                          .foregroundColor(Color.white)
                          .padding(.bottom, 7)
                      })
                      .background(Color(hex : "#216D94"))
                      .cornerRadius(38.5)
                      .padding()
                      .shadow(color: Color.black.opacity(0.3),
                              radius: 3,
                              x: 3,
                              y: 3)
                  }
              }
          }
      }
}

struct w_tasks_Previews: PreviewProvider {

    static var previews: some View {
        w_tasks()
    }
}

I've posted my question after spending hours solving this issue as i am new to SwiftUI , any advice how to solve it ?

like image 427
Khodour.F Avatar asked Mar 28 '26 05:03

Khodour.F


1 Answers

The solution is to give different distance for swipe, like below

struct cl_task: View {
    @State private var offset: CGSize = .zero

    var body: some View {

        // give 25 distance makes vertical scroll enabled !!
        let drag = DragGesture(minimumDistance: 25, coordinateSpace: .local)

                   .onChanged {

Tested with Xcode 12.4 / iOS 14.4

demo

like image 117
Asperi Avatar answered Mar 29 '26 22:03

Asperi