【问题标题】:UINavigationBar Custom Color Hairline BorderUINavigationBar 自定义颜色细线边框
【发布时间】:2018-10-30 15:47:42
【问题描述】:

首先,我在发布这个问题之前确实搜索了这个,但如果有答案,它就会被数百万关于如何删除的问题所掩盖导航栏的默认底部边框。

我不想移除导航栏的底部边框(“阴影”)。


我正在尝试通过使用外观代理的常用方法来“主题化”我的应用程序。 我可以使用如下代码全局更改 UINavigationBar 的大多数视觉属性:

let navigationBarProxy = UINavigationBar.appearance()
navigationBarProxy.isTranslucent = false
navigationBarProxy.barTintColor = myBarBackgroundColor
navigationBarProxy.tintColor = myBarTextColor

关于条形的“细线”底部边框(或众所周知的“阴影”),我可以通过什么都不做或指定 nil 来设置默认值:

navigationBarProxy.shadowImage = nil

...或者我可以指定一个自定义颜色,方法是指定一个我想要的颜色的纯色图像

navigationBarProxy.shadowImage = UIImage.withColor(myBorderColor)

(使用辅助扩展:)

extension UIImage {
    public static func withColor(_ color: UIColor?, size: CGSize = CGSize(width: 1, height: 1)) -> UIImage? {
        let rect = CGRect(origin: CGPoint.zero, size: size)
        UIGraphicsBeginImageContext(rect.size)
        let context = UIGraphicsGetCurrentContext()

        let actualColor = color ?? .clear
        context?.setFillColor(actualColor.cgColor)
        context?.fill(rect)

        let image = UIGraphicsGetImageFromCurrentImageContext()
        UIGraphicsEndImageContext()

        return image
    }
}

然而,上面的方法(在视网膜设备上)给了我一个 1pt, 2px 边框,而默认的浅灰色实际上是 0.5pt, 1px(又名“细线”)。

有什么方法可以为 UINavigationBar 实现 0.5 pt (1px)、自定义颜色的底部边框(阴影)?


我想我可以使用运行时生成的背景图像,该图像大部分是实心的,但在底部有一个我选择的颜色“烘焙”的 1px 边框。但这似乎充其量是不优雅的,我不确定当导航栏高度发生变化时它会如何工作:图像是切片,还是简单地拉伸,还是什么?

【问题讨论】:

  • 只是想知道您是否提供高度为0.5 的默认尺寸,您会得到什么?
  • @nayem 我尝试指定我通过的图像的大小。将高度设置为 0.5 并没有什么不同(我仍然得到 2px - 1pt 的高度)。

标签: ios uinavigationbar uiappearance


【解决方案1】:

基于此处找到的所选答案(由于它是旧的,因此略有改动):

How to change the border color below the navigation bar?

// in viewDidLoad
UIView * navBorder = [[UIView alloc] initWithFrame:CGRectMake(0,
                                                              self.navigationController.navigationBar.frame.size.height, // <-- same height, not - 1
                                                              self.navigationController.navigationBar.frame.size.width,
                                                              1/[UIScreen mainScreen].scale)]; // <-- 5/5S/SE/6 will be 0.5, 6+/X will be 0.33
// custom color here
[navBorder setBackgroundColor:customColor];

[self.navigationController.navigationBar addSubview:navBorder];


在此处以编程方式查找比例的功劳: Get device image scale (e.g. @1x, @2x and @3x)

*注意:
iPhone 6+/X 是 x3,所以 1px 高度将是 0.33pt
iPhone 5/5S/SE/6 是 x2,所以 1px 高度将是 0.5pt
在模拟器中测试,可能需要在实际设备上验证。

视觉上与带有自定义颜色的默认导航栏相同。

【讨论】:

  • 谢谢。这是我希望避免的有点不雅的解决方案,但从可用的公共 API 的外观来看,这似乎是不可能的。显然,如果通过nil,Apple 正在做一些特别的事情,因为图像会为您提供特定厚度的特定灰色。
  • 如果再过几天没有人提出更好的解决方案,我会给你打勾。
【解决方案2】:

我相信你想移除阴影。这应该会有所帮助。

[[UINavigationBar appearance] setShadowImage:[UIImage new]];

如果你想要不同颜色的阴影,那么你可以用你想要的颜色创建一个图像并使用它来代替

[UIImage new]

您可以使用类似的东西自己生成图像

+ (UIImage *)imageWithColor:(UIColor *)color {
    CGRect rect = CGRectMake(0.0f, 0.0f, 1.0f, 1.0f);
    const CGFloat alpha = CGColorGetAlpha(color.CGColor);
    const BOOL opaque = alpha == 1;
    UIGraphicsBeginImageContextWithOptions(rect.size, opaque, 0);
    CGContextRef context = UIGraphicsGetCurrentContext();

    CGContextSetFillColorWithColor(context, [color CGColor]);
    CGContextFillRect(context, rect);

    UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

    return image;
}

【讨论】:

  • 不,我确实想要移除阴影。我想改变阴影的颜色,同时保留原来的 1px 宽度。请再次阅读我的问题。
猜你喜欢
  • 1970-01-01
  • 2013-10-06
  • 2013-01-06
  • 1970-01-01
  • 2019-06-03
  • 2012-03-16
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多