Glisser-déposer de base sous iOS

Je veux avoir une vue dans laquelle il y a des véhicules qui circulent que l'utilisateur peut également glisser-déposer. Quelle est selon vous la meilleure stratégie à grande échelle pour y parvenir? Est-il préférable d'obtenir des événements tactiles à partir des vues représentant les véhicules ou d'une vue plus large? Y a-t-il un paradigme simple que vous avez utilisé pour le glisser-déposer qui vous satisfait? Quels sont les inconvénients des différentes stratégies?

Supposons que vous ayez une UIViewscène avec une image d'arrière-plan et beaucoup vehicles, vous pouvez définir chaque nouveau véhicule comme un UIButton(UIImageView fonctionnera probablement aussi):

UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
[button addTarget:self action:@selector(imageTouch:withEvent:) forControlEvents:UIControlEventTouchDown];
[button addTarget:self action:@selector(imageMoved:withEvent:) forControlEvents:UIControlEventTouchDragInside];
[button setImage:[UIImage imageNamed:@"vehicle.png"] forState:UIControlStateNormal];
[self.view addSubview:button];

Ensuite, vous pouvez déplacer le véhicule où vous le souhaitez, en répondant à l' UIControlEventTouchDragInsideévénement, par exemple:

- (IBAction) imageMoved:(id) sender withEvent:(UIEvent *) event
{
    CGPoint point = [[[event allTouches] anyObject] locationInView:self.view];
    UIControl *control = sender;
    control.center = point;
}

Il est beaucoup plus facile pour un véhicule individuel de gérer ses propres traînées, comparativement à la gestion de la scène dans son ensemble.

En plus de la réponse d'Ohho, j'ai essayé une implémentation similaire, mais sans problème de glissement "rapide" et de centrage pour faire glisser.

L'initialisation du bouton est ...

UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
[button addTarget:self action:@selector(imageMoved:withEvent:) forControlEvents:UIControlEventTouchDragInside];
[button addTarget:self action:@selector(imageMoved:withEvent:) forControlEvents:UIControlEventTouchDragOutside];
[button setImage:[UIImage imageNamed:@"vehicle.png"] forState:UIControlStateNormal];
[self.view addSubview:button];

et mise en œuvre de la méthode:

- (IBAction) imageMoved:(id) sender withEvent:(UIEvent *) event
{
    UIControl *control = sender;

    UITouch *t = [[event allTouches] anyObject];
    CGPoint pPrev = [t previousLocationInView:control];
    CGPoint p = [t locationInView:control];

    CGPoint center = control.center;
    center.x += p.x - pPrev.x;
    center.y += p.y - pPrev.y;
    control.center = center;
}

Je ne dis pas que c'est la solution parfaite pour la réponse. Néanmoins, j'ai trouvé que c'était la solution la plus simple pour faire glisser.

J'ai eu un cas où je voudrais faire glisser / déposer des uiviews entre plusieurs autres uiviews. Dans ce cas, j'ai trouvé la meilleure solution pour tracer les événements de panoramique dans une super vue contenant toutes les zones de dépôt et tous les objets de pignon de glissement. La principale raison pour ne PAS ajouter les écouteurs d'événements aux vues déplacées réelles était que j'ai perdu les événements de panoramique en cours dès que j'ai changé la vue supervisée pour la vue déplacée.

Au lieu de cela, j'ai mis en œuvre une solution de glisser-déposer plutôt générique qui pourrait être utilisée sur une ou plusieurs zones de dépôt.

J'ai créé un exemple simple qui peut être vu ici: Faites glisser un uiviews de dépôt entre plusieurs autres uiviews

Si vous décidez d'aller dans l'autre sens, essayez d'utiliser uicontrol au lieu de uibutton. Ils déclarent les méthodes addTarget et sont beaucoup plus faciles à étendre - donc donnent un état et un comportement personnalisés.

Je suivrais en fait le glissement sur la vue du véhicule elle-même, plutôt que sur la vue large - à moins qu'il n'y ait une raison particulière de ne pas le faire.

Dans un cas où j'autorise l'utilisateur à placer des éléments en les faisant glisser sur l'écran. Dans ce cas, j'ai expérimenté à la fois la possibilité de faire glisser la vue de dessus et les vues enfants . J'ai trouvé que c'est un code plus propre si vous ajoutez quelques vues "déplaçables" à l'UIView et comment vous pouvez les faire glisser. J'ai utilisé un simple rappel à l'UIView parent pour vérifier si le nouvel emplacement était approprié ou non - afin que je puisse indiquer avec des animations.

Faire glisser la piste de la vue de dessus est aussi bien, je suppose, mais cela le rend légèrement plus compliqué si vous souhaitez ajouter des vues non déplaçables qui interagissent toujours avec l'utilisateur, comme un bouton.

-(void)funcAddGesture
{ 

 // DRAG BUTTON
        UIPanGestureRecognizer *panGestureRecognizer;
        panGestureRecognizer = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(dragButton:)];
        panGestureRecognizer.cancelsTouchesInView = YES;

        UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
        button.frame = CGRectMake(50, 100, 60, 60);
        [button addTarget:self action:@selector(buttontapEvent) forControlEvents:UIControlEventPrimaryActionTriggered];
        [button setImage:[UIImage imageNamed:@"button_normal.png"] forState:UIControlStateNormal];
        [button addGestureRecognizer:panGestureRecognizer];
        [self.view addSubview:button];
}


- (void)dragButton:(UIPanGestureRecognizer *)recognizer {

    UIButton *button = (UIButton *)recognizer.view;
    CGPoint translation = [recognizer translationInView:button];

    float xPosition = button.center.x;
    float yPosition = button.center.y;
    float buttonCenter = button.frame.size.height/2;

    if (xPosition < buttonCenter)
        xPosition = buttonCenter;
    else if (xPosition > self.view.frame.size.width - buttonCenter)
        xPosition = self.view.frame.size.width - buttonCenter;

    if (yPosition < buttonCenter)
        yPosition = buttonCenter;
    else if (yPosition > self.view.frame.size.height - buttonCenter)
        yPosition = self.view.frame.size.height - buttonCenter;

    button.center = CGPointMake(xPosition + translation.x, yPosition + translation.y);
    [recognizer setTranslation:CGPointZero inView:button];
}


- (void)buttontapEvent {

    NSLog(@"buttontapEvent");
}

La réponse d'Ohho a bien fonctionné pour moi. Si vous avez besoin de la version swift 2.x:

override func viewDidLoad() {

    let myButton = UIButton(type: .Custom)
    myButton.setImage(UIImage(named: "vehicle"), forState: .Normal)

    // drag support
    myButton.addTarget(self, action:#selector(imageMoved(_:event:)), forControlEvents:.TouchDragInside)
    myButton.addTarget(self, action:#selector(imageMoved(_:event:)), forControlEvents:.TouchDragOutside)
}

private func imageMoved(sender: AnyObject, event: UIEvent) {
    guard let control = sender as? UIControl else { return }
    guard let touches = event.allTouches() else { return }
    guard let touch = touches.first else { return }

    let prev = touch.previousLocationInView(control)
    let p = touch.locationInView(control)
    var center = control.center
    center.x += p.x - prev.x
    center.y += p.y - prev.y
    control.center = center
}

Voici la meilleure façon de faire du glisser-déposer à partir d'iOS 11:

https://developer.apple.com/documentation/uikit/drag_and_drop/adopting_drag_and_drop_in_a_custom_view

Pour Swift 4 Le moyen le plus simple et le plus simple. 😛

Étape 1: Connectez votre bouton du Storyboard à View Controller. Et définir toutes les contraintes de base de mise en page automatique

 @IBOutlet weak var cameraButton: UIButton!

Étape 2: Ajouter un mouvement de panoramique pour votre bouton dans viewDidLoad ()

self.cameraButton.addGestureRecognizer(UIPanGestureRecognizer(target: self, action: #selector(self.panGestureHandler(panGesture:))))

Étape 3:

Ajouter panGestureHandler

@objc func panGestureHandler(panGesture recognizer: UIPanGestureRecognizer) {

         let location = recognizer.location(in: view)
        cameraButton.center = location

    }

Et maintenant votre action de bouton

@IBAction func ButtonAction(_ sender: Any) {

        print("This is button Action")
    }

Ajouter Voir le résultat ☝️