iOS實現自定義的彈出視圖(popView)

jedi 8年前發布 | 32K 次閱讀 iOS開發 Objective-C開發

來自: http://www.cocoachina.com/ios/20160303/15495.html

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

效果圖

一、使用方法

整個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</pre>

我們引入了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];

}</pre>

這里在_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</pre>

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

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

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

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

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

三、最后

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

</div>

 本文由用戶 jedi 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。
 轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!