title: [[WWDC 2020]]: Build for iPad --- title: [[WWDC 2020]]: Build for iPad --- - **Metadata**: - Date: [[June 24th, 2020]] - Conference: [[WWDC 2020]] - Speaker(s): - [[Kurt Revis]] - [[Natalia Harateh]] - Video: https://developer.apple.com/videos/play/wwdc2020/10105 - Slides: - Tags: [[Talks]] - Muti-column Split View - `[[[UISplitViewController]]]` - New APIs in [[IOS 14]] - `init(style:)` - Style: `doubleColumn` - `setViewController(_ for: column)` - New Middle Column - Supplementrary - `setViewController(for:.Compact` - Double column display modes - `preferredSplitBehavior` - Modes - `displace` - Push partially offscreen - `overlay` - `hideColumn` / `showColumn` - `preferredDisplayMode` if you always want one mode - `UINavigationController` for each column automatically - See `UISplitViewController` Dos - New delegate methods - Control over columns width - Lists - Use `[[UICollectionView]]` - See [[[[WWDC 2020]]: Advances in UICollectionView]] - Use - `[[UICollectionViewDiffableDataSource]]` - `[[UICollectionLayoutListConfiguration]]` - See Updated [[Human Interface Guidelines]] - More - Accessories - Outlines - Reordering - Swipe Actions - Stop using `[[UITableView]]` - Reducing Modality - Don’t make people tap once to dismiss a popover and then again to start drawing - Don’t use dimming views, and allow folks to start scrolling with the same touch as dismissing - Watch for user actions, and dismiss transient UI in the way - Case Study: Shortcuts - Sidebar - Two column layout with Split View Controller - Secondary Column - ```clojure let splitViewController = UISplitViewController(style: .doubleColumn) // Primary column let sidebar = SidebarViewController() splitViewController.setViewController(sidebar, for: .primary) // Secondary column func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) { splitViewController.showDetailViewController(DetailViewController(), sender: self) } ``` - Showing a Tab Bar in Compact Width - ```clojure let tabBarController = createTabBarController() splitViewController.setViewController(tabBarController, for: .compact) ``` - Sidebar - `Restorable` protocol - When the size class changes, we recreate the detail controller and put it in the right spot - Collection View Setup - ```clojure let layout = UICollectionViewCompositionalLayout(sectionProvider: sectionProvider, configuration: UICollectionViewCompositionalLayoutConfiguration()) func sectionProvider(_ section: Int, environment: NSCollectionLayoutEnvironment) -> NSCollectionLayoutSection { var configuration = UICollectionLayoutListConfiguration(appearance: .sidebar) if (environment.traitCollection.horizontalSizeClass == .compact) { configuration.headerMode = .firstItemInSection } else { configuration.headerMode = .none } return NSCollectionLayoutSection.list(using: configuration, layoutEnvironment: environment) } ``` - Cells - ```clojure struct Section: Hashable { … } struct Item: Hashable { … } let cellRegistration = UICollectionView.CellRegistration<UICollectionViewListCell, Item> { cell, indexPath, item in // Configure the cell } let dataSource = UICollectionViewDiffableDataSource<Section, Item>(collectionView: collectionView) { collectionView, indexPath, item in return collectionView.dequeueConfiguredReusableCell(using: cellRegistration, for: indexPath, item: item) } ``` - Content Configuraiton - ```clojure let cellRegistration = UICollectionView.CellRegistration<UICollectionViewListCell, Item> { cell, indexPath, item in var content = cell.defaultContentConfiguration() content.text = item.title content.image = item.image cell.contentConfiguration = content } ``` - Summary - Add columns with `UISplitViewController` - Build lists with collection views - Reduce modality