ios – 清晰的彩色背景导航栏,但仍悬浮在所有内容之上

前端之家收集整理的这篇文章主要介绍了ios – 清晰的彩色背景导航栏,但仍悬浮在所有内容之上前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我是一个新的iOS开发人员,我发现一些应用程序可以有一个完全透明的导航栏,但仍然漂浮在所有内容之上,例如应用程序有一个非常漂亮的背景图片,导航栏是透明的,所以你可以看到整个背景,但导航视图控制器上有一个滚动视图.滚动时,它仍然在导航栏下方.

当我尝试它时,我将导航栏背景设置为像这样透明

[self.navigationController.navigationBar setBackgroundImage:[self imageWithColor:[UIColor clearColor]] forBarMetrics:UIBarMetricsDefault];

但是当它进入导航栏时,我的滚动视图将完全可见.我不喜欢这样,有没有人知道如何使导航条透明但仍然漂浮在一切?

谢谢你们的声誉,这里是雅虎天气的屏幕截图他们的导航栏正是我想要的.

但是当我为它设置清晰的背景时,就会变成这样.

解决方法

我不是百分百确定雅虎是如何做到的,但我可以假装这种效果

我受到BTGlassScrollView(https://github.com/BTLibrary/BTGlassScrollView)的启发,我使用的方法有几个步骤:

1.>像这样设置你的导航控制器:

>首先放置背景图像视图
>然后为滚动视图添加一个包装器视图,并将包装器视图背景设置为Transparent(这个包装器视图非常重要,我们必须伪造这个包装器视图的效果)
>将滚动视图拖动到包装器视图中,并将滚动视图背景设置为透明.

2.>设置滚动视图,包装视图和背景图像视图的所有出口

3.>您可能还想隐藏导航栏阴影图像,这里是代码,以防您需要它

self.navigationController.navigationBar.shadowImage = [[UIImage alloc] init];

4.>然后将此方法粘贴到您的班级中

- (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,size.width,size.height);

    return mask;
}

方法的目的是创建一个在其上具有清晰到白色渐变的遮罩层.

5.>最后一步,只需将它添加到您的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];

在这种情况下,包装器视图是关键,如果没有它,导航栏将无法工作.并且记住不要将背景图像视图放入包装器视图中,它们应该在同一级别上,而是在包装器视图下的背景图像.

这是一个非常粗略的模拟,但希望这会给你一些想法.

猜你在找的iOS相关文章