IOS应用开发12——透明浮窗效果实现

程序中可能经常会用到透明视图提示或输入的效果，如下图所示。







实现上述半透明遮罩的方式有很多，这里简单描述一下其中一种的实现过程。主要有以下几步：

1.创建一背景半透明（alpha=0.5）视图或视图控制器，设置好要显示的内容或控件。

2.在需要调用的地方实例化半透明视图或控制器，添加手势，显示到最上层。

3.手势触发方法实现移除视图功能。

下面简单附上几行代码简要说明下：

1.创建一TestViewController设置背景，属性，等

#import <UIKit/UIKit.h>

@interface TestCoverViewController : UIViewController

@property (nonatomic,strong)UIImageView *coverImgView;

@end

@implementation BaoReportCoverViewController

- (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil{
// 略……
}
- (void)viewDidLoad{
[super viewDidLoad];
}
- (void)viewWillAppear:(BOOL)animated{
[self.view addSubview:_coverImgView];
}
@end

2.调用并显示视图，添加手势等。（这种方式是为了实现功能而实现功能，没有良好的封装性，建议使用者将显示和隐藏封装成显示show方法，隐藏hidden方法，放入TestCoverViewController中）

@interface MainViewController (){

TestCoverViewController *_coverVC;
}

@end

@implementation MainViewController

- (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil{
self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil];
if (self) {
// 显示遮罩层
[self showCoverView];
}
return self;
}

// 显示遮罩层
- (void)showCoverView{
// 判断是否满足条件，满足就显示，此处尚未做判断
if (YES) {
UITapGestureRecognizer *tapCoverViewGesture = [[UITapGestureRecognizer alloc]
initWithTarget:self
action:@selector(hideTipsCover:)];
_coverVC = [[BaoReportCoverViewController alloc] init];
// 设置图片，此处简单的设置一张图片到半透明层上面
_coverVC.coverImgView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"Bpi14"]];
// 设置图片的位置，kScreenHeight、kScreenWidth为屏幕宽高，可自行设定位置
_coverVC.coverImgView.frame = CGRectMake(0,
kScreenHeight-567.0/2-3,
kScreenWidth,
567.0/2);
// 添加手势
[_coverVC.view addGestureRecognizer:tapCoverViewGesture];
// 显示半透明视图
[[UIApplication sharedApplication].keyWindow addSubview:_coverVC.view];
}
}

// 隐藏浮窗层触发操作
- (void)hideTipsCover:(UITapGestureRecognizer *)tap{
// 移除视图
[_coverVC.view removeFromSuperview];

// 其他自行实现逻辑……
}
@end

--------------------------------------------------分割线------------------------------------------------------------

如果需要在半透明视图上设置输入框操作，则可以在视图中添加UITextView和UIButton,设置好相对位置，或者放在一个UIView上面。然后设置键盘出现隐藏通知，得到动态的键盘高度，在键盘事件监听中动态设置半透明层中视图的位置，当半透明页面显示出来的时候设置UITextView为第一响应，即可。简单的代码示例如下：

- (void)viewWillAppear:(BOOL)animated{
[super viewWillAppear:animated];

[[NSNotificationCenter defaultCenter]addObserver:self selector:@selector(keyboardWillShow:) name:UIKeyboardWillShowNotification object:nil];
[[NSNotificationCenter defaultCenter]addObserver:self selector:@selector(keyboardWillHide:) name:UIKeyboardWillHideNotification object:nil];
}
- (void)viewWillDisappear:(BOOL)animated{
[super viewWillDisappear:animated];
[[NSNotificationCenter defaultCenter] removeObserver:self];
}

#pragma mark - 键盘事件
// 键盘出现触发
- (void)keyboardWillShow:(NSNotification*)notification{
NSDictionary*info=[notification userInfo];
CGSize kbSize=[[info objectForKey:UIKeyboardFrameEndUserInfoKey]CGRectValue].size;
// 调整UI位置
if(_addCommentView){
// 如果存在半透明视图，设置视图的位置和高度
self.addCommentView.baseView.frame = CGRectMake(0,kScreenHeight-kbSize.height-kAddCommentBaseViewHeight,kScreenWidth,kAddCommentBaseViewHeight);
}
}
// 键盘隐藏触发
- (void)keyboardWillHide:(NSNotification*)notification{

}

说明：

// 显示半透明视图的方式和上面叙述方式一样，只是添加了一句

[_addCommentView.textView becomeFirstResponder];

// 视图隐藏方法和上面叙述方式一样。