服务器之家:专注于VPS、云服务器配置技术及软件下载分享
分类导航

PHP教程|ASP.NET教程|Java教程|ASP教程|编程技术|正则表达式|C/C++|IOS|C#|Swift|Android|VB|R语言|JavaScript|易语言|vb.net|

服务器之家 - 编程语言 - IOS - 简单好用可任意定制的iOS Popover气泡效果

简单好用可任意定制的iOS Popover气泡效果

2021-04-12 11:00Assuner IOS

Popover(气泡弹出框/弹出式气泡/气泡)是由一个矩形和三角箭头组成的弹出窗口,箭头指向的地方通常是导致Popover弹出的控件或区域。本文通过实例代码给大家介绍了iOS Popover气泡效果,需要的朋友参考下吧

效果图如下所示:

简单好用可任意定制的iOS Popover气泡效果

swift: https://github.com/corin8823/popover oc: https://github.com/assuner-lee/popoverobjc

使用示例

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
pod 'popoverobjc'
#import "asviewcontroller.h"
#import <popoverobjc/aspopover.h>
@interface asviewcontroller ()
@property (weak, nonatomic) iboutlet uibutton *btn;
@property (nonatomic, strong) aspopover *btnpopover;
@property (nonatomic, strong) aspopover *itempopover;
@end
@implementation asviewcontroller
- (void)viewdidload {
 [super viewdidload];
 [self.btn addtarget:self action:@selector(clickbtn:) forcontrolevents:uicontroleventtouchupinside];
 self.navigationitem.rightbarbuttonitem = [[uibarbuttonitem alloc] initwithtitle:@"item" style:uibarbuttonitemstyleplain target:self action:@selector(clickitem:)];
}
- (void)didreceivememorywarning {
}

初始化popover

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
- (aspopover *)btnpopover {
 if (!_btnpopover) {
 aspopoveroption *option = [[aspopoveroption alloc] init];
 option.popovertype = aspopovertypeup;
 option.autoajustdirection = no;
 option.arrowsize = cgsizemake(9, 6);
 option.blackoverlaycolor = [uicolor clearcolor];
 option.popovercolor = [uicolor lightgraycolor];
 option.dismissonblackoverlaytap = yes;
 option.animationin = 0.5;
 //...
 _btnpopover = [[aspopover alloc] initwithoption:option];
 }
 return _btnpopover;
}
- (aspopover *)itempopover {
 if (!_itempopover) {
 aspopoveroption *option = [[aspopoveroption alloc] init];
 option.autoajustdirection = no;
 option.arrowsize = cgsizemake(10, 6);
 option.blackoverlaycolor = [uicolor clearcolor];
 option.sideedge = 7;
 option.dismissonblackoverlaytap = yes;
 option.popovercolor = [[uicolor blackcolor] colorwithalphacomponent:0.7];
 option.autoajustdirection = yes;
 option.animationin = 0.4;
 option.springdamping = 0.5;
 option.initialspringvelocity = 1;
 option.overlayblur = [uiblureffect effectwithstyle:uiblureffectstylelight];
 //...
 _itempopover = [[aspopover alloc] initwithoption:option];
 }
 return _itempopover;
}

popover的属性可在option里设置。

弹出气泡

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
- (void)clickbtn:(id)sender {
 uiview *view = [[uiview alloc] initwithframe:cgrectmake(0, 0, [uiscreen mainscreen].bounds.size.width - 50, 40)];
 [self.btnpopover show:view fromview:self.btn]; // in delegate window
}
- (void)clickitem:(id)sender {
 uiview *view = [[uiview alloc] initwithframe:cgrectmake(0, 0, 100, 200)];
 uiview *itemview = [self.navigationitem.rightbarbuttonitem valueforkey:@"view"]; // you should use custom view in item;
 if (itemview) {
// [self.itempopover show:view fromview:itemview];
 cgpoint originpoint = [self.itempopover originarrowpointwithview:view fromview:itemview];
 originpoint.y += 5;
 [self.itempopover show:view atpoint:originpoint];
 }
}
@end

可在某一个视图或某一个point上弹出内容view

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
popover interface
#import <uikit/uikit.h>
#import "aspopoveroption.h"
typedef void (^aspopoverblock)(void);
@interface aspopover : uiview
@property (nonatomic, copy) aspopoverblock willshowhandler;
@property (nonatomic, copy) aspopoverblock willdismisshandler;
@property (nonatomic, copy) aspopoverblock didshowhandler;
@property (nonatomic, copy) aspopoverblock diddismisshandler;
@property (nonatomic, strong) aspopoveroption *option;
- (instancetype)initwithoption:(aspopoveroption *)option;
- (void)dismiss;
- (void)show:(uiview *)contentview fromview:(uiview *)fromview;
- (void)show:(uiview *)contentview fromview:(uiview *)fromview inview:(uiview *)inview;
- (void)show:(uiview *)contentview atpoint:(cgpoint)point;
- (void)show:(uiview *)contentview atpoint:(cgpoint)point inview:(uiview *)inview;
- (cgpoint)originarrowpointwithview:(uiview *)contentview fromview:(uiview *)fromview;
- (cgpoint)arrowpointwithview:(uiview *)contentview fromview:(uiview *)fromview inview:(uiview *)inview popovertype:(aspopovertype)type;
@end

contentview: 要显示的内容; fromview: 气泡从某一个视图上show; inview: 气泡绘制在某一个视图上,一般为delegate window; atpoint: 气泡从某一点上show; 可先获取originpoint, 偏移;

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
popoveroption interface
typedef ns_enum(nsinteger, aspopovertype) {
 aspopovertypeup = 0,
 aspopovertypedown,
};
@interface aspopoveroption : nsobject
@property (nonatomic, assign) cgsize arrowsize;
@property (nonatomic, assign) nstimeinterval animationin; // if 0, no animation
@property (nonatomic, assign) nstimeinterval animationout;
@property (nonatomic, assign) cgfloat cornerradius;
@property (nonatomic, assign) cgfloat sideedge;
@property (nonatomic, strong) uicolor *blackoverlaycolor;
@property (nonatomic, strong) uiblureffect *overlayblur;
@property (nonatomic, strong) uicolor *popovercolor;
@property (nonatomic, assign) bool dismissonblackoverlaytap;
@property (nonatomic, assign) bool showblackoverlay;
@property (nonatomic, assign) cgfloat springdamping;
@property (nonatomic, assign) cgfloat initialspringvelocity;
@property (nonatomic, assign) aspopovertype popovertype;
@property (nonatomic, assign) bool highlightfromview;
@property (nonatomic, assign) cgfloat highlightcornerradius;
@property (nonatomic, assign) bool autoajustdirection; // down preferred, effect just in view not at point
@end

总结

以上所述是小编给大家介绍的简单好用可任意定制的ios popover气泡效果,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对服务器之家的支持!

原文链接:https://juejin.im/post/5a30902c5188253e2470f4f7?utm_source=tuicool&utm_medium=referral

延伸 · 阅读

精彩推荐
  • IOS谈一谈iOS单例模式

    谈一谈iOS单例模式

    这篇文章主要和大家谈一谈iOS中的单例模式,单例模式是一种常用的软件设计模式,想要深入了解iOS单例模式的朋友可以参考一下...

    彭盛凇11872021-01-19
  • IOSiOS APP实现微信H5支付示例总结

    iOS APP实现微信H5支付示例总结

    这篇文章主要介绍了iOS APP实现微信H5支付示例总结,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下...

    一张小A11332021-06-01
  • IOSxcode8提交ipa失败无法构建版本问题的解决方案

    xcode8提交ipa失败无法构建版本问题的解决方案

    xcode升级到xcode8后发现构建不了新的版本。怎么解决呢?下面小编给大家带来了xcode8提交ipa失败无法构建版本问题的解决方案,非常不错,一起看看吧...

    Cinna丶7542021-02-03
  • IOSiOS常见的几个修饰词深入讲解

    iOS常见的几个修饰词深入讲解

    这篇文章主要给大家介绍了关于iOS常见的几个修饰词的相关资料,iOS修饰词包括assign、weak、strong、retain、copy、nonatomic、atomic、readonly、readwrite,文中通过示...

    郡王丶千夜7422021-05-10
  • IOSiOS逆向教程之logify跟踪方法的调用

    iOS逆向教程之logify跟踪方法的调用

    这篇文章主要给大家介绍了关于iOS逆向教程之logify跟踪方法调用的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学...

    Mr.Guo11472021-04-28
  • IOSIOS网络请求之AFNetWorking 3.x 使用详情

    IOS网络请求之AFNetWorking 3.x 使用详情

    本篇文章主要介绍了IOS网络请求之AFNetWorking 3.x 使用详情,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧...

    总李写代码6892021-03-04
  • IOSiOS中时间与时间戳的相互转化实例代码

    iOS中时间与时间戳的相互转化实例代码

    这篇文章主要介绍了iOS中时间与时间戳的相互转化实例代码,非常具有实用价值,需要的朋友可以参考下。...

    张无忌!4812021-03-09
  • IOSiOS10 Xcode8适配7个常见问题汇总

    iOS10 Xcode8适配7个常见问题汇总

    这篇文章主要为大家详细汇总了iOS10 Xcode8适配7个常见问题,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...

    索马里猫10332021-02-01