Блог

У меня есть рекомендация, что я могу переместить его в действие жеста, но проблема в том, что жест начинает захватывать жест за пределами его фрейма, который, как я ожидаю, работает только внутри фрейма. вот код и gif-файл о проблеме:

gif — файл:

код:

     struct ContentView: View {
    
    @State private var recLocation: CGFloat = CGFloat()
    @GestureState private var recTranslation: CGFloat = CGFloat()
    
    var body: some View {
        
        GeometryReader { geometry in
            
            Rectangle().fill(Color.red).frame(width: 50, height: 50, alignment: .center)
                .position(x: recLocation   recTranslation   25, y: geometry.size.height/2)
                .gesture( DragGesture()
                            .updating($recTranslation) { value, state, translation in
                                state = value.translation.width
                            }
                            .onEnded { value in
                                recLocation = recLocation   value.translation.width
                            } )
            
            
        }
        
    }
}
 

Из того, что я знаю, каждый раз, когда я использую GeometryReader размеры моего контейнера, я перепутал, я пытался найти решение с первой минуты, когда вы опубликовали этот вопрос, потому что это очень интересно, и вот как преодолеть эту проблему:

 GeometryReader { geometry in
    
    Rectangle()
        .fill(Color.red)
        .frame(width: 50, height: 50)
        .position(x: recLocation   recTranslation   25, y: geometry.size.height/2)
        .overlay(
            Rectangle()
                .fill(Color.blue)
                .frame(width: 23.5, height: 23.5)
                .position(x: recLocation   recTranslation   25, y: geometry.size.height/2)
                .opacity(0.001)
                .gesture( DragGesture()
                            .updating($recTranslation) { value, state, translation in
                                state = value.translation.width
                            }
                            .onEnded { value in
                                recLocation = recLocation   value.translation.width
                            } )
        )
    
}.frame(width: 50, height: 50)
}
 

Объяснение:

По сути, я увидел, что объект DragGesture обнаружен за пределами границы вашего прямоугольника, благодаря чему я создал Overlay объект с той же формой и меньшим размером и превратил DragGesture его в Overlay .

Примечание: Не забудьте присвоить Overlay фигуре Opacity значение 0.001, тогда она будет невидимой, но все равно интерактивной.

Вуаля! все кажется идеальным.