iOS 7 - 在横向模式下设置导航栏的背景
Posted
技术标签:
【中文标题】iOS 7 - 在横向模式下设置导航栏的背景【英文标题】：iOS 7 - Setting background for navigation bar in landscape mode 【发布时间】：2013-11-19 00:32:49 【问题描述】：当屏幕切换到横向模式时，我想为导航栏设置更大的背景。所以这就是我在视图控制器中所做的：
- (void)willAnimateRotationToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval)duration
UIDeviceOrientation deviceOrientation = toInterfaceOrientation;
if([[UINavigationBar class] respondsToSelector:@selector(appearance)])
[self.navigationController.navigationBar setBackgroundImage: [UIImageHelper createTopBar: deviceOrientation] forBarMetrics: UIBarMetricsDefault];
else
[self.navigationController.navigationBar setBackgroundColor: [UIColor colorWithPatternImage: [UIImageHelper createTopBar: [[UIDevice currentDevice] orientation]]]];
这就是createTopBar 方法：
+ (UIImage *)createTopBar: (UIDeviceOrientation) orientation
// Create a new image context
CGSize size;
if (orientation == UIInterfaceOrientationLandscapeLeft || orientation == UIInterfaceOrientationLandscapeRight)
if ([UIDevice isiPhone5])
size = CGSizeMake(568, 34);
UIGraphicsBeginImageContextWithOptions(CGSizeMake(568, 34), NO, 0.0);
else if (UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPad)
size = CGSizeMake(1024, 44);
UIGraphicsBeginImageContextWithOptions(size, NO, 0.0);
else
size = CGSizeMake(480, 34);
UIGraphicsBeginImageContextWithOptions(CGSizeMake(480, 34), NO, 0.0);
else
if (UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPad)
size = CGSizeMake(768, 44);
UIGraphicsBeginImageContextWithOptions(CGSizeMake(768, 44), NO, 0.0);
else if ([UIDevice isiPhone5])
size = CGSizeMake(320, 44);
UIGraphicsBeginImageContextWithOptions(CGSizeMake(320, 44), NO, 0.0);
else
size = CGSizeMake(320, 44);
UIGraphicsBeginImageContextWithOptions(CGSizeMake(320, 44), NO, 0.0);
UIImage * image = [UIImage imageNamed: @"top_bar_without_title"];
[image drawInRect:CGRectMake(0, 0, size.width, size.height+4)];
UIImage * destImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return destImage;
纵向模式下效果很好：
这在 ios 6 的横向模式下也很有效：
但这就是在 iOS 7 横向模式下的结果：
您可以看到状态栏与导航栏重叠，并且导航栏底部有一些额外的空间。 （附带说明，我编辑了 info.plist 文件以修复重叠状态栏问题。这仅在我尝试为导航栏设置新背景图像时发生。）您对这个问题有什么建议吗？如果你这样做，请告诉我，谢谢。
【问题讨论】：
【参考方案1】：所以感谢@eagle.dan.1349的回答，我想出了一个主意：我将导航栏背景的高度扩展为包括状态栏的高度，然后开始绘制背景图像从下到为状态栏留出空间：
+ (UIImage *)createTopBar: (UIDeviceOrientation) orientation
// Create a new image context
CGSize size;
if (orientation == UIInterfaceOrientationLandscapeLeft || orientation == UIInterfaceOrientationLandscapeRight)
if ([UIDevice isiPhone5])
if ([[[UIDevice currentDevice] systemVersion] floatValue] >= 7)
size = CGSizeMake(568, 34);
UIGraphicsBeginImageContextWithOptions(CGSizeMake(568, 54), NO, 0.0);
else
size = CGSizeMake(568, 34);
UIGraphicsBeginImageContextWithOptions(CGSizeMake(568, 34), NO, 0.0);
else if (UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPad)
size = CGSizeMake(1024, 44);
UIGraphicsBeginImageContextWithOptions(size, NO, 0.0);
else
if ([[[UIDevice currentDevice] systemVersion] floatValue] >= 7)
size = CGSizeMake(480, 34);
UIGraphicsBeginImageContextWithOptions(CGSizeMake(480, 54), NO, 0.0);
else
size = CGSizeMake(480, 34);
UIGraphicsBeginImageContextWithOptions(CGSizeMake(480, 34), NO, 0.0);
else
if (UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPad)
size = CGSizeMake(768, 44);
UIGraphicsBeginImageContextWithOptions(CGSizeMake(768, 44), NO, 0.0);
else if ([UIDevice isiPhone5])
size = CGSizeMake(320, 44);
UIGraphicsBeginImageContextWithOptions(CGSizeMake(320, 44), NO, 0.0);
else
size = CGSizeMake(320, 44);
UIGraphicsBeginImageContextWithOptions(CGSizeMake(320, 44), NO, 0.0);
UIImage * image = [UIImage imageNamed: @"top_bar_without_title"];
if ((orientation == UIInterfaceOrientationLandscapeLeft ||
orientation == UIInterfaceOrientationLandscapeRight) &&
[[[UIDevice currentDevice] systemVersion] floatValue] >= 7)
[[UIColor blackColor] set];
UIRectFill(CGRectMake(0, 0, size.width, 40));
[image drawInRect:CGRectMake(0, 20, size.width, size.height+4)];
else
[image drawInRect:CGRectMake(0, 0, size.width, size.height+4)];
UIImage * destImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return destImage;
瞧，它就像一个魅力！真的希望这对像我这样试图保持 iOS 6 状态栏风格的人有所帮助。
【讨论】：
【参考方案2】：iOS 7 在系统控制和外观方面有很多未记录的行为。我建议你“放弃”与状态栏的斗争，并调整你的形象以适应它。您可以尝试在图像顶部添加 20px 的黑色。
【讨论】：
感谢您的建议，我已经提出了自己的解决方案。这个答案值得 +1。以上是关于iOS 7 - 在横向模式下设置导航栏的背景的主要内容，如果未能解决你的问题，请参考以下文章