web-dev-qa-db-ja.com

iPadポップオーバーのようなiPhoneポップアップメニュー?

IPadのポップオーバーのように、iPhoneアプリでこのポップアップメニューを実装するにはどうすればよいですか?

alt text


[〜#〜] edit [〜#〜]:これは現時点で最高です: https://github.com/runway20/PopoverView enter image description here

34
elp

IPhone UIPopoverControllerの実装をご覧ください。 WEPopover

22
olfuerniss

iOS 8以降

IOS 8以降では、iPadに加えてiPhoneでも UIPopoverPresentationController を使用できます。

enter image description here

セットアップ

  • UIBarButtonItemをメインView Controllerに追加します。
  • 別のView Controllerをストーリーボードに追加します。ポップオーバーのサイズに変更し、必要なコンテンツを追加します。私の例では、UILabelを追加しました。メニュー全体が必要な場合は、テーブルビューまたはボタンのリストを追加するだけです。
  • セグエをバーボタンアイテムからポップオーバーとして使用するView Controllerに追加します。 showではなく、Present as Popover

enter image description here

  • ストーリーボードでセグエを選択し、識別子をpopoverSegue(またはコードで呼び出した文字列)に設定します。

enter image description here

  • Popover View ControllerのAttributesインスペクターで、Use Preferred Explicit Sizeをチェックして、希望するサイズであることを確認します。

enter image description here

コード

これは、バーボタンアイテムを含むメインビューコントローラーのコードです。

class ViewController: UIViewController, UIPopoverPresentationControllerDelegate {

    override func prepareForSegue(segue: UIStoryboardSegue, sender: AnyObject?) {
        if segue.identifier == "popoverSegue" {

            let popoverViewController = segue.destinationViewController
            popoverViewController.modalPresentationStyle = UIModalPresentationStyle.Popover
            popoverViewController.popoverPresentationController!.delegate = self

        }
    }

    // MARK: - UIPopoverPresentationControllerDelegate method

    func adaptivePresentationStyleForPresentationController(controller: UIPresentationController) -> UIModalPresentationStyle {

        // Force popover style
        return UIModalPresentationStyle.None
    }
}

任意のアンカーポイントでのポップオーバー

ポップオーバーをバーボタン項目以外の場所(たとえばUIButton)に表示するように設定する場合は、sourceViewsourceRectを設定する必要があります。詳細については、 この回答 を参照してください。

enter image description here

参考文献

上記の例は主に最初のリンクからのものです。

29
Suragch

IPhoneでは、通常、そのようなボタンのスタックにUIActionSheetを使用します。ボタンの横にポップアップするのではなく、下からスライドしますが、これはiPhoneの標準的な動作です。

19
Brian

WEPopoverよりも優れているものがあります。 50pixelsという会社によって開発され、FPPopoverと呼ばれています。

FPPopoverはhttps://github.com/50pixels/FPPopoverからダウンロードできます。

7
BigSauce

カスタムの背景画像または透明な図面を使用してUIViewを手動でインスタンス化し、いくつかのUIButton(または他の種類のカスタムビュー)を上部に追加し、そのビューの外側のすべてのタッチを何らかの方法で処理する必要があります。

は非標準UIです。アクションシートは、よりHIGに準拠しています。

5
hotpaw2

WYPopoverControllerを確認できます: https://github.com/sammcewan/WYPopoverController

1
Leszek Szary

Tableview Controllerの一部であるNavigation Controllerの右側のサイドバーボタン項目からポップオーバーを取得するには、Swift 4およびXcode 9。

  1. 上記の Suragch answerの手順に従ってください(コミュニティが編集)。
  2. 上記の回答に示されているようにセグエを実装しないでください。何らかの理由で、セグエにより、明示的なサイズを設定しているにもかかわらず、ポップオーバーがフルスクリーンになります。
  3. 属性インスペクターでポップオーバービューコントローラーにタイトルを付けます
  4. ポップアップが表示されるTableViewコントローラーに次のコードを追加します。
  5. 文字列識別子を変更します(ここでは、Constant.Swiftファイルを参照しています)
  6. 「as!FilterVC」を変更して、ポップオーバービューコントローラーのタイトルを使用します。

    /// Shows a filter popover view
    @IBAction func filterBtnPressed(_ sender: UIBarButtonItem) {
        let popover = storyboard?.instantiateViewController(withIdentifier: FILTER_VC) as! FilterVC
        popover.modalPresentationStyle = UIModalPresentationStyle.popover
        popover.popoverPresentationController?.backgroundColor = UIColor.green
        popover.popoverPresentationController?.delegate = self
        popover.popoverPresentationController?.backgroundColor = ColorPalette.Blue.Medium
        popover.popoverPresentationController?.sourceView = self.view
        popover.popoverPresentationController?.sourceRect = CGRect(x: self.view!.bounds.width, y: 0, width: 0, height: 0)
        popover.popoverPresentationController?.permittedArrowDirections = .up
        self.present(popover, animated: true)
    } }
    
    
    func adaptivePresentationStyle(for controller: UIPresentationController) -> UIModalPresentationStyle {
        return UIModalPresentationStyle.none
    }
    
1
D. Rothschild

上記のスクリーンショットはUIActionSheetではありません。これは、カスタムUIButtonsを上部に持つ単純なUIViewサブクラスのように見えます。したがって、必要に応じてサブクラスを作成し、必要なたびにサブビューとしてビューに追加してください。

0
tux91