UIMenuを使ってメニュー画面を表示

#今回の内容

• UIMenu()でボタンを押したときに、メニューを表示出来る様にする。

#コードと簡単解説

##.displayInline

• displayInlineMenuButton.menuにUIMenu()を設定することで、UIMenu(children: [UIMenuElement])に設定しているUIMenu()を表示する値として追加します。

• UIMenu(options: .displayInline)は表示するUIAction()をUIButton()を押した時に全て表示します。

• UIMenu()を表示するには.showsMenuAsPrimaryActionをtrueで設定します。

    override func viewDidLoad() {
        super.viewDidLoad()

        let displayInlineMenuButton = {() -> UIButton in
            
            let button = UIButton(frame: CGRect(x: view.frame.maxX / 4, y: view.frame.maxY / 10, width: view.frame.width / 2, height: view.frame.height / 20))
            button.setTitle("displayInlineMenu", for: .normal)
            button.titleLabel?.textColor = .black
            button.backgroundColor = .systemGreen
            button.showsMenuAsPrimaryAction = true
            return button
        }()
        view.addSubview(displayInlineMenuButton)
        
        displayInlineMenuButton.menu = UIMenu(title:"displayInlineMenu",children: [
            
            UIMenu(title: "", options: .displayInline, children: [
                
                UIAction(title:"displayInlineMenu01",handler: { _ in
                    print("displayInlineMenu01が押されました")
                }),
                UIAction(title:"displayInlineMenu02",handler: { _ in
                    print("displayInlineMenu02が押されました")
                }),
                UIAction(title:"displayInlineMenu03",handler: { _ in
                    print("displayInlineMenu03が押されました")
                }),
                UIAction(title:"displayInlineMenu04",handler: { _ in
                    print("displayInlineMenu04が押されました")
                }),
                UIAction(title:"displayInlineMenu05",handler: { _ in
                    print("displayInlineMenu05が押されました")
                })
            ])
        ])
    }

##.destructive

• destructiveMenuButton.menuにUIMenu()を設定することで、UIMenu(children: [UIMenuElement])に設定しているUIMenu()を表示する値として追加します。

• UIMenu(title: "destructiveMenu", options: .destructive)でUIMenu()を設定した時、UIAction()を全て表示する為のメニューが追加されます。追加されたメニューを押すと全てのUIAction()が表示されます。

• UIMenu()を表示するには.showsMenuAsPrimaryActionをtrueで設定します。

    override func viewDidLoad() {
        super.viewDidLoad()

        let destructiveMenuButton = {() -> UIButton in
            
            let button = UIButton(frame: CGRect(x: view.frame.maxX / 4, y: view.frame.maxY / 5, width: view.frame.width / 2, height: view.frame.height / 20))
            button.setTitle("destructiveMenu", for: .normal)
            button.titleLabel?.textColor = .black
            button.backgroundColor = .systemBlue
            button.showsMenuAsPrimaryAction = true
            return button
        }()
        view.addSubview(destructiveMenuButton)
        
        destructiveMenuButton.menu = UIMenu(title:"destructiveMenu",children: [
            
            UIMenu(title: "destructiveMenu", options: .destructive, children: [
                
                UIAction(title:"destructiveMenu01",handler: { _ in
                    print("destructiveMenu01が押されました")
                }),
                UIAction(title:"destructiveMenu02",handler: { _ in
                    print("destructiveMenu02が押されました")
                }),
                UIAction(title:"destructiveMenu03",handler: { _ in
                    print("destructiveMenu03が押されました")
                }),
                UIAction(title:"destructiveMenu04",handler: { _ in
                    print("destructiveMenu04が押されました")
                }),
                UIAction(title:"destructiveMenu05",handler: { _ in
                    print("destructiveMenu05が押されました")
                })
            ])
        ])
    }

##.displayInlineと.destructiveを同時に表示

    override func viewDidLoad() {
        super.viewDidLoad()

        let displayInlineAnddestructiveMenuButton = {() -> UIButton in
            
            let button = UIButton(frame: CGRect(x: view.frame.maxX / 4, y: view.frame.maxY / 3.3, width: view.frame.width / 2, height: view.frame.height / 20))
            button.setTitle("displayInlineAnddestructiveMenu", for: .normal)
            button.titleLabel?.adjustsFontSizeToFitWidth = true
            button.titleLabel?.textColor = .black
            button.backgroundColor = .systemRed
            button.showsMenuAsPrimaryAction = true
            return button
        }()
        view.addSubview(displayInlineAnddestructiveMenuButton)
        
        displayInlineAnddestructiveMenuButton.menu = UIMenu(title:"displayInlineMenu",children: [
            
            UIMenu(title: "", options: .displayInline, children: [
                
                UIAction(title:"displayInlineMenu01",handler: { _ in
                    print("displayInlineMenu01が押されました")
                }),
                UIAction(title:"displayInlineMenu02",handler: { _ in
                    print("displayInlineMenu02が押されました")
                }),
                UIAction(title:"displayInlineMenu03",handler: { _ in
                    print("displayInlineMenu03が押されました")
                }),
                UIAction(title:"displayInlineMenu04",handler: { _ in
                    print("displayInlineMenu04が押されました")
                }),
                UIAction(title:"displayInlineMenu05",handler: { _ in
                    print("displayInlineMenu05が押されました")
                })
            ]),
            UIMenu(title: "destructiveMenu", options: .destructive, children: [
                
                UIAction(title:"destructiveMenu01",handler: { _ in
                    print("destructiveMenu01が押されました")
                }),
                UIAction(title:"destructiveMenu02",handler: { _ in
                    print("destructiveMenu02が押されました")
                }),
                UIAction(title:"destructiveMenu03",handler: { _ in
                    print("destructiveMenu03が押されました")
                }),
                UIAction(title:"destructiveMenu04",handler: { _ in
                    print("destructiveMenu04が押されました")
                }),
                UIAction(title:"destructiveMenu05",handler: { _ in
                    print("destructiveMenu05が押されました")
                })
            ])
            
        ])
    }

終わり

ご指摘、ご質問などありましたら、コメントまでお願い致します。