为iOS 7半透明UINavigationBar实现明亮鲜艳的色彩

本文介绍了为iOS 7半透明UINavigationBar实现明亮鲜艳的色彩的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

iOS 7.1更新：在此更新中，似乎已忽略修改UINavigationBar中Alpha通道的变通方法。现在，最好的解决方案似乎只是处理它，并希望你选择的任何颜色都能产生半透明效果。我仍然在研究如何解决这个问题。

iOS 7.0.3更新：我们创建的的解决方案，然后包含了自定义的 UINavigationBar 一个 UINavigationController 子类。。

  ////////////////////////// // 
 // CRNavigationBar.m 
 //////////////////////////// 
 
 #importCRNavigationBar.h
 
 @interface CRNavigationBar（）
 @property（nonatomic，strong）CALayer * colorLayer; 
 @end 
 
 @implementation CRNavigationBar 
 
 static CGFloat const kDefaultColorLayerOpacity = 0.5f; 
 static CGFloat const kSpaceToCoverStatusBars = 20.0f; 
 
  - （void）setBarTintColor：（UIColor *）barTintColor {
 [super setBarTintColor：barTintColor]; 
 if（self.colorLayer == nil）{
 self.colorLayer = [CALayer layer]; 
 self.colorLayer.opacity = kDefaultColorLayerOpacity; 
 [self.layer addSublayer：self.colorLayer]; 
} 
 self.colorLayer.backgroundColor = barTintColor.CGColor; 
} 
 
  - （无效）layoutSubviews {
 [super layoutSubviews]; 
 if（self.colorLayer！= nil）{
 self.colorLayer.frame = CGRectMake（0,0-kSpaceToCoverStatusBars，CGRectGetWidth（self.bounds），CGRectGetHeight（self.bounds）+ kSpaceToCoverStatusBars）; 
 
 [self.layer insertSublayer：self.colorLayer atIndex：1]; 
} 
} 
 
 @end

  //////////////////////////// 
 // CRNavigationController.m 
 //////////////////////////// 
 
 #importCRNavigationController .h
 #importCRNavigationBar.h
 
 @interface CRNavigationController（）
 
 @end 
 
 @implementation CRNavigationController 
 
  - （id）init {
 self = [super initWithNavigationBarClass：[CRNavigationBar class] toolbarClass：nil]; 
 if（self）{
 //这里自定义初始化，如果需要的话。 
} 
返回自我; 
} 
 
  - （id）initWithRootViewController：（UIViewController *）rootViewController {
 self = [super initWithNavigationBarClass：[CRNavigationBar class] toolbarClass：nil]; 
 if（self）{
 self.viewControllers = @ [rootViewController]; 
} 
 
返回自我; 
} 
 
 @end

解决方案

iOS 7.0.3更新：如上所述，7.0.3更改了一些内容。我已经更新了我的要点。希望这会随着人们的升级而消失。

原始答案：
我结束了将两者结合起来的黑客攻击其他答案。我正在为UINavigationBar创建子类，并在后面添加一个图层，如果任何各种高度状态栏都已启动，则会有一些额外的空间来覆盖。无论何时设置barTintColor，图层都会在布局子视图中进行调整，颜色会发生变化。

要点：

setBarTintColor

  [super setBarTintColor：barTintColor] ; 
 if（self.extraColorLayer == nil）{
 self.extraColorLayer = [CALayer layer]; 
 self.extraColorLayer.opacity = self.extraColorLayerOpacity; 
 [self.layer addSublayer：self.extraColorLayer]; 
} 
 self.extraColorLayer.backgroundColor = barTintColor.CGColor;

layoutSubviews

  [super layoutSubviews]; 
 if（self.extraColorLayer！= nil）{
 [self.extraColorLayer removeFromSuperlayer]; 
 self.extraColorLayer.opacity = self.extraColorLayerOpacity; 
 [self.layer insertSublayer：self.extraColorLayer atIndex：1]; 
 CGFloat spaceAboveBar = self.frame.origin.y; 
 self.extraColorLayer.frame = CGRectMake（0,0-spaceAboveBar，CGRectGetWidth（self.bounds），CGRectGetHeight（self.bounds）+ spaceAboveBar）; 
}

iOS 7.1 UPDATE: Looks like the workaround for modifying the alpha channel in the UINavigationBar has been ignored in this update. Right now, the best solution seems to be to just 'deal with it' and hope that whatever color you choose can render a translucent effect. I am still looking into ways of getting around this.

iOS 7.0.3 UPDATE: The GitHub library we created has been updated to slightly work around this issue when using iOS 7.0.3. Unfortunately, there is no magic formula to support both colors created in iOS 7.0.2 and earlier and iOS 7.0.3. Seems like Apple improved the saturation, but at the cost of opacity (since the blurred translucency is dependant on the opacity level). I, along with a few others, are working on creating a much better fix for this.

I'm sure many people have already come across the problem where iOS 7 tends to desaturate the color of a UINavigationBar that is translucent.

My goal is to achieve a UINavigationBar with this tint color, but translucent:

However, with translucency, I'm getting this. The background view is white, which I understand will make this view a bit lighter:

Is there any way to achieve the original color while still having translucency? I've noticed Facebook has been able to get their bar to be their rich, blue color, as displayed here:

..so I know there has to be some way. Background views obviously make a difference here, but most of their content is also gray/white. It seems that regardless of whatever bar tint color you put in, you are unable to get vivid colors under translucency.

Updated with solution.

Here's the solution that I ended up coming up with. I took aprato's solution and then encompassed the custom UINavigationBar within a UINavigationController subclass. I have created a repository that has this implementation listed below, along with an example app.

////////////////////////////
// CRNavigationBar.m
////////////////////////////

#import "CRNavigationBar.h"

@interface CRNavigationBar ()
@property (nonatomic, strong) CALayer *colorLayer;
@end

@implementation CRNavigationBar

static CGFloat const kDefaultColorLayerOpacity = 0.5f;
static CGFloat const kSpaceToCoverStatusBars = 20.0f;

- (void)setBarTintColor:(UIColor *)barTintColor {
    [super setBarTintColor:barTintColor];
    if (self.colorLayer == nil) {
        self.colorLayer = [CALayer layer];
        self.colorLayer.opacity = kDefaultColorLayerOpacity;
        [self.layer addSublayer:self.colorLayer];
    }
    self.colorLayer.backgroundColor = barTintColor.CGColor;
}

- (void)layoutSubviews {
    [super layoutSubviews];
    if (self.colorLayer != nil) {
        self.colorLayer.frame = CGRectMake(0, 0 - kSpaceToCoverStatusBars, CGRectGetWidth(self.bounds), CGRectGetHeight(self.bounds) + kSpaceToCoverStatusBars);

        [self.layer insertSublayer:self.colorLayer atIndex:1];
    }
}

@end

////////////////////////////
// CRNavigationController.m
////////////////////////////

#import "CRNavigationController.h"
#import "CRNavigationBar.h"

@interface CRNavigationController ()

@end

@implementation CRNavigationController

- (id)init {
    self = [super initWithNavigationBarClass:[CRNavigationBar class] toolbarClass:nil];
    if(self) {
        // Custom initialization here, if needed.
    }
    return self;
}

- (id)initWithRootViewController:(UIViewController *)rootViewController {
    self = [super initWithNavigationBarClass:[CRNavigationBar class] toolbarClass:nil];
    if(self) {
        self.viewControllers = @[rootViewController];
    }

    return self;
}

@end

解决方案

iOS 7.0.3 UPDATE: As you see above 7.0.3 changed things. I've updated my gist. Hopefully this will just go away as people upgrade.

Original Answer:I ended up with a hack combining the two of the other answers. I'm subclassing UINavigationBar and adding a layer to the back with some extra space to cover if any of the various height status bars are up. The layer gets adjusted in layout subviews and the color changes whenever you set barTintColor.

Gist: https://gist.github.com/aprato/6631390

setBarTintColor

  [super setBarTintColor:barTintColor];
  if (self.extraColorLayer == nil) {
    self.extraColorLayer = [CALayer layer];
    self.extraColorLayer.opacity = self.extraColorLayerOpacity;
    [self.layer addSublayer:self.extraColorLayer];
  }
  self.extraColorLayer.backgroundColor = barTintColor.CGColor;

layoutSubviews

  [super layoutSubviews];
  if (self.extraColorLayer != nil) {
    [self.extraColorLayer removeFromSuperlayer];
    self.extraColorLayer.opacity = self.extraColorLayerOpacity;
    [self.layer insertSublayer:self.extraColorLayer atIndex:1];
    CGFloat spaceAboveBar = self.frame.origin.y;
    self.extraColorLayer.frame = CGRectMake(0, 0 - spaceAboveBar, CGRectGetWidth(self.bounds), CGRectGetHeight(self.bounds) + spaceAboveBar);
  }

这篇关于为iOS 7半透明UINavigationBar实现明亮鲜艳的色彩的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！