本篇是音频播放器的悬浮窗篇,上一篇是播放器主窗口篇
先上效果图:
简单罗列一下需求:
- 窗口与右上角播放器入口互斥
- 窗口在部分页面显示,部分页面不显示
- 上滑消失,下滑隐藏
- 窗口位置居于底部某个控件之上
下边根据这些需求,简单罗列一下我的实现方式,大家在参考的同时也期望能够提出一些建议
- 窗口放在window上,最开始的做的是是放在了tabbar上,但是有一个问题,就是present跳转的时候,窗口就不能浮在最上层,所以tabbar得方案pass掉了。
- 窗口与右上角入口互斥,因为一部分是原生页面,一部分是weex页面,我们并不能都控制到,所以右上角的显示和浮窗完全分开管理,如果浮窗滑动删除了就给右上角管理类发一个通知。
- 窗口部分页面显示隐藏,这里是创建了一个配置文件,包括了不显示的原生页面和非原生页面,hook了viewdidapper 和 viewwillapper,进入到页面的时候先从配置文件中查找当前页面是否显示窗口,这里我写了一个枚举去标记当前页面的状态
- 上滑消失,下滑隐藏,有两种解决方案,
一种是针对屏幕上的滑动时间,进行处理,通过hook sendEvent函数,监听所有的触摸事件。
一种是hook scrollview的setDelegate方法,通过delegate方法,替换掉滑动协议方法。
两种方法各有各的好处,
hook sendEvent方法,可以全app周期能够处理,但是iphone X这种屏幕,上滑的时候可能会误触,当然也可以限制触摸区域去解决,但是之后针对非scrollview页面也有了侵入性,可控性并不是很好。
hook scrollview的setDelegate方法,好处是只针对滚动视图去处理,不好的也显而易见,不能滚动的页面就没办法控制浮条。
//方法一
- (void)swiz_sendEvent:(UIEvent *)event {
[self swiz_sendEvent:event];
NSSet *allTouches = [event allTouches];
if ([allTouches count] > 0){
[((UITouch *)[allTouches anyObject]).gestureRecognizers enumerateObjectsUsingBlock:^(UIGestureRecognizer * _Nonnull obj, NSUInteger idx, BOOL * _Nonnull stop) {
if ([obj isKindOfClass:[UIPanGestureRecognizer class]]) {
DDLogDebug(@"-------%@",obj);
UIPanGestureRecognizer *ges = (UIPanGestureRecognizer *)obj;
CGPoint translation = [ges translationInView:((UITouch *)[allTouches anyObject]).view];
if (translation.y<0) {
//隐藏浮条
}else if(translation.y>0){
//显示浮条
}
*stop = YES;
}
}];
}
}
//方法二:
- (void)hook_setDelegate:(id<UIScrollViewDelegate>)delegate {
[self hook_setDelegate:delegate];
if ([self isKindOfClass:[UIScrollView class]]) {
// NSLog(@"是UIScrollView,hook方法");
SEL sel1 = @selector(scrollViewDidEndDragging:willDecelerate:);
Method originalMethod1 = class_getInstanceMethod([delegate class], sel1);
Hook_Method(GetSelectorInsClass([delegate class],sel1,originalMethod1), sel1, [self class], @selector(p_scrollViewDidEndDragging:willDecelerate:), @selector(add_scrollViewDidEndDragging:willDecelerate:));
SEL sel2 = @selector(scrollViewShouldScrollToTop:);
Method originalMethod2 = class_getInstanceMethod([delegate class],sel2);
Hook_Method(GetSelectorInsClass([delegate class],sel2,originalMethod2), sel2, [self class], @selector(p_scrollViewShouldScrollToTop:), @selector(add_scrollViewShouldScrollToTop:));
} else {
// NSLog(@"不是UIScrollView,不需要hook方法");
}
}
- (void)p_scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate{
[self p_scrollViewDidEndDragging:scrollView willDecelerate:decelerate];
CGPoint translation = [scrollView.panGestureRecognizer translationInView:scrollView.superview];
if (translation.y<0) {
//隐藏浮条
}else if(translation.y>0){
//显示浮条
}
}
- (BOOL)p_scrollViewShouldScrollToTop:(UIScrollView *)scrollView {
[self p_scrollViewShouldScrollToTop:scrollView];
//显示浮条
return YES;
}
- (void)add_scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate{
CGPoint translation = [scrollView.panGestureRecognizer translationInView:scrollView.superview];
if (translation.y<0) {
//隐藏浮条
}else if(translation.y>0){
//显示浮条
}
}
- (BOOL)add_scrollViewShouldScrollToTop:(UIScrollView *)scrollView {
//显示浮条
return YES;
}
- 窗口显示不固定位置这个,现阶段大部分页面的高度都是有规律可循,因为底下有tabbar栏目的并不多,包括四大首页在内一共有7 8个这种页面,这里提供一个方法当页面显示完成时候去改变浮条位置。页面消失时候,又恢复成原来的位置。
最后:
浮条的难点主要是在遇到了html5页面的位置计算,这时候就要拜托web同学去帮忙处理。目前浮条这里的问题,是当音频播放页显示出来的时候,浮条需要先隐藏,下一步如果将音频播放页做成一个view扔在浮条的上层也许就能解决。
不知道你的浮条方案是什么,欢迎在留言区一起讨论。
网友评论