有没有办法在图层边缘实现边框图像(如CSS边框图像)?

Question

我想用 Swift4.2 实现一个具有边框图像模式的层，例如 CSS，但我不知道该怎么做。

我看到一个名为"PriPara"的应用程序在香港App Store https://itunes.apple.com/sg/app/pripara/id1039257927?mt=8 发布，它有一个UITabBar和一个UINavigationBar，它们有复杂的轮廓和一些图像图案。如下：

整屏， UITabBar， UINavigationBar

UITabBar 的边框上有一个类似蕾丝的图像图案。 UINavigationBar的边框上有一个类似珠宝的图像。

我已经知道我可以通过修改CAShapeLayer类的"path"属性来更改图层轮廓的形状，正如网站 https://medium.com/@philipp307/draw-a-custom-ios-tabbar-shape-27d298a7f4fa 所说的那样。

但是，至于边框图像，我不知道。虽然看起来CSS具有边框图像属性，如页面显示 https://css-generator.net/border-image/，但Swift没有。我是否必须使用一些外部库，或者没有办法实现这一点？

Answer 1

我基本上解决了这个问题。

我选择了使用DonMag所说的简单图像的方式。也许这太简单了，但这是我所能做的。

它使用CAShapeLayer，UIBezierPath。

在原始 UITabBarController 子类中，执行以下代码：

let shapeLayer = CAShapeLayer()
//Get CGPath.Original Layer will be expanded lengthwise.
shapeLayer.path = self.createLengthExpandShape()
//Set image
shapeLayer.fillColor = UIColor.init(patternImage: UIImage.init(named: "MyImage.png")!).cgColor
//Set layer
self.tabBar.layer.insertSublayer(shapeLayer, at: 0)

最棘手的一点是UIImage.init(colorPattern：)。您可以使用此函数将图像设置为 CAShapeLayer。图像文件在运行时颠倒使用。所以你必须提前用油漆软什么的把它倒过来。另外，请注意，图像是从原始(展开之前)图层的左上角放置的。如果更改了扩展 CAShapeLayer 的方式，则还应调整图像文件上的内容。

图像文件：https://i.imgur.com/BYnkuXQ

有关整个项目，请参阅 https://github.com/Satoru-PriChan/ChangeUITabBarAppearance

如果您喜欢它，请单击 GitHub 项目中的星标。