服务器之家

服务器之家 > 正文

IOS实现上滑隐藏NvaigtionBar而下拉则显示效果

时间:2021-01-25 16:01     来源/作者:iOS开发网

先看看原app的效果

IOS实现上滑隐藏NvaigtionBar而下拉则显示效果

实现过程

主要是给view中的滚动视图添加一个kvo来监视它的滑动,再根据它的offset来做一下操作,下面是代码

?
1
[mytableview addobserver:self forkeypath:@"contentoffset" options:nskeyvalueobservingoptionold|nskeyvalueobservingoptionnew context:nil];

获取tableviewcontentoffset 之后再根据具体需求来实现逻辑判断

?
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
-(void)observevalueforkeypath:(nsstring *)keypath ofobject:(id)object change:(nsdictionary<nsstring *,id> *)change context:(void *)context {
 if ([object isequal:mytableview] && [keypath isequaltostring:@"contentoffset"]) {
  //获取新值旧值
  cgfloat newy = [change[@"new"] cgpointvalue].y;
  cgfloat oldy = [change[@"old"] cgpointvalue].y;
  float i = newy - oldy;//下拉是新值小于旧值的,所以i<0 是下拉 i>0 是上滑
   nslog(@"%f",mytableview.contentoffset.y);
  if (mytableview.contentoffset.y > -64 && mytableview.contentoffset.y <= 24) {//边界条件,此处不精确
   if (i <= 0 && _ishide == no && self.navigationcontroller.navigationbar.frame.origin.y == 20){
    //下拉+bar 已经显示的状态,不再移动
    return;
   }
   _ishide = no;
   //设置navigationbar 的frame 使他根据tableview来滑动
   self.navigationcontroller.navigationbar.frame = cgrectmake(0, -44 - mytableview.contentoffset.y, self.view.bounds.size.width, 44);
   //控制透明度
   self.navigationcontroller.navigationbar.alpha = -mytableview.contentoffset.y/64;
  }else if (mytableview.contentoffset.y > 24) {
   if (i > 10) {//更改数值大小可以控制触发 navigation bar 的滑动速度
    _ishide = yes;
   }else if(i < -10) {
    _ishide = no;
   }
  }
  [self.navigationcontroller setnavigationbarhidden:_ishide animated:yes];
 }
}

完成效果图

IOS实现上滑隐藏NvaigtionBar而下拉则显示效果

总结

其实这个效果实现起来确实没有什么难度,写这个主要是给大家看一下我的实现过程与思路,希望可以帮到大家。如果有疑问可以留言交流,谢谢大家对服务器之家的支持。

标签:

相关文章

热门资讯

2020微信伤感网名听哭了 让对方看到心疼的伤感网名大全
2020微信伤感网名听哭了 让对方看到心疼的伤感网名大全 2019-12-26
Intellij idea2020永久破解,亲测可用!!!
Intellij idea2020永久破解,亲测可用!!! 2020-07-29
背刺什么意思 网络词语背刺是什么梗
背刺什么意思 网络词语背刺是什么梗 2020-05-22
苹果12mini价格表官网报价 iPhone12mini全版本价格汇总
苹果12mini价格表官网报价 iPhone12mini全版本价格汇总 2020-11-13
歪歪漫画vip账号共享2020_yy漫画免费账号密码共享
歪歪漫画vip账号共享2020_yy漫画免费账号密码共享 2020-04-07
返回顶部