我是一个新的iOS开发者,我发现一些应用程序可以拥有一个完全透明的导航栏,但仍然浮在所有内容之上,例如应用程序有一个非常漂亮的背景图片,导航栏是透明的,所以您可以看到整个背景,但导航视图控制器上有一个滚动视图。滚动时,它仍然在导航栏下面。
当我尝试它时,我将导航栏背景设置为透明,如此
[self.navigationController.navigationBar setBackgroundImage:[self imageWithColor:[UIColor clearColor]] forBarMetrics:UIBarMetricsDefault];
但是我的滚动视图在导航条下方时会完全可见。我不喜欢这样,有没有人知道如何使导航条透明但仍然漂浮在一切?
感谢大家的声誉,这里是雅虎天气的屏幕截图,他们的导航栏完全符合我的要求。
但是当我为它设置清晰的背景时,就会变成这样。
答案 0 :(得分:8)
我不是百分百肯定雅虎是如何做到这一点的,但我可以假装这样的效果
我受到BTGlassScrollView(https://github.com/BTLibrary/BTGlassScrollView)的启发,我使用的方法有几个步骤:
<强> 1.&GT;像这样设置你的导航控制器:
<强> 2.&GT;设置滚动视图,包装视图和背景图像视图的所有出口
<强> 3.&GT;您可能还想隐藏导航栏阴影图像,这里是代码,以防您需要它
self.navigationController.navigationBar.shadowImage = [[UIImage alloc] init];
<强> 4.&GT;然后将此方法粘贴到您的课程中
- (CALayer *)createViewMaskWithSize:(CGSize)size startGradientAt:(CGFloat)start endGradientAt:(CGFloat)end
{
CAGradientLayer *mask = [CAGradientLayer layer];
mask.anchorPoint = CGPointZero;
mask.startPoint = CGPointMake(0.5f, 0.0f);
mask.endPoint = CGPointMake(0.5f, 1.0f);
mask.colors = @[(id)[UIColor clearColor].CGColor, (id)[UIColor clearColor].CGColor, (id)[UIColor whiteColor].CGColor, (id)[UIColor whiteColor].CGColor];
mask.locations = @[@0.0, @(start/size.height), @(end/size.height), @1.0f];
mask.frame = CGRectMake(0, 0, size.width, size.height);
return mask;
}
此方法的目的是创建一个上面带有清晰到白色渐变的遮罩层。
<强> 5.&GT;最后一步,只需将其添加到您的wrapperView.layer.mask中就像这样
// 64 in here is the position where the fade effect should start, and 80 is where the gradien should end
// you can change those 2 numbers and see different effects
self.scrollViewWrapperView.layer.mask = [self createViewMaskWithSize:self.scrollViewWrapperView.frame.size startGradientAt:64 endGradientAt:80];
在这种情况下,包装器视图是关键,如果没有它,导航栏将无法工作。并且记住不要将背景图像视图放入包装器视图中,它们应该在同一级别上,而是在包装器视图下的背景图像。
这是一个非常粗略的模拟,但希望这会给你一些想法。