• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

ios - UIBezierPath 绘制矩形以及所需的圆

[复制链接]
菜鸟教程小白 发表于 2022-12-11 19:46:28 | 显示全部楼层 |阅读模式 打印 上一主题 下一主题

我正在尝试使用 UIBezierPath(rect 构造函数绘制圆形,但随着圆形 - 矩形形状也被绘制为框架并且可见。这是我的代码:

class ProgressView: UIView {
let progressLayer = CustomShapeLayer()//declared below this class
override init(frame: CGRect) {
    super.init(frame: frame)
    self.isOpaque = false
}

required init?(coder aDecoder: NSCoder) {
    super.init(coder: aDecoder)

}
override func draw(_ rect: CGRect) {
    let bounds = self.layer.bounds
    let centerX = bounds.midX
    let centerY = bounds.midY

    let upperCenterPoint = CGPoint(x: centerX, y: (centerY))
    let arcPathStartAngle: CGFloat = 2 * .pi
    let arcPathEndAngle: CGFloat = 0.0
    let radius: CGFloat = bounds.size.width / 3

    print(centerX, centerY, radius, "dim")

    let strokeWidth: CGFloat = 1//to show rect being formed
    let arcPath = UIBezierPath(rect: bounds.insetBy(dx: -strokeWidth, dy: -strokeWidth))

    arcPath.move(to: CGPoint(x: centerX + radius, y: centerY))
    arcPath.addArc(withCenter: upperCenterPoint, radius: radius, startAngle: arcPathStartAngle, endAngle: arcPathEndAngle, clockwise: false)
    arcPath.close()

    progressLayer.strokeColor = UIColor.white.cgColor
    progressLayer.path = arcPath.cgPath
    self.layer.addSublayer(progressLayer)

    let animateStrokeEnd = CABasicAnimation(keyPath: "strokeEnd")
    animateStrokeEnd.duration = 2.0
    animateStrokeEnd.fromValue = 0.0
    animateStrokeEnd.toValue = 1.0

    progressLayer.add(animateStrokeEnd, forKey: "animate stroke end animation")
}
}

//subclassing
class CustomShapeLayer: CAShapeLayer {
override init() {
    super.init()

    self.fillColor = UIColor.clear.cgColor
    self.lineWidth = CGFloat(5*Double.pi)
    self.lineCap = kCALineCapRound
}

required init?(coder aDecoder: NSCoder) {
    fatalError("init(coder has not been implemented")
}
}

我不需要将矩形绘制为框架,我是否只需要使用 UIBezierPath 空构造函数(因为它服务于目的),并且不能使用 UIBezierPath(rect 构造函数是否相同?



Best Answer-推荐答案


替换这个 let arcPath = UIBezierPath() 的贝塞尔路径初始化您的问题是您正在使用 UIBezierPath(rect: 进行初始化,它会创建一个矩形路径可以在这张图片中看到

enter image description here

完整的绘制方法代码

override func draw(_ rect: CGRect) {
    let bounds = self.layer.bounds
    let centerX = bounds.midX
    let centerY = bounds.midY

    let upperCenterPoint = CGPoint(x: centerX, y: (centerY))
    let arcPathStartAngle: CGFloat = 2 * .pi
    let arcPathEndAngle: CGFloat = 0.0
    let radius: CGFloat = bounds.size.width / 3

    print(centerX, centerY, radius, "dim")

    let strokeWidth: CGFloat = 1//to show rect being formed
    let arcPath = UIBezierPath()
    arcPath.move(to: CGPoint(x: centerX + radius, y: centerY))
    arcPath.addArc(withCenter: upperCenterPoint, radius: radius, startAngle: arcPathStartAngle, endAngle: arcPathEndAngle, clockwise: false)
    arcPath.close()

    progressLayer.strokeColor = UIColor.white.cgColor
    progressLayer.path = arcPath.cgPath
    self.layer.addSublayer(progressLayer)

    let animateStrokeEnd = CABasicAnimation(keyPath: "strokeEnd")
    animateStrokeEnd.duration = 2.0
    animateStrokeEnd.fromValue = 0.0
    animateStrokeEnd.toValue = 1.0

    progressLayer.add(animateStrokeEnd, forKey: "animate stroke end animation")
}

关于ios - UIBezierPath 绘制矩形以及所需的圆,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48884015/

回复

使用道具 举报

懒得打字嘛,点击右侧快捷回复 【右侧内容,后台自定义】
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

关注0

粉丝2

帖子830918

发布主题
阅读排行 更多
广告位

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap