Getting started with 3D Touch Peek & Pop— Swift

Check for 3D Touch support:

if( traitCollection.forceTouchCapability == .available{
registerForPreviewing(with: self, sourceView: view)
}

1. Home Screen Quick Actions

App Icon Quick Action

Static Quick Action

Dynamic Quick Action

Adding UIApplicationShortcutitems array in Info.plist

source code:

<key>UIApplicationShortcutItems</key>
<array>
<dict>
<key>UIApplicationShortcutItemIconType</key>
<string>UIApplicationShortcutIconAdd</string>
<key>UIApplicationShortcutItemTitle</key>
<string>Show Pictures</string>
<key>UIApplicationShortcutItemType</key>
<string> addBundleIdentifier.showPictures</string>
</dict>
</array>
if shortcutItem.type == "UIApplicationShortcutItemType"{
let storyBoard : UIStoryboard = UIStoryboard(name: "Main", bundle: nil)
let initViewController = storyBoard.instantiateViewController(withIdentifier: "3dtouch")
self.window?.rootViewController = initViewController
self.window?.makeKeyAndVisible()
}

2. Peek and Pop

  • Indication that content preview is available
  • Display of the preview known as a peek with options to act on it directly known as peek quick actions
  • Optional navigation to the view shown in the preview known as a pop
Peeking

Peeking

func previewingContext(previewingContext: UIViewControllerPreviewing, viewControllerForLocation location: CGPoint) -> UIViewController? {
//Here's where you commit (peek)
}

Popping

Popping
func previewingContext(previewingContext: UIViewControllerPreviewing, commitViewController viewControllerToCommit: UIViewController) {
//Here's where you commit (pop)
}
let convertedLocation = view.convert(location, to: imageView)
if imageView.bounds.contains(convertedLocation){
let popVC = storyboard?.instantiateViewController(withIdentifier: "popVC") as! popViewController
popVC.popImage = imageView.image!
//Set your height
popVC.preferredContentSize = CGSize(width: 0.0, height: 300)
previewingContext.sourceRect = imageView.frame
return popVC
}else{
return nil
}
show(viewControllerToCommit, sender: self)
//For CollectionView 
guard let indexPath = collectionView?.indexPathForItem(at:location) else { return nil }
guard let cell2 = collectionView.cellForRow(at: index) else { return nil }
//For TableView
guard let indexPath = tableView?.indexPathForItem(at:location) else { return nil }
guard let cell2 = tableview.cellForRow(at: indexPath) else { return nil }
guard let popVC = storyboard?.instantiateViewController(withIdentifier: "popVC") as? popViewController else { return nil }
let photo = photos[indexPath.row]
popVC.photo = photo
//Set your Peek height
popVC.preferredContentSize = CGSize(width: 0.0, height: 300)
previewingContext.sourceRect = cell.frame
return popVC

If you found this tutorial useful, you know what to do now. Hit that clap button and follow me to get more articles and tutorials on your feed.

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Ashok

Ashok

 iOS and Flutter developer @TCS, Chennai. Here to share best practices learned through my experience. Reach me on www.linkedin.com/in/ashok1208