web-dev-qa-db-ja.com

iPhoneでUIViewControllerをポップアップとして表示する

このよくある繰り返しの質問に対する完全で決定的な答えはないので、ここで尋ねて答えます

多くの場合、下の図のように、全画面をカバーしないようにUIViewControllerを提示する必要があります。

enter image description here

Appleは、UIViewController、TwitterまたはFacebookの共有View Controllerなど、いくつかの同様のUIAlertViewを提供しています。

カスタムコントローラーでこの効果を実現するにはどうすればよいですか?

74
CRDave

注:このソリューションはiOS 8で壊れています。新しいソリューションをできるだけ早く投稿します。

ストーリーボードを使用してここで回答しますが、ストーリーボードなしでも可能です。

  1. Init:ストーリーボードに2つのUIViewControllerを作成します。

    • FirstViewControllerが正常で、SecondViewControllerがポップアップになります。
  2. モーダルセグエ:FirstViewControllerにUIButtonを配置し、モーダルセグエとしてこのUIButtonからSecondViewControllerにセグエを作成します。

  3. 透明にする:ここで、UIViewUIViewUIViewControllerでデフォルトで作成されるSecondViewController)を選択し、背景色をクリア色に変更します。

  4. 背景を暗くする:UIImageViewSecondViewControllerを追加します。これは画面全体をカバーし、その画像をいくつかの薄暗い半透明の画像に設定します。ここからサンプルを入手できます。 UIAlertView Background Image

  5. 表示デザイン:ここでUIViewを追加し、表示したい任意の種類のデザインを作成します。これがストーリーボードのスクリーンショットです storyboard

    • ここで、ログインボタンにセグエを追加して、SecondViewControllerをポップアップとして開き、ユーザー名とパスワードを尋ねます。
  6. 重要:さて、その主なステップ。 SecondViewControllerがFirstViewControllerを完全に隠さないことを望みます。明確な色を設定しましたが、これでは十分ではありません。デフォルトでは、モデル表示の背後に黒が追加されるため、FirstViewControllerのviewDidLoadにコードを1行追加する必要があります。別の場所でも追加できますが、セグエの前に実行する必要があります。

    [self setModalPresentationStyle:UIModalPresentationCurrentContext];

  7. 却下:却下するタイミングはユースケースによって異なります。これはモーダルプレゼンテーションであるため、却下するためにモーダルプレゼンテーションに対して行うことを行います。

    [self dismissViewControllerAnimated:YES completion:Nil];

それで全部です.....

あらゆる種類の提案やコメントを歓迎します。

デモ:ここからデモソースプロジェクトを入手できます: Popup Demo

NEW:誰かがこのコンセプトで非常に素晴らしい仕事をした: MZFormSheetController
New:この種の関数を取得するためのコードがもう1つ見つかりました: KLCPopup


iOS 8 Update:iOS 7とiOS 8の両方で動作するようにこのメソッドを作成しました

+ (void)setPresentationStyleForSelfController:(UIViewController *)selfController presentingController:(UIViewController *)presentingController
{
    if (iOSVersion >= 8.0)
    {
        presentingController.providesPresentationContextTransitionStyle = YES;
        presentingController.definesPresentationContext = YES;

        [presentingController setModalPresentationStyle:UIModalPresentationOverCurrentContext];
    }
    else
    {
        [selfController setModalPresentationStyle:UIModalPresentationCurrentContext];
        [selfController.navigationController setModalPresentationStyle:UIModalPresentationCurrentContext];
    }
}

このようにprepareForSegueデリゲート内でこのメソッドを使用できます

- (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender {

    PopUpViewController *popup = segue.destinationViewController;
    [self setPresentationStyleForSelfController:self presentingController:popup]
}
94
CRDave

Interface Builderのモーダルポップアップ(ストーリーボード)

ステップ1

モーダルポップアップとして使用するViewControllerで、ルートUIViewの背景色を明確にします。 Set Clear Color on root view ヒント:ルートUIViewをポップアップとして使用しないでください。ポップアップとして小さくする新しいUIViewを追加します。

ステップ2

ポップアップがあるViewControllerにセグエを作成します。 「現在のモーダル」を選択します。 Segue

ここからポップアップを作成する2つの方法

方法1-セグエの使用

セグエを選択し、プレゼンテーションを「Over Current Context」に変更します。 Over Current Context

方法2-View Controllerを使用する

ポップアップであるViewControllerシーンを選択します。 [属性インスペクター]の[ビューコントローラー]セクションで、プレゼンテーションを[現在のコンテキストを超えて]に設定します。 ViewController

どちらの方法でも機能します。これでうまくいくはずです!

Finished Product

46
Mark Moeykens

Interface Builderでこれを行うことができます。

  • モーダルに表示したいビューの最も外側のビューの背景を透明に設定します
  • Control +クリックして、ホストView ControllerからモーダルView Controllerにドラッグします
  • 現在のモーダルを選択
  • 新しく作成されたセグエをクリックし、属性インスペクター(右側)で「プレゼンテーション」を「現在のコンテキスト上」に設定します
13
Sig

フォームシートコントローラーを自由に使用してください MZFormSheetController iPhoneの場合、サンプルプロジェクトには、フルウィンドウをカバーせず、多くのプレゼンテーション/遷移スタイルを持つモーダルビューコントローラーを提示する方法に関する多くの例があります。

MZFormSheetPresentationController と呼ばれるMZFormSheetControllerの最新バージョンを試して、さらに多くの機能を使用することもできます。

10
mientus

EzPopupを使用できます( https://github.com/huynguyencong/EzPopup )。これはSwiftポッドであり、非常に使いやすいです。

// init YourViewController
let contentVC = ...

// Init popup view controller with content is your content view controller
let popupVC = PopupViewController(contentController: contentVC, popupWidth: 100, popupHeight: 200)

// show it by call present(_ , animated:) method from a current UIViewController
present(popupVC, animated: true)
2
huync

ImaoがUIImageViewをバックグラウンドに配置するのは最良のアイデアではありません。私の場合、私はコントローラービューに他の2つのビューを追加しました。最初のビューは背景に[UIColor clearColor]があり、2番目は透明にしたい色(私の場合は灰色)です。順序が重要であることに注意してください。 prepareForSegueの行にこれを追加しました

infoVC.providesPresentationContextTransitionStyle = YES;
infoVC.definesPresentationContext = YES;

そして、それだけです。

1
Bohdan Savych

スイフト4:

オーバーレイまたはポップアップビューを追加するには、Container Viewを使用して、無料のView Controllerを取得することもできます(Container Viewは通常のオブジェクトパレット/ライブラリ)

enter image description here

手順:

  1. コンテナビューのコンテンツが表示されたときに暗くするために、このコンテナビューを保持するビュー(写真ではViewForContainer)を用意します。最初のView Controller内のコンセントを接続します

  2. 最初のVCロード時にこのビューを非表示

  3. ボタンがクリックされたときに再表示 enter image description here

  4. コンテナビューのコンテンツが表示されているときにこのビューを暗くするには、ビューの背景を黒に、不透明度を30%に設定します

enter image description here

ボタンをクリックすると、この効果が得られます enter image description here

1
Naishta

これを行うと、View Controllerに他のサブビューを追加できます。最初に、サブビューとして追加するViewControllerのステータスバーを[なし]に設定して、必要なサイズに変更できるようにします。次に、Present Viewコントローラーにボタンを作成し、ボタンをクリックするためのメソッドを作成します。メソッド内:

- (IBAction)btnLogin:(id)sender {
    SubView *sub = [[SubView alloc] initWithNibName:@"SubView" bundle:nil];
    sub.view.frame = CGRectMake(20, 100, sub.view.frame.size.width, sub.view.frame.size.height);
    [self.view addSubview:sub.view];
}

これがお役に立てば幸いです、何か質問があればお気軽に...

1
User-1070892