How to move View Controllers on the Storyboard?

Question and answer on Stackoverflow.

Handling background touches: UIControl instead of UITapGestureRecognizer

Usually, to handle background touches on a View Controller we add a UITapGestureRecognizer. The setup requires a few lines of code, but there is a way, you can handle background touches even more easy!

What you need to do is just to change the root view type from UIView to UIControl and attach an action. With Storyboard:

1. Select the root view.
   
   
2. In the Identity inspector simply change the type to UIControl. (Serious type change isn't required.)
   
   
3. Finally, connect an action to the Touch Down event using Connections inspector.
   
   

Then the action can be utilized, for example, to hide a keyboard: @IBAction func backgroundTouched(_ sender: Any) { // Hide keyboard view.endEditing(true) }
If any child control interrupts a touch, it wouldn't be delivered to the background control! This is the main pro and con of this method. Sometimes it's exactly the desired behaviour to ignore touches on buttons. But other times you need to handle all the touches anywhere in the View Controller, like if you have a large UITextView and you want to hide the keyboard by tap.

Changing view's type on the Storyboard

Suppose the design of your app changed, and now you need to replace the Table View with a Collection View keeping all the constraints along with views hierarchy.

Drop a new View Controller on the storyboard and put a Collection View inside. Rename it in the left panel (called Document Outline). Name it "The Replacement" so you will be able recognize it later. Now switch to the Source Code through the Open As.

Now the storyboard looks like XML markup. Find the Table View you need to replace, it will be scoped within the tableView tag.

Copy its id (example: id="8Oa-xL-ums"). It points to the view in constraints and outlets. Now find the new Collection View under the collectionView tag.

Copy everything including the enclosing tags: <collectionView ...</collectionView> and paste it instead of the tableView. Replace Collection View's id with the value you copied from the Table View. Before switching back to Interface Builder you need to clean up the storyboard. Remove the scene of the temporary View Controller that you created at the beginning of the tutorial. Delete everything between tags and the preceding comment: <!--View Controller><scene ...</scene>. If you don't do this you will have an error because of duplicated id.

Now you will have the new Collection View constrained like the Table View but misplaced, because it's was copied with the rect.

Click Update Frames and enjoy the result!

Here is the list of storyboard tags for different UI classes. Who knows, may be it will be useful.

arscnView	ARSCNView
arskView	ARSKView
glkView	GLKView
mapView	MKMapView
mtkView	MTKView
sceneKitView	SCNView
skView	SKView
activityIndicatorView	UIActivityIndicatorView
button	UIButton
collectionView	UICollectionView
datePicker	UIDatePicker
imageView	UIImageView
label	UILabel
navigationBar	UINavigationBar
pageControl	UIPageControl
pickerView	UIPickerView
progressView	UIProgressView
scrollView	UIScrollView
searchBar	UISearchBar
segmentedControl	UISegmentedControl
slider	UISlider
stackView	UIStackView
stepper	UIStepper
switch	UISwitch
tabBar	UITabBar
tableView	UITableView
textField	UITextField
textView	UITextView
toolbar	UIToolbar
view	UIView
containerView	UIView (with embedded View Controller)
visualEffectView	UIVisualEffectView
webView	UIWebView
wkWebView	WKWebView