-
Build for iPad
Learn how to improve iPad apps to leverage the increased screen size and additional features of iPadOS, and help people accomplish more with their devices. Discover how you can build detailed multi-column layouts and integrate lists into your app with little adjustment to your existing code. We'll also explore reducing modality within your views to make it easier to navigate your interface with fewer taps and touches.
To get the most out of this session, you should have a general understanding of iPad app layouts and UIKit. For more information, watch “Making Apps Adaptive, Part 1.” And while not necessary, familiarity with UICollectionView may also be helpful. Watch “Advances in Collection View Layout” for an overview.
Want to learn more about list creation for your apps? Watch “Lists in UICollectionView”.Ressources
Vidéos connexes
WWDC20
WWDC19
-
Rechercher dans cette vidéo…
-
-
1:57 - Create two column UISplitViewController
let splitViewController = UISplitViewController(style: .doubleColumn) -
2:13 - Set view controllers for primary and secondary columns
splitViewController.setViewController(sidebarViewController, for: .primary) splitViewController.setViewController(myHomeViewController, for: .secondary) -
2:28 - Create three column UISplitViewController
let splitViewController = UISplitViewController(style: .tripleColumn) -
2:29 - Set view controller for supplementary column
splitViewController.setViewController(inboxViewController, for: .supplementary) -
4:02 - Set view controller for compact column
splitViewController.setViewController(tabBarController, for: .compact) -
5:29 - Set preferredSplitBehavior to .tile
splitViewController.preferredSplitBehavior = .tile -
5:44 - Set preferredSplitBehavior to .displace
splitViewController.preferredSplitBehavior = .displace -
5:51 - Set preferredSplitBehavior to .overlay
splitViewController.preferredSplitBehavior = .overlay -
5:56 - Hide and show columns
splitViewController.hideColumn(.primary) splitViewController.showColumn(.supplementary) -
6:08 - Set preferredDisplayMode
splitViewController.preferredDisplayMode = .oneBesideSecondary -
8:06 - Collection view setup for sidebar list
let configuration = UICollectionLayoutListConfiguration(appearance: .sidebar) let layout = UICollectionViewCompositionalLayout.list(using: configuration) let collectionView = UICollectionView(frame: frame, collectionViewLayout: layout) -
8:38 - Define a type for an example data structure
struct MyItem: Hashable { let title: String let image: UIImage } -
9:36 - Create cell registration
let cellRegistration = UICollectionView.CellRegistration<UICollectionViewListCell, MyItem> { cell, indexPath, item in var content = cell.defaultContentConfiguration() content.text = item.title content.image = item.image cell.contentConfiguration = content } -
10:31 - Create diffable data source
let dataSource = UICollectionViewDiffableDataSource<Section, MyItem> (collectionView: collectionView) { collectionView, indexPath, item in return collectionView.dequeueConfiguredReusableCell(using: cellRegistration, for: indexPath, item: item) } -
11:29 - Collection view setup for sidebar plain list
let configuration = UICollectionLayoutListConfiguration(appearance: .sidebarPlain) let layout = UICollectionViewCompositionalLayout.list(using: configuration) let collectionView = UICollectionView(frame: frame, collectionViewLayout: layout) -
15:35 - Example: Initializing UISplitViewController
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) } -
17:50 - Example: Setting a view controller for compact width
let tabBarController = createTabBarController() splitViewController.setViewController(tabBarController, for: .compact) -
20:39 - Example: Sidebar Collection View setup
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) } -
21:13 - Example: Cell Registration
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) } -
21:48 - Example: Cell registration
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 }
-