iOS实现Popover弹窗(类似气泡弹窗)

前言

最近项目有一个需求需要实现一个类似气泡的popover弹窗,就是点击一个按钮的时候在按钮的某一个方向弹出一个视图,这个视图需要带有一个箭头指向。就像下图是简书和微信的样式

简书 系统样式
微信 自定义样式
系统样式UIPopoverPresentationController

系统样式就比较简单了,就是一个UIViewController然后设置modalPresentationStyle属性,要记住实现UIPopoverPresentationControllerDelegate代理的adaptivePresentationStyleForPresentationController方法
具体看代码

- (IBAction)clickpopoverBtn:(id)sender {
    PopViewController *testVC = [[PopViewController alloc] init];
    testVC.preferredContentSize = CGSizeMake(150, 150);
    testVC.modalPresentationStyle = UIModalPresentationPopover;
    testVC.popoverPresentationController.delegate = self;
    testVC.popoverPresentationController.sourceView = self.popoverBtn;
    testVC.popoverPresentationController.permittedArrowDirections = UIPopoverArrowDirectionUp;
    testVC.popoverPresentationController.backgroundColor = [UIColor redColor];
    testVC.popoverPresentationController.canOverlapSourceViewRect = NO;
    [self presentViewController:testVC animated:YES completion:nil];
}

#pragma mark - <UIPopoverPresentationControllerDelegate>
- (UIModalPresentationStyle)adaptivePresentationStyleForPresentationController:(UIPresentationController *)controller {
    return UIModalPresentationNone;
}

popover主动消失,直接调用dismiss就可以了。

- (void)clickBtn:(UIButton *)aBtn {
    [self dismissViewControllerAnimated:YES completion:nil];
}

但是\color{red}{UIPopoverPresentationController}有个的地方需要注意,滑动触摸显示区域以外的区域是不会消失,只有\color{red}{点击}才可以消失。这个点很僵硬,万恶的产品是很难接受的!\color{red}{redd}
还有就是箭头的大小,间距,显示隐藏的动画时间点等都难修改,不过我个人觉得系统自带的控件本身就挺好看的。。。。。

自定义样式

系统自带的不合适就只能自己撸罗。。。


自定义样式Up

自定义样式Left

1.使用了一个三角形的图片做箭头,支持上下左右;
2.显示内容contentView暴露出来是可以添加其他的UIView
3.contentView支持跳转大小等。。。
4.支持显示区域范围的设施,超出范围会自动移动到显示范围内。
5.上下会自动调整,左右会自动调整,不支持设置为Up自动调整为Right。
代码传送门

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容