【问题标题】:How to draw a transparent UIToolbar or UINavigationBar in iOS7iOS7如何绘制透明的UIToolbar或UINavigationBar
【发布时间】:2013-09-28 22:32:53
【问题描述】:

我想要一个完全透明的UIToolbar 和/或UINavigationBar。我已经尝试过为 iOS 5 前后建议的各种咒语,但似乎都不再奏效了。

这在 iOS 7 中如何实现?

【问题讨论】:

  • 为了后代 - 我错误地使用了 self.edgesForExtendedLayout = UIRectEdgeNone,这会阻止视图在工具栏下扩展。

标签: ios uinavigationcontroller uinavigationbar ios7 uitoolbar


【解决方案1】:

Swift 3 (iOS 10)

透明UIToolbar

self.toolbar.setBackgroundImage(UIImage(),
                                forToolbarPosition: .any,
                                barMetrics: .default)
self.toolbar.setShadowImage(UIImage(), forToolbarPosition: .any)

透明UINavigationBar

self.navigationBar.setBackgroundImage(UIImage(), for: .default)
self.navigationBar.shadowImage = UIImage()
self.navigationBar.isTranslucent = true

斯威夫特

透明UIToolbar

self.toolbar.setBackgroundImage(UIImage(),
                                forToolbarPosition: UIBarPosition.Any,
                                barMetrics: UIBarMetrics.Default)
self.toolbar.setShadowImage(UIImage(),
                            forToolbarPosition: UIBarPosition.Any)

透明UINavigationBar

self.navigationBar.setBackgroundImage(UIImage(), forBarMetrics: UIBarMetrics.Default)
self.navigationBar.shadowImage = UIImage()
self.navigationBar.translucent = true

目标-C

透明UIToolbar

[self.toolbar setBackgroundImage:[UIImage new]
              forToolbarPosition:UIBarPositionAny
                      barMetrics:UIBarMetricsDefault];
[self.toolbar setShadowImage:[UIImage new]
          forToolbarPosition:UIBarPositionAny];

透明UINavigationBar

[self.navigationBar setBackgroundImage:[UIImage new]
                         forBarMetrics:UIBarMetricsDefault];
self.navigationBar.shadowImage = [UIImage new];
self.navigationBar.translucent = YES;

讨论

由于UINavigationBar 文档中讨论的行为,在导航栏上将translucent 设置为YES 可以解决问题。我将在这里报告相关片段:

如果您在具有不透明自定义背景图像的导航栏上将此属性设置为YES,则导航栏将对图像应用小于 1.0 的系统不透明度。


最终结果

【讨论】:

  • 您确认工具栏版本适用于iOS7吗?我得到一个黑色的工具栏和一个奇怪的演示文稿闪烁。
  • 截图来自iOS 7模拟器
  • 另外,我刚刚在装有 iOS 7 的 iPhone 5 上运行了一个测试应用程序,它按预期工作。
  • 做得很好,在 SO 上有很多错误/坏方法可以做到这一点
  • 如果使用 edgesForExtendedLayout = UIRectEdgeNone,您可能需要实现自定义转换。因为否则,在推送视图时,默认过渡会在动画期间在透明条下方创建暗闪烁。仅供参考,这是基本滑动过渡的快速资源:gist.github.com/ArtFeel/7690431
【解决方案2】:

如果您想通过整个应用程序执行此操作,您应该使用 UIAppearance 代理 (iOS5+):

UINavigationBar *navigationBarAppearance = [UINavigationBar appearance]; navigationBarAppearance.backgroundColor = [UIColor clearColor]; [navigationBarAppearance setBackgroundImage:[[UIImage alloc] init] forBarMetrics:UIBarMetricsDefault]; navigationBarAppearance.shadowImage = [[UIImage alloc] init];

文档:https://developer.apple.com/library/ios/documentation/UIKit/Reference/UIAppearance_Protocol/Reference/Reference.html

文章:http://nshipster.com/uiappearance/

【讨论】:

  • 只是给正在查看此内容的人的说明 - 将此代码放入您的 AppDelegate didFinishLaunchingWithOptions 以获得快速而肮脏的应用方式。
  • 您还可以将此外观代理设置为仅适用于特定的 UINavigationController 子类,即您希望应用此行为的子类。
【解决方案3】:

试试:

[navBar setBackgroundImage:[UIImage alloc] forBarMetrics:UIBarMetricsDefault];

【讨论】:

    【解决方案4】:
    @implementation MyCustomNavigationBar
    
    - (id)initWithFrame:(CGRect)frame
    {
        self = [super initWithFrame:frame];
        if (self) {
            [self setup];
        }
        return self;
    }
    
    - (id)initWithCoder:(NSCoder *)aDecoder {
        self = [super initWithCoder:aDecoder];
        if (self) {
            [self setup];
        }
        return self;
    }
    
    - (void)setup {
        [self setupBackground];
    }
    
    - (void)setupBackground {
        self.backgroundColor = [UIColor clearColor];
        self.tintColor = [UIColor clearColor];
    
        // make navigation bar overlap the content
        self.translucent = YES; 
        self.opaque = NO;
    
        // remove the default background image by replacing it with a clear image
        [self setBackgroundImage:[self.class maskedImage] forBarMetrics:UIBarMetricsDefault];
    
        // remove defualt bottom shadow
        [self setShadowImage: [UIImage new]]; 
    }
    
    + (UIImage *)maskedImage {
        const float colorMask[6] = {222, 255, 222, 255, 222, 255};
        UIImage *img = [UIImage imageNamed:@"nav-white-pixel-bg.jpg"];
        return [UIImage imageWithCGImage: CGImageCreateWithMaskingColors(img.CGImage, colorMask)];
    }
    
    @end
    

    【讨论】:

      【解决方案5】:

      我偶然发现,如果我创建了一个子类UINavigationBar,然后创建了一个空的-(void)drawRect: 方法,我会得到一个透明的导航栏。我只在 iOS 7.* 中对此进行了测试,但它似乎有效!

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2011-09-09
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2013-09-24
        相关资源
        最近更新 更多