
This video is only available to subscribers. Start a subscription today to get access to this and 484 other videos.
Nested / Inline Menus
This episode is part of a series: Working with Context Menus.
1. Basic Context Menus 12 min |
2. Nested / Inline Menus 5 min |
3. Table View Menus 8 min |
4. Context Menu Previews 8 min |
It might be interesting for us to have some pre-selected avatars to use. I've added a few avatars to the project and now I wanted to make a nested menu to display them for selection.
private func chooseExistingAvatarMenu() -> UIMenu {
let avatars = ["ted", "gambit", "ficsit"]
let avatarMenuItems = avatars.map { avatar -> UIAction in
let image = UIImage(named: avatar)
return UIAction(title: avatar.capitalized, image: image) { _ in
self.avatarImageView.image = image
}
}
return UIMenu(title: "Choose from existing...", image: nil,
identifier: nil, options: [], children: avatarMenuItems)
}
Here we have a dynamic UIMenu
we're building. How can we use it? Well it turns out that UIMenu
conforms to UIMenuElement
so we can use it as a child of another menu.
Let's go back to our main context menu and add this new menu as a child.
return UIMenu(title: "Avatar", children: [
addAvatarAction,
self.chooseExistingAvatarMenu(),
removeAvatarAction
])
If we tap "Choose from existing…" we'll see the submenu.
And choosing one of the avatars will update the image view. Neat!
In this case we have a short list of avatars to choose from. In this case it might be nice to show this menu inline. Let's change the options of the submenu to include .displayInline
:
return UIMenu(title: "Choose from existing...", image: nil, identifier: nil,
options: [.displayInline], children: avatarMenuItems)
Now we can see the nested menu line with the initial context menu: