Swift 4 view with curved center - ios

Question

i have difficulties to create UI. I tried to create custom view, but i can't see even the background of this view. Here is my sample code, i took it from another post, but i don't know how to change it to my case.
I do use SnapKit for my UI elements.
My View:
lazy var greenView: CurvedView = {
let view = CurvedView()
view.backgroundColor = #colorLiteral(red: 0.08778516203, green: 0.7643524408, blue: 0.1997725368, alpha: 1)
DispatchQueue.main.async {
view.snp.makeConstraints{ (make) -> Void in
make.top.equalTo(self.shipView.snp.bottom).offset(100)
make.left.right.equalTo(self.scrollContentView)
make.height.equalTo(200)
}
}
return view
}()
Tried to create custom View:
class CurvedView: UIView {
override init(frame: CGRect) {
super.init(frame: frame)
StyleKitName.drawCanvas1(frame: CGRect(x: 0, y: 0, width: UIScreen.main.bounds.width, height: 400), resizing: .aspectFit)
backgroundColor = .red
}
required init?(coder aDecoder: NSCoder) {
super.init(coder: aDecoder)
}
}
UPDATED green customView with PaintCode
public class StyleKitName : UIView {
//// Drawing Methods
#objc dynamic public class func drawCanvas1(frame targetFrame: CGRect = CGRect(x: 0, y: 0, width: 240, height: 120), resizing: ResizingBehavior = .aspectFit) {
//// General Declarations
let context = UIGraphicsGetCurrentContext()!
//// Resize to Target Frame
context.saveGState()
let resizedFrame: CGRect = resizing.apply(rect: CGRect(x: 0, y: 0, width: 240, height: 120), target: targetFrame)
context.translateBy(x: resizedFrame.minX, y: resizedFrame.minY)
context.scaleBy(x: resizedFrame.width / 240, y: resizedFrame.height / 120)
//// Color Declarations
let color = #colorLiteral(red: 0.3411764801, green: 0.6235294342, blue: 0.1686274558, alpha: 1)
let color2 = #colorLiteral(red: 0.7450980544, green: 0.1568627506, blue: 0.07450980693, alpha: 1)
//// Rectangle Drawing
let rectanglePath = UIBezierPath()
rectanglePath.move(to: CGPoint(x: 48, y: 103))
rectanglePath.addLine(to: CGPoint(x: 191, y: 103))
rectanglePath.addLine(to: CGPoint(x: 191, y: 9))
rectanglePath.addLine(to: CGPoint(x: 48, y: 9))
rectanglePath.addLine(to: CGPoint(x: 48, y: 103))
rectanglePath.close()
color.setFill()
rectanglePath.fill()
//// Bezier Drawing
let bezierPath = UIBezierPath()
bezierPath.move(to: CGPoint(x: 96, y: 9))
bezierPath.addCurve(to: CGPoint(x: 110, y: 15), controlPoint1: CGPoint(x: 104.11, y: 9.42), controlPoint2: CGPoint(x: 107, y: 12))
bezierPath.addCurve(to: CGPoint(x: 123, y: 23), controlPoint1: CGPoint(x: 114.16, y: 19.16), controlPoint2: CGPoint(x: 115.63, y: 23))
bezierPath.addCurve(to: CGPoint(x: 136, y: 15), controlPoint1: CGPoint(x: 129.95, y: 23), controlPoint2: CGPoint(x: 132, y: 19))
bezierPath.addCurve(to: CGPoint(x: 152, y: 9), controlPoint1: CGPoint(x: 139.3, y: 11.7), controlPoint2: CGPoint(x: 145.35, y: 9))
bezierPath.addCurve(to: CGPoint(x: 96, y: 9), controlPoint1: CGPoint(x: 166.7, y: 9), controlPoint2: CGPoint(x: 96, y: 9))
bezierPath.addLine(to: CGPoint(x: 148.61, y: 9))
color2.setFill()
bezierPath.fill()
context.restoreGState()
}
#objc(StyleKitNameResizingBehavior)
public enum ResizingBehavior: Int {
case aspectFit /// The content is proportionally resized to fit into the target rectangle.
case aspectFill /// The content is proportionally resized to completely fill the target rectangle.
case stretch /// The content is stretched to match the entire target rectangle.
case center /// The content is centered in the target rectangle, but it is NOT resized.
public func apply(rect: CGRect, target: CGRect) -> CGRect {
if rect == target || target == CGRect.zero {
return rect
}
var scales = CGSize.zero
scales.width = abs(target.width / rect.width)
scales.height = abs(target.height / rect.height)
switch self {
case .aspectFit:
scales.width = min(scales.width, scales.height)
scales.height = scales.width
case .aspectFill:
scales.width = max(scales.width, scales.height)
scales.height = scales.width
case .stretch:
break
case .center:
scales.width = 1
scales.height = 1
}
var result = rect.standardized
result.size.width *= scales.width
result.size.height *= scales.height
result.origin.x = target.minX + (target.width - result.width) / 2
result.origin.y = target.minY + (target.height - result.height) / 2
return result
}
}
}
https://d.radikal.ru/d30/1902/c5/c07cac5532d0.png

Answer 1

This is the basic way to use that PaintCode generated code...
class StyleView: UIView {
override func draw(_ rect: CGRect) {
StyleKitName.drawCanvas1()
}
}
class StyleTestViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
let v = StyleView()
v.frame = CGRect(x: 0, y: 0, width: 240, height: 120)
v.center = view.center
v.backgroundColor = .blue
view.addSubview(v)
}
}
Result: