Skip to content

Commit

Permalink
Update "groove" size for separate adjustment of lines width
Browse files Browse the repository at this point in the history
  • Loading branch information
alxrguz committed Oct 13, 2020
1 parent 5692c05 commit 35a510b
Show file tree
Hide file tree
Showing 3 changed files with 41 additions and 7 deletions.
2 changes: 1 addition & 1 deletion ALProgressRing.podspec
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
Pod::Spec.new do |spec|
spec.name = "ALProgressRing"
spec.version = "1.0.0"
spec.version = "1.1.0"
spec.summary = "Animated and fully customizable progress ring with gradient"

spec.homepage = "https://github.com/alxrguz/ALProgressRing"
Expand Down
8 changes: 6 additions & 2 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -127,8 +127,12 @@ progressRing.startAngle = -.pi / 2 // The start angle of the ring to begin drawi
progressRing.endAngle = 1.5 * .pi // The end angle of the ring to end drawing.
progressRing.startGradientPoint = .init(x: 0.5, y: 0) // The starting poin of the gradient
progressRing.endGradientPoint = .init(x: 0.5, y: 1) // The ending position of the gradient.
progressRing.ringWidth = 10 // Width of the progress ring.
progressRing.grooveWidth = 8 // Width of the background "groove" ring.

// Sets the line width for progress ring and "groove" ring
progressRing.lineWidth = 10
// Or, if you need to separate these parameters, use
progressRing.ringWidth = 10
progressRing.grooveWidth = 8
```


Expand Down
38 changes: 34 additions & 4 deletions Sources/ALProgressRing/Views/ALProgressRing.swift
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,16 @@ import UIKit
open class ALProgressRing: UIView {

// MARK: Properties

/// Sets the line width for progress ring and groove ring.
/// - Note: If you need separate customization use the `ringWidth` and `grooveWidth` properties
public var lineWidth: CGFloat = 10 {
didSet {
ringWidth = lineWidth
grooveWidth = lineWidth
}
}

/// The line width of the progress ring.
public var ringWidth: CGFloat = 10 {
didSet {
Expand Down Expand Up @@ -82,8 +92,21 @@ open class ALProgressRing: UIView {
public var timingFunction: ALTimingFunction = .easeOutExpo

/// The radius of the ring.
public var radius: CGFloat {
return min(bounds.height, bounds.width) / 2 - ringWidth / 2
public var ringRadius: CGFloat {
var radius = min(bounds.height, bounds.width) / 2 - ringWidth / 2
if ringWidth < grooveWidth {
radius -= (grooveWidth - ringWidth) / 2
}
return radius
}

/// The radius of the groove.
public var grooveRadius: CGFloat {
var radius = min(bounds.height, bounds.width) / 2 - grooveWidth / 2
if grooveWidth < ringWidth {
radius -= (ringWidth - grooveWidth) / 2
}
return radius
}

/// The progress of the ring between 0 and 1. The ring will fill based on the value.
Expand Down Expand Up @@ -196,8 +219,9 @@ open class ALProgressRing: UIView {

private func configureRing() {
let ringPath = self.ringPath()
let groovePath = self.groovePath()
grooveLayer.frame = bounds
grooveLayer.path = ringPath
grooveLayer.path = groovePath

ringLayer.frame = bounds
ringLayer.path = ringPath
Expand All @@ -208,7 +232,13 @@ open class ALProgressRing: UIView {

private func ringPath() -> CGPath {
let center = CGPoint(x: bounds.origin.x + frame.width / 2.0, y: bounds.origin.y + frame.height / 2.0)
let circlePath = UIBezierPath(arcCenter: center, radius: radius, startAngle: startAngle, endAngle: endAngle, clockwise: true)
let circlePath = UIBezierPath(arcCenter: center, radius: ringRadius, startAngle: startAngle, endAngle: endAngle, clockwise: true)
return circlePath.cgPath
}

private func groovePath() -> CGPath {
let center = CGPoint(x: bounds.origin.x + frame.width / 2.0, y: bounds.origin.y + frame.height / 2.0)
let circlePath = UIBezierPath(arcCenter: center, radius: grooveRadius, startAngle: startAngle, endAngle: endAngle, clockwise: true)
return circlePath.cgPath
}
}

0 comments on commit 35a510b

Please sign in to comment.