在iOS上繪製圓角圖像時遇到奇怪的鋸齒圖案

Question

我正嘗試使用圓角創建縮略圖圖像，並在iOS圖像底部創建一個條形圖。

而且我有以下代碼：

extension UIImage { 
    func thumbnails(with options: SomeDrawingOptions) -> UIImage? { 
    // ... 

    UIGraphicsBeginImageContextWithOptions(targetRect.size, false, 0) 
    defer { 
     UIGraphicsEndImageContext() 
    } 
    let context = UIGraphicsGetCurrentContext()! 

    UIColor.white.setFill() 
    context.fill(targetRect) 

    UIBezierPath(roundedRect: targetRect, cornerRadius: 8).addClip() 

    // Drawing image 
    draw(in: targetRect) 

    // Drawing a transparent mask 
    UIColor.black.withAlphaComponent(0.4).setFill() 
    context.fill(targetRect) 

    // Drawing bar 
    UIColor.white.setFill() 
    context.fill(someBarRect) 

    return UIGraphicsGetImageFromCurrentImageContext() 
    } 
} 

最後我有鋒利圓角就像那些在下面的快照圖像。

任何建議，以消除圓角的鋸齒？

=======溶液======

感謝@ wj2061答案，問題就迎刃而解了。這裏是代碼：

extension UIImage { 
    func thumbnails(with options: SomeDrawingOptions) -> UIImage? { 
    // ... 

    let targetRect = options.targetRect 
    let clippedPath = UIBezierPath(roundedRect: targetRect, cornerRadius: 8) 

    func makeImage() -> UIImage? { 
     UIGraphicsBeginImageContextWithOptions(targetRect.size, false, 0) 
     defer { UIGraphicsEndImageContext() } 
     let context = UIGraphicsGetCurrentContext()! 

     draw(in: targetRect) 

     // Drawing a transparent mask 
     UIColor.black.withAlphaComponent(0.4).setFill() 
     context.fill(targetRect) 

     // Drawing bar 
     UIColor.white.setFill() 
     context.fill(someBarRect) 

     return UIGraphicsGetImageFromCurrentContext() 
    } 

    UIGraphicsBeginImageContextWithOptions(targetRect.size, false, 0) 
    defer { UIGraphicsEndImageContext() } 
    let context = UIGraphicsGetCurrentContext()! 

    // Drawing image 
    clippedPath.addClip() 
    makeImage()?.draw(in: targetRect) 

    return UIGraphicsGetImageFromCurrentImageContext() 
    } 
} 

Answer 1

所以好像這一缺陷有事情做與UIBezierPath(roundedRect: targetRect, cornerRadius: 8).addClip()，我嘗試面具在步驟1中添加圖像，在步驟2中的代碼是像添加角落圖像此

extension UIImage { 
func thumbnails() -> UIImage? { 
    let targetRect = CGRect(x: 0, y: 0, width: 100, height: 150) 

    UIGraphicsBeginImageContextWithOptions(targetRect.size, false, 0) 
    defer { 
     UIGraphicsEndImageContext() 
    } 

    UIBezierPath(roundedRect: targetRect, cornerRadius: 8).addClip() 

    let makedImage = self.makedImage() 

    makedImage?.draw(in : targetRect) 

    return UIGraphicsGetImageFromCurrentImageContext() 
} 


func makedImage()->UIImage?{ 
    let targetRect = CGRect(x: 0, y: 0, width: 100, height: 150) 
    let someBarRect = CGRect(x: 0, y: 100, width: 100, height: 50) 

    UIGraphicsBeginImageContextWithOptions(targetRect.size, false, 0) 
    defer { 
     UIGraphicsEndImageContext() 
    } 
    let context = UIGraphicsGetCurrentContext()! 

    draw(in : targetRect) 


    // Drawing a transparent mask 
    UIColor.black.withAlphaComponent(0.4).setFill() 
    context.fill(targetRect) 

    // Drawing bar 
    UIColor.white.withAlphaComponent(1).setFill() 
    context.fill(someBarRect) 

    return UIGraphicsGetImageFromCurrentImageContext() 
} 
}