服务器之家

服务器之家 > 正文

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

时间:2021-04-12 11:00     来源/作者:Assuner

效果图如下所示:

简单好用可任意定制的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

标签:

相关文章

热门资讯

2020微信伤感网名听哭了 让对方看到心疼的伤感网名大全
2020微信伤感网名听哭了 让对方看到心疼的伤感网名大全 2019-12-26
yue是什么意思 网络流行语yue了是什么梗
yue是什么意思 网络流行语yue了是什么梗 2020-10-11
背刺什么意思 网络词语背刺是什么梗
背刺什么意思 网络词语背刺是什么梗 2020-05-22
Intellij idea2020永久破解,亲测可用!!!
Intellij idea2020永久破解,亲测可用!!! 2020-07-29
苹果12mini价格表官网报价 iPhone12mini全版本价格汇总
苹果12mini价格表官网报价 iPhone12mini全版本价格汇总 2020-11-13
返回顶部