iOS實現自定義的彈出視圖（popView）

前段時間，在項目中有個需求是支付完成后，彈出紅包，實現這么一個發紅包的功能。做了最后，實現的效果大致如下：

效果圖

一、使用方法

整個ViewController的代碼大致如下

//
//  SecondViewController.m
//  HWPopTool
//
//  Created by HenryCheng on 16/1/11.
//  Copyright ?（版權符號） 2016年 www.igancao.com. All rights reserved.
//

#import "SecondViewController.h"
#import "HWPopTool.h"

@interface SecondViewController ()

@property (strong, nonatomic) UIView *contentView;

@end

@implementation SecondViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    self.view.backgroundColor = [UIColor whiteColor];

    _contentView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 200, 300)];
    _contentView.backgroundColor = [UIColor clearColor];

    UIButton *btn = [UIButton buttonWithType:UIButtonTypeCustom];
    btn.frame = CGRectMake(100, 200, 100, 50);
    btn.backgroundColor = [UIColor greenColor];
    [btn addTarget:self action:@selector(popViewShow) forControlEvents:UIControlEventTouchUpInside];
    [self.view addSubview:btn];
}

- (void)popViewShow {
    UIImageView *imageV = [[UIImageView alloc]initWithFrame:_contentView.bounds];
    imageV.image = [UIImage imageNamed:@"jei"];
    [_contentView addSubview:imageV];

    [HWPopTool sharedInstance].shadeBackgroundType = ShadeBackgroundTypeSolid;
    [HWPopTool sharedInstance].closeButtonType = ButtonPositionTypeRight;
    [[HWPopTool sharedInstance] showWithPresentView:_contentView animated:YES];
}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

@end

我們引入了HWPopTool.h，并且創建了一個button，點擊button的方法是popViewShow，我們來看一下這里面的代碼：

- (void)popViewShow {
    UIImageView *imageV = [[UIImageView alloc]initWithFrame:_contentView.bounds];
    imageV.image = [UIImage imageNamed:@"jei"];
    [_contentView addSubview:imageV];

    [HWPopTool sharedInstance].shadeBackgroundType = ShadeBackgroundTypeSolid;
    [HWPopTool sharedInstance].closeButtonType = ButtonPositionTypeRight;
    [[HWPopTool sharedInstance] showWithPresentView:_contentView animated:YES];

}

這里在_contentView上放了一個imageView，然后我們設置了shadeBackgroundType和closeButtonType以后，下面一句代碼就是展示出來popView。這里主要就是我們彈出一個view，至于這個view多大，上面放什么，都是由你自己決定的。

二、關于HWPopTool里面的一些屬性和方法

先來看一下HWPopTool.h

//
//  HWPopTool.h
//  HWPopTool
//
//  Created by HenryCheng on 16/1/11.
//  Copyright ？（版權符號） 2016年 www.igancao.com. All rights reserved.
//

#import [Foundation/Foundation.h]（因識別問題，此處將尖括號改為方括號）
#import [UIKit/UIKit.h]（因識別問題，此處將尖括號改為方括號）
/**
 *  關閉按鈕的位置
 */
typedef NS_ENUM(NSInteger, ButtonPositionType) {
    /**
     *  無
     */
    ButtonPositionTypeNone = 0,
    /**
     *  左上角
     */
    ButtonPositionTypeLeft = 1 << 0,
    /**
     *  右上角
     */
    ButtonPositionTypeRight = 2 << 0
};
/**
 *  蒙板的背景色
 */
typedef NS_ENUM(NSInteger, ShadeBackgroundType) {
    /**
     *  漸變色
     */
    ShadeBackgroundTypeGradient = 0,
    /**
     *  固定色
     */
    ShadeBackgroundTypeSolid = 1 << 0
};

typedef void(^completeBlock)(void);

@interface HWPopTool : NSObject

@property (strong, nonatomic) UIColor *popBackgroudColor;//彈出視圖的背景色
@property (assign, nonatomic) BOOL tapOutsideToDismiss;//點擊蒙板是否彈出視圖消失
@property (assign, nonatomic) ButtonPositionType closeButtonType;//關閉按鈕的類型
@property (assign, nonatomic) ShadeBackgroundType shadeBackgroundType;//蒙板的背景色

/**
 *  創建一個實例
 *
 *  @return CHWPopTool
 */
+ (HWPopTool *)sharedInstance;
/**
 *  彈出要展示的View
 *
 *  @param presentView show View
 *  @param animated    是否動畫
 */
- (void)showWithPresentView:(UIView *)presentView animated:(BOOL)animated;
/**
 *  關閉彈出視圖
 *
 *  @param complete complete block
 */
- (void)closeWithBlcok:(void(^)())complete;

@end

由于之前寫的比較倉促，今天趁著空余時間又把代碼整理了一遍，比如關閉之后的回調，之前用delegate實現的，今天又用block重新寫的，簡潔一點吧，另外基本上所有的方法、屬性、枚舉我都有注釋，算是個個人習慣吧。這里面有幾點需要說明的是：

1.ShadeBackgroundType是蒙板的背景色屬性，有固定的和漸變的（ShadeBackgroundTypeGradient），關于這個漸變，有興趣的可以研究一下CAGradientLayer，還是很有趣的，在后來的文章中也會說到。

2.tapOutsideToDismiss這個是設置點擊蒙板，popView消失不消失的屬性，默認的是YES

3.- (void)closeWithBlcok:(void(^)())complete這個方法，是關閉后的回調，比如說發送紅包以后，等popView消失以后回到上一頁的這種。

由于注釋的基本都很清楚了，這里就不多說了，

三、最后

我一般寫博客的時候，貼代碼喜歡貼全部的代碼，我認為這樣會直觀一點（當然非常多的除外），最后，所有的代碼demo都可以在 這里 看到！