根据滑动显隐状态栏的iOS实现
之前很多兄弟问如何实现类似于淘宝客户端搜索列表那种动态显隐的效果,这几天刚好有时间,就实现了几个例子搞一下,其实原理很简单,也参考了github上一位兄弟的实现.不多说,上代码
@interface D1ScrollingNaviBarViewController : UIViewController
//滑动隐藏,显示导航栏
-(void)followRollingScrollView:(UIView *)scrollView;
//用来处理导航栏下还有其他内容也需要跟随导航栏一起隐藏,显示的情况,类似于淘宝客户端的搜索
-(void)followRollingScrollView:(UIView *)scrollView secondAreaHeight:(CGFloat)secondAreaHeight;
@end
#define NAVI_BAR_HEIGHT 44.0
@interface D1ScrollingNaviBarViewController ()<UIGestureRecognizerDelegate>
@property (weak, nonatomic) UIView *scrollView;
@property (retain, nonatomic)UIPanGestureRecognizer *panGesture;
@property (retain, nonatomic)UIView *overLay;
@property (assign, nonatomic)BOOL isHidden;
@property(nonatomic,assign)CGFloat secondAreaHeight;
@end @implementation D1ScrollingNaviBarViewController - (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil
{
self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil];
if (self) {
self.secondAreaHeight = 0.0;
}
return self;
} //设置跟随滚动的滑动试图
-(void)followRollingScrollView:(UIView *)scrollView
{
self.scrollView = scrollView; self.panGesture = [[UIPanGestureRecognizer alloc] init];
self.panGesture.delegate=self;
self.panGesture.minimumNumberOfTouches = 1;
[self.panGesture addTarget:self action:@selector(handlePanGesture:)];
[self.scrollView addGestureRecognizer:self.panGesture]; CGRect rect = self.navigationController.navigationBar.bounds;
self.overLay = [[UIView alloc] initWithFrame:rect];
self.overLay.alpha=0;
self.overLay.backgroundColor=self.navigationController.navigationBar.barTintColor;
[self.navigationController.navigationBar addSubview:self.overLay];
[self.navigationController.navigationBar bringSubviewToFront:self.overLay]; }
-(void)followRollingScrollView:(UIView *)scrollView secondAreaHeight:(CGFloat)secondAreaHeight
{
self.secondAreaHeight = secondAreaHeight;
[self followRollingScrollView:scrollView];
}
#pragma mark - 兼容其他手势
-(BOOL)gestureRecognizer:(UIGestureRecognizer *)gestureRecognizer shouldRecognizeSimultaneouslyWithGestureRecognizer:(UIGestureRecognizer *)otherGestureRecognizer
{
return YES;
} #pragma mark - 手势调用函数
-(void)handlePanGesture:(UIPanGestureRecognizer *)panGesture
{
CGPoint translation = [panGesture translationInView:[self.scrollView superview]];
//显示
if (translation.y >= 5) {
if (self.isHidden) { self.overLay.alpha=0;
CGRect navBarFrame = self.navigationController.navigationBar.frame;
CGRect scrollViewFrame=self.scrollView.frame; navBarFrame.origin.y = 20;
scrollViewFrame.origin.y += self.secondAreaHeight+NAVI_BAR_HEIGHT;
scrollViewFrame.size.height -= self.secondAreaHeight+NAVI_BAR_HEIGHT; [UIView animateWithDuration:0.5 animations:^{
self.navigationController.navigationBar.frame = navBarFrame;
self.scrollView.frame=scrollViewFrame;
}];
self.isHidden= NO;
}
}
//隐藏
if (translation.y <= -20) {
if (!self.isHidden) {
CGRect frame =self.navigationController.navigationBar.frame;
CGRect scrollViewFrame=self.scrollView.frame;
frame.origin.y = -24;
scrollViewFrame.origin.y -= self.secondAreaHeight+NAVI_BAR_HEIGHT;
scrollViewFrame.size.height += self.secondAreaHeight+NAVI_BAR_HEIGHT; [UIView animateWithDuration:0.5 animations:^{
self.navigationController.navigationBar.frame = frame;
self.scrollView.frame=scrollViewFrame;
} completion:^(BOOL finished) {
self.overLay.alpha=1;
}];
self.isHidden=YES;
}
} } -(void)viewDidAppear:(BOOL)animated{
[self.navigationController.navigationBar bringSubviewToFront:self.overLay];
}
@end 要使用的类继承这个基类
//设置导航栏的背景色的两种方式
self.navigationController.navigationBar.barTintColor=[UIColor greenColor];//使用颜色 self.navigationController.navigationBar.barTintColor =
[UIColor colorWithPatternImage:[UIImage imageNamed:@"nav_bg_h64"]];//使用图片 //44高度会被自动拉伸,所以需要注意图片的实际效果
self.navigationController.navigationBar.barTintColor =
[UIColor colorWithPatternImage:[UIImage imageNamed:@"navi_bg_h44"]];//使用图片 //使用自动滑动显隐代码,这个50,是指紧挨着导航栏的要跟随显隐的区域的高度,如果没有这个区域,可以调用没有这个参数的接口,一样的
[self followRollingScrollView:self.view secondAreaHeight:50];
根据滑动显隐状态栏的iOS实现的更多相关文章
- C#中显/隐式实现接口及其访问方法
原贴地址: http://www.cnblogs.com/dudu837/archive/2009/12/07/1618663.html 在实现接口的时候,VS提供了两个菜单,一个是"实现接 ...
- NavigationBar的显隐和颜色设置
[self.navigationController setNavigationBarHidden:NO animated:NO]; self.navigationController.navigat ...
- JS/jquery实现鼠标控制页面元素显隐
最近网站要上一个活动广告横幅,当用户鼠标划过时显隐二维码.像这种鼠标事件控制页面元素显隐的情况,码农们会经常遇到,可以通过javascript或jquery代码实现,下面就几种常见需求一起归纳一下. ...
- 盒子显隐,伪类边框,盒子阴影,2d平面形变
-盒子显隐 显隐的盒子尽量不影响其他盒子的布局 display:none; 消失的时候不占位置,显示的时候占位 opacity:0-1; 盒子透明度 overflow: hidden; 超出部分隐藏 ...
- day50 盒子显隐2D形变
复习 1.浮动布局 解决block盒子同行显示 => 不完全脱离文档流 => 不再撑开父级高度 脱离文档流: 不在页面中占位(显示层次高于文档流) 不完全: 可以通过清浮动操作, 让子级重 ...
- Python12/11--盒子的显隐/布局/z-index/流式布局思想
1.盒子的显隐 display:none 在页面中不占位,采用定位布局后,显示隐藏都不会影响其他标签,不需要用动画处理时,一般用这个 opacoity : 0 在页面中占位,采 ...
- jq svg 修改image的xmlns:xlink及图片的显隐
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
- 字体图标,盒子显隐,overflow属性,伪类设计边框,盒子阴影2d形变
字体图标 ''' fa框架: http://fontawesome.dashgame.com/ 下载 => 引入css文件 引入字体图标库 <link rel="styleshe ...
- 浏览器页面的显隐对js的setInterval()执行所产生的bug
前段时间,所写的一个”js无间隙滚动效果“,当页面离开后,重新返回时,会出现动画的错乱.我以为是因为我代码逻辑的原因导致的,但是,当在火狐浏览器上进行浏览时却没有动画错乱的问题. 于是乎,在网上查找是 ...
随机推荐
- java编写一个可以上、下、左、右移动的坦克
唉,本人学习进度缓慢,但依然会坚持不懈!有感兴趣的朋友可以在下面留言. 源代码献上: /* * 画出我的坦克,使他可以上下左右移动 */package com.test4; import javax. ...
- touch穿透
出现穿透的前提:上层绑定touch事件,下层绑定click事件. 解决方案:touchend绑定: e.preventDefault();$(下层).css("pointer-events& ...
- 各种效果的tab选项卡
;(function($){ $.fn.tabso=function( options ){ var opts=$.extend({},$.fn.tabso.defaults,options ); r ...
- python的基础类源码解析——collection类
1.计数器(counter) Counter是对字典类型的补充,用于追踪值的出现次数. ps:具备字典的所有功能 + 自己的功能 ################################### ...
- hive踩过的小坑
上周使用hive做一些操作,几个小问题纠结很久.特此记录下: hive概念 hive是基于Hadoop的一个数据仓库工具,可以将结构化的数据文件映射为一张数据库表,并提供简单的sql查询功能,可以 ...
- CSS选择器和jQuery选择器的区别与联系之一
到底什么是选择器?我们通过常接触的CSS选择器和jQuery选择器理解一下,我们知道CSS是用于分离网页的结构和表现的,也就是说对于一个网页,HTML定义网页的结构,CSS描述网页的样子,一个很经典的 ...
- 向量时钟算法简介——本质类似MVCC
转自:http://blog.chinaunix.net/uid-27105712-id-5612512.html 一.使用背景 先说一下需要用到向量时钟的场景.我们在写数据时候,经常希望数据不要存储 ...
- OC面向对象—封装
OC面向对象—封装 一.面向对象和封装 面向对象的三大特性:封装(成员变量).继承和多态 在OC语言中,使用@interface和@implementation来处理类. @interface就好像暴 ...
- jsp开发知识
1.在JSP中:Java部分是在服务器端执行的:js部分是在客户端的浏览器执行的:二者完全不相干.因此直接在JSP页面上是无法在js.java和HTML变量之间进行调用的. 2.表单 <form ...
- web项目的日志打印位置设置
1, 若在项目中放logback.groovy文件(如: src/test/resource下),则日志会打印到控制台上. logback.groovy 内容如下: // // Built on Fr ...