【Swift4】円型の枠線付きUIViewを作成したら枠線の外側に不要な線が表示されてしまう

Question

前提・実現したいこと

swift4にて、太い枠を付けた円をUIViewで作成したいのですが、いつもは気にならない現象に気づいてしまいました。
これについてご教授いただきたいです。
↓にPlayGroundのコードを記載しています。

発生している問題・エラーメッセージ

赤色の円をUIViewで作成し、白い枠線を設定しています。
すると、枠線の外側にうっすら赤い線が見えてしまいます。
どうしたらこのうっすら線が見えずにきれいな枠線付き円を表現できますか？

該当のソースコード

//: A UIKit based Playground for presenting user interface
  
import UIKit
import PlaygroundSupport

class MyViewController : UIViewController {
    override func loadView() {
        let view = UIView()
        view.backgroundColor = .white
        
        let circle = UIView()
        circle.frame = CGRect(x: 10, y: 10, width: 300, height: 300)
        circle.backgroundColor = .red
        circle.layer.cornerRadius = 150
        circle.layer.borderColor = UIColor.white.cgColor
        circle.layer.borderWidth = 50

        
        view.addSubview(circle)
        self.view = view
    }
}
// Present the view controller in the Live View window
PlaygroundPage.current.liveView = MyViewController()

試したこと

現場で遭遇した現象で、試しにPlayGroundでも実装してみたところ再現されました。
同じ状況で困っている人が見当たらなかったので質問させていただきました。

補足情報（FW/ツールのバージョンなど）

swift4、xcode10.3を使用しています。

Answer 1

アンチエイリアシングの都合上仕方なくそうなるのかなと思います。

stackoverflowで回避されている方がいらっしゃしました。
参考：
https://stackoverflow.com/a/47168684

ちょっとリンク先のコードだとマスクを無駄に作っている気がしたので、以下でもいいのかなとは思いました。
(layer.maskではなくclipToBoundsで代用）

import UIKit

extension UIView {
    
    fileprivate var bezierPathIdentifier:String { return "bezierPathBorderLayer" }
    
    fileprivate var bezierPathBorder:CAShapeLayer? {
        return (self.layer.sublayers?.filter({ (layer) -> Bool in
            return layer.name == self.bezierPathIdentifier && (layer as? CAShapeLayer) != nil
        }) as? [CAShapeLayer])?.first
    }
    
    func bezierPathBorder(_ color:UIColor = .white, width:CGFloat = 1) {
        
        var border = self.bezierPathBorder
        self.clipsToBounds = true
        
        if border == nil {
            border = CAShapeLayer()
            border!.name = self.bezierPathIdentifier
            self.layer.addSublayer(border!)
        }
        
        border!.frame = self.bounds
        let pathUsingCorrectInsetIfAny =
            UIBezierPath(roundedRect: border!.bounds, cornerRadius:self.layer.cornerRadius)
        
        border!.path = pathUsingCorrectInsetIfAny.cgPath
        border!.fillColor = UIColor.clear.cgColor
        border!.strokeColor = color.cgColor
        border!.lineWidth = width * 2
    }
    
    func removeBezierPathBorder() {
        self.layer.mask = nil
        self.bezierPathBorder?.removeFromSuperlayer()
    }
    
}

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
        
      
        
        let circle = UIView()
        circle.frame = CGRect(x: 10, y: 10, width: 300, height: 300)
        circle.backgroundColor = .red
        circle.layer.cornerRadius = 150
        //circle.layer.borderColor = UIColor.white.cgColor
        //circle.layer.borderWidth = 50
        circle.bezierPathBorder(.white, width: 50)
        
        view.addSubview(circle)
        
        view.backgroundColor = .blue
    }


}

Comments

[0331UTTI]

アンチエイリアシングの仕様だったんですね。
いただいたコードを参考に解決できました。
回答いただきありがとうございました。