iOS中如何绘制圆形？Swift实现外层圆形方法咨询

嘿，我来帮你搞定这个外层圆形的绘制！在iOS用Swift开发时，根据你使用的是UIKit还是SwiftUI，有几种简单靠谱的实现方式，我都给你整理好了：

方法一：UIKit 用 UIView 的 Layer 快速实现（适合纯色边框） #

这是最省心的方式，适合只需要纯色边框的外层圆形：

import UIKit

class ViewController: UIViewController {
    override func viewDidLoad() {
        super.viewDidLoad()
        
        // 创建一个用于承载圆形的View
        let outerCircleView = UIView()
        outerCircleView.translatesAutoresizingMaskIntoConstraints = false
        outerCircleView.backgroundColor = .clear // 内部透明，只显示边框
        view.addSubview(outerCircleView)
        
        // 设置约束（比如让圆形居中，宽高200）
        NSLayoutConstraint.activate([
            outerCircleView.centerXAnchor.constraint(equalTo: view.centerXAnchor),
            outerCircleView.centerYAnchor.constraint(equalTo: view.centerYAnchor),
            outerCircleView.widthAnchor.constraint(equalToConstant: 200),
            outerCircleView.heightAnchor.constraint(equalToConstant: 200)
        ])
        
        // 关键：设置圆角为宽高的一半，变成圆形
        outerCircleView.layer.cornerRadius = 100 // 200/2
        outerCircleView.layer.masksToBounds = true
        // 设置外层边框的宽度和颜色
        outerCircleView.layer.borderWidth = 4
        outerCircleView.layer.borderColor = UIColor.systemBlue.cgColor
    }
}

划重点：如果用Auto Layout，不要在viewDidLoad里直接根据frame计算cornerRadius（此时frame还没确定），可以把cornerRadius的设置放到layoutSubviews()方法里：

override func layoutSubviews() {
    super.layoutSubviews()
    outerCircleView.layer.cornerRadius = outerCircleView.bounds.width / 2
}

方法二：UIKit 用 CAShapeLayer 实现（适合复杂边框） #

如果需要渐变边框、虚线边框这类更定制化的效果，用CAShapeLayer会更灵活：

import UIKit

class ViewController: UIViewController {
    override func viewDidLoad() {
        super.viewDidLoad()
        
        // 创建圆形路径
        let circlePath = UIBezierPath(ovalIn: CGRect(x: 100, y: 100, width: 200, height: 200))
        
        // 创建ShapeLayer
        let circleLayer = CAShapeLayer()
        circleLayer.path = circlePath.cgPath
        circleLayer.fillColor = UIColor.clear.cgColor // 内部透明
        circleLayer.strokeColor = UIColor.systemGreen.cgColor // 边框颜色
        circleLayer.lineWidth = 4 // 边框宽度
        // 如果要虚线边框，加上这行：
        // circleLayer.lineDashPattern = [8, 4]
        
        view.layer.addSublayer(circleLayer)
    }
}

方法三：SwiftUI 实现（更简洁） #

如果是用SwiftUI开发，一行代码就能搞定：

import SwiftUI

struct ContentView: View {
    var body: some View {
        // 外层圆形：stroke是边框，frame控制大小
        Circle()
            .stroke(Color.purple, lineWidth: 4)
            .frame(width: 200, height: 200)
            .background(Color.white) // 背景色根据需求调整
    }
}

如果需要更复杂的样式，比如渐变边框，可以用stroke(style:)结合LinearGradient：

Circle()
    .stroke(
        LinearGradient(gradient: Gradient(colors: [.red, .yellow]), startPoint: .top, endPoint: .bottom),
        lineWidth: 4
    )
    .frame(width: 200, height: 200)

内容的提问来源于stack exchange，提问作者Rahul Chopra