Wie erkennen Sie mit 3D Touch Peek und Pop den Benutzer während eines Peeks (wie Facebook)?

Question

Wenn Sie in der Facebook App ein Foto sehen, das Teil eines Albums ist, können Sie Ihren Finger horizontal bewegen, um zu anderen Fotos zu gelangen.

Wie wird dies innerhalb der API erreicht? Alles, was ich exponiert sehe, ist, dass ich einen View-Controller anbiete und diesen View-Controller nach Pop festlege.

Answer 1

Es gibt einen kleinen Trick, wo Sie die Touch-Position des Benutzers während des Spähens verfolgen können.

Sie haben grundsätzlich eine Gestenerkennung, die die Touch-Position des Benutzers beim Starten von Peeking verfolgt und die Verfolgung beendet, sobald der Benutzer den View-Controller auffordert oder seine Berührung freigibt. Der Gestenerkenner sollte der Ansicht des Ansichtscontrollers hinzugefügt werden, der den Peek hervorbringt.

Da Sie Zugriff auf den Peeked-View-Controller haben, können Sie eine Funktion von diesem View-Controller aufrufen, die dem Touch-Ort des Benutzers entspricht.

Nur eine schnelle Mockup:

@property (nonatomic, weak, nullable) ViewControllerClass *peekedVC; 

- (void)handleGestureRecognizer:(UIPanGestureRecognizer *)gr { 
    if (peekedVC && gr.state == UIGestureRecognizerStateChanged) { 
     CGPoint point = [gr locationInView:self.view]; 
     [peekedVC handle:point.x]; 
    } 
} 

- (UIViewController *)previewingContext:(id<UIViewControllerPreviewing>)previewingContext 
      viewControllerForLocation:(CGPoint)location { 
    NSIndexPath *indexPath = [self.collectionView indexPathForItemAtPoint:location]; 
    UICollectionViewCell *cell = [self.collectionView cellForItemAtIndexPath:indexPath]; 

    [previewContext setSourceRect:cell.frame]; 

    ViewControllerClass *vc = [ViewControllerClass new]; 
    self.peekedVC = vc; 
    return vc; 
} 

- (void)previewingContext:(id<UIViewControllerPreviewing>)previewingContext 
commitViewController:(UIViewController *)viewControllerToCommit { 
    self.peekedVC = nil; 
    [self showViewController:viewControllerToCommit sender:self]; 
} 

Ich habe tatsächlich eine Blog-Post, die die Mechanik diesen umfasst hier: https://medium.com/behancetech/peek-pan-extending-3d-touch-f6520c38fe51#.4xz7lcm9o

Es gibt auch ein Open-Source-Projekt, das dies hier hilft integrieren: https://github.com/adobe-behancemobile/PeekPan