IOS状态栏和导航栏的控制问题

IOS的项目多数会遇到控制状态栏和导航栏的问题,比如隐藏状态栏、控制状态栏的文字颜色等,导航栏也有同样需求。本文总结一下操作方法。

首先一点,IOS的界面分为状态栏和导航栏,状态栏是指显示电池、时间的最顶部的一个窄条,高度为20个点;而导航栏是紧接着状态栏的44个点高度的横条,一般用于显示app标题,返回按钮等操作按钮。

在ios7之前,状态栏和导航栏是分开的,而从ios7开始状态栏和导航栏交织在一起了,状态栏变为透明,导航栏的高度变为44+20=64:

状态栏控制

对状态栏的控制分两种情况:全局设置和分页面设置。控制这两种模式的开关是info.plist文件的View controller-based status bar appearance配置项。

全局设置状态栏

将info.plist文件的View controller-based status bar appearance设置为NO,即可开启全局设置,也就是说你在VC中对状态栏的控制都将无效,相比之下,是通过下面的代码来全局控制:

//设置状态栏的字体颜色模式

[[UIApplication sharedApplication] setStatusBarStyle:UIStatusBarStyleLightContent];

//设置状态栏是否隐藏

[[UIApplication sharedApplication] setStatusBarHidden:YES];

注意,我们并不能对状态栏的字体颜色做任意的控制,只有两种选择UIStatusBarStyleDefault和UIStatusBarStyleLightContent,前者是默认的黑色,而后者是白色。也就是说如果你的背景色是偏深色,那么设置状态栏的字体颜色为白色。另外,我们可以全局设置状态栏是否显示,但是一般而言app不会对所有界面都不显示状态栏,而是只在特定的页面需要隐藏状态栏,比如对于视频播放界面不希望显示状态栏。

对于状态栏的背景色设置,上面提到从ios7开始状态栏本身实际上是透明的,它的背景色其实取决于导航栏的背景色。下面会讲导航栏的设置。

分页面设置状态栏

将info.plist文件的View controller-based status bar appearance设置为YES,即可开启由VC来控制状态栏的功能,在这种模式下,全局的设置将无效!!所以我们必须逐个页面对状态栏进行设置,否则状态栏将维持默认的黑色字体和默认为显示状态。

字体设置

对于设置状态栏字体颜色,分两种情况:VC是否属于UINavigationController中:

1) 当VC不在UINavigationController中时,在VC中添加一个方法

- (UIStatusBarStyle)preferredStatusBarStyle

{

//返回白色

return UIStatusBarStyleLightContent;

//返回黑色

//return UIStatusBarStyleDefault;

}

保险起见,在view的某个加载阶段比如viewWillAppear中,执行:

[self setNeedsStatusBarAppearanceUpdate];

2) 当VC在UINavigationController中时,VC并不能通过1)的方式控制状态栏的颜色,详见本文后面的参考资料,那么这个时候,有一个trick的方法可以在VC中间接的控制:

self.navigationController.navigationBar.barStyle = UIBarStyleBlack;

隐藏控制

对于控制状态栏的隐藏同样存在VC是否是根控制器的问题,也就说只有根控制器才能直接控制状态栏的显示与否。

1) 如果是VC本身就是根控制器,那么在VC中添加如下代码:

- (BOOL)prefersStatusBarHidden {

return YES;

}

当然,保险起见,在适当的时候调用

[self setNeedsStatusBarAppearanceUpdate];

2) 如果VC不是根控制器,那么不像控制字体颜色那样有trick,我们只能间接的通过在子VC中控制根VC,从而间接控制根控制器。那么这个方法就很多了,比如我的根VC是个tab的VC,首先现在tab的VC中,实现1):

@interface YYCTabBarController : RDVTabBarController

//定义一个变量来控制状态栏显示,子VC通过修改这个值来间接控制

@property (nonatomic,assign)BOOL statusBarHidden;

@end

@implementation YYCTabBarController

- (BOOL)prefersStatusBarHidden {

return _statusBarHidden;

}

@end

在子VC中:

- (void)viewWillAppear:(BOOL)animated{

[super viewWillAppear:animated];

//rdv_tabBarController指向YYCTabBarController

if([self.rdv_tabBarController respondsToSelector:@selector(setStatusBarHidden:)]){

[self.rdv_tabBarController performSelector:@selector(setStatusBarHidden:) withObject:@(YES)];

[self setNeedsStatusBarAppearanceUpdate];

}

}

- (void)viewWillDisappear:(BOOL)animated{

[super viewWillDisappear:animated];

if([self.rdv_tabBarController respondsToSelector:@selector(setStatusBarHidden:)]){

//注意对NO的情况,不能传@NO,只能传nil才能被当成NO

[self.rdv_tabBarController performSelector:@selector(setStatusBarHidden:) withObject:nil];

[self setNeedsStatusBarAppearanceUpdate];

}

}

可以看到在子VC中通过设置根VC的属性,并调用setNeedsStatusBarAppearanceUpdate后,根VC的prefersStatusBarHidden就会被调用,从而隐藏或显示状态栏。

导航栏控制

背景控制

在IOS7中使用barTintColor来控制导航栏的背景色:

[[UINavigationBar appearance] setBarTintColor:[UIColor yellowColor]];

这个设置方法可以在AppDelegate中设置,全局可以生效。

如果希望使用图片来作为导航的背景,那么需要注意的是ios7中图片的高度问题。上面提到过了,ios7导航栏的高度其实是算上状态栏的,即44+20=64个点的高度。可以通过setBackgroundImage来设置:

[[UINavigationBar appearance] setBackgroundImage:[UIImage imageNamed:@ "nav_bg.png" ] forBarMetrics:UIBarMetricsDefault];

前景控制

前景控制分为标题控制和返回按钮(等系统按钮)的控制

标题需要通过setTitleTextAttributes来设置,相对比较复杂一些,例如:

NSShadow *shadow = [[NSShadow alloc] init];

shadow.shadowColor = [UIColor colorWithRed:0.0 green:0.0 blue:0.0 alpha:0.8];

shadow.shadowOffset = CGSizeMake(0, 1);

[[UINavigationBar appearance] setTitleTextAttributes: [NSDictionary dictionaryWithObjectsAndKeys:

[UIColor colorWithRed:245.0/255.0 green:245.0/255.0 blue:245.0/255.0 alpha:1.0], NSForegroundColorAttributeName,

shadow, NSShadowAttributeName,

[UIFont fontWithName:@ "HelveticaNeue-CondensedBlack"  size:21.0], NSFontAttributeName, nil]];

设置返回按钮(等系统按钮)可以通过TintColor,直接来设置颜色

[[UINavigationBar appearance] setTintColor:[UIColor whiteColor]];

显示设置

有时我们希望导航栏不显示,而有时又希望显示,那么最好通过每个个体的VC来控制,如果某个VC需要与其他VC有所区别,那么最好是“负责到底”,即在进入VC时改变导航栏的显示状态,而退出时还原:

- (void) viewWillAppear:(BOOL)animated {

[super viewWillAppear:animated];

[self.navigationController.navigationBar setHidden:YES];

[self.rdv_tabBarController setTabBarHidden:YES animated:NO];

}

- (void) viewWillDisappear:(BOOL)animated {

[super viewWillDisappear:animated];

[self.navigationController.navigationBar setHidden:NO];

[self.rdv_tabBarController setTabBarHidden:NO animated:NO];

}

如何在有导航栏的情况下定位控件的Y

可能初学ios的同学(尤其是通过手写代码布局的同学)都会有这么个感受,为什么我的控件有的时候明明定位在VC上,但会被导航栏遮住,那么你可能会得出结论原点(0,0)是在屏幕的左上角被导航栏遮住的;而对于像UITableView这样的,设置了全屏铺满,怎么就没有被导航栏遮住呢?原点难道不在左上角?

笔者被这个问题困扰了很久,这里谈一下最近的一个理解。我们拿UITextView来看

当我们把一个UITextView放到一个没有导航的VC中时:

UITextView *textView = [[UITextView alloc] init];

textView.frame = CGRectMake(10, 200, 300, 120);

textView.backgroundColor = [UIColor redColor];

textView.text = @"游戏分两种,一种是在生活中玩的,另一种是生活在其中的。这两个世界相互矛盾,而两位约翰就分别属于这不同的世界。";

textView.font = [UIFont boldSystemFontOfSize:40];

textView.editable = NO;

[self.view addSubview:textView]

效果是这样的,看起来并没有什么问题

然而如果我们把这个VC放到一个导航控制器中,同样的代码却是这样结果

首先,看起来UITextView距离设备顶部的绝对距离似乎并没有变化,但是请注意UITextView的滚动条,滚动条竟然没有顶部对齐,而且文字也向下移位了,看起来空出一大块。仔细看空出的这段高度其实刚好是导航栏的高度64个点!!经过搜索,我发现只要设置如下代码即可恢复这种异常的状况:

self.automaticallyAdjustsScrollViewInsets = NO;

这下明白了,原来VC会对其内部的UIScrollView的内容部分进行一个Inset,这个Inset在上半部分刚好就对应导航栏的高度,而UIScrollView包括UITableView和UITextView等。到这里,似乎有些问题明朗了:

VC中的view默认会对UIScrollView做一个适应导航栏的处理,由此推测,其实只要是VC中的控件,都是从设备左上角的(0,0)开始算的,只是对于UIScrollView,VC会自动调整一下内容的位置而已。

在有导航的情况下,可视范围的Y坐标就是从64开始的,除了UIScrollView的控件,定位的时候,都应当以(0,64)为原点;而UIScrollView如果是全屏的,那么无所谓,如果不是全屏的,请注意是否需要设置VC的automaticallyAdjustsScrollViewInsets。

建议: 对于设置控件的高度,相对于不同的机型,最好不要写死,而是采用center Y的方式设置比 例。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 141,930评论 1 299
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 60,888评论 1 255
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 93,606评论 0 211
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 40,848评论 0 175
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 48,544评论 1 253
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 38,671评论 1 173
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 30,312评论 2 267
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 29,112评论 0 165
  • 想象着我的养父在大火中拼命挣扎,窒息,最后皮肤化为焦炭。我心中就已经是抑制不住地欢快,这就叫做以其人之道,还治其人...
    爱写小说的胖达阅读 28,899评论 6 229
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 32,451评论 0 213
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 29,221评论 2 213
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 30,541评论 1 225
  • 白月光回国,霸总把我这个替身辞退。还一脸阴沉的警告我。[不要出现在思思面前, 不然我有一百种方法让你生不如死。]我...
    爱写小说的胖达阅读 24,196评论 0 31
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 27,079评论 2 213
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 31,448评论 3 204
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 25,597评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 25,969评论 0 164
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 33,451评论 2 230
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 33,523评论 2 229

推荐阅读更多精彩内容