Add `pie` style

This commit is contained in:
Sindre Sorhus 2023-03-09 12:40:17 +07:00
parent df8539a39a
commit 03659c21be
4 changed files with 34 additions and 32 deletions

View File

@ -20,7 +20,8 @@ final class AppState: ObservableObject {
.bar, .bar,
.squircle(color: .systemGray), .squircle(color: .systemGray),
.circle(radius: 30, color: .white), .circle(radius: 30, color: .white),
.badge(color: .systemBlue) { Int(DockProgress.progress * 12) } .badge(color: .systemBlue) { Int(DockProgress.progress * 12) },
.pie(color: .systemBlue)
] ]
var stylesIterator = styles.makeIterator() var stylesIterator = styles.makeIterator()

View File

@ -76,6 +76,7 @@ public enum DockProgress {
case squircle(inset: Double? = nil, color: NSColor = .controlAccentColor) case squircle(inset: Double? = nil, color: NSColor = .controlAccentColor)
case circle(radius: Double, color: NSColor = .controlAccentColor) case circle(radius: Double, color: NSColor = .controlAccentColor)
case badge(color: NSColor = .controlAccentColor, badgeValue: () -> Int) case badge(color: NSColor = .controlAccentColor, badgeValue: () -> Int)
case pie(color: NSColor = .controlAccentColor)
case custom(drawHandler: (_ rect: CGRect) -> Void) case custom(drawHandler: (_ rect: CGRect) -> Void)
} }
@ -108,6 +109,8 @@ public enum DockProgress {
drawProgressCircle(dstRect, radius: radius, color: color) drawProgressCircle(dstRect, radius: radius, color: color)
case .badge(let color, let badgeValue): case .badge(let color, let badgeValue):
drawProgressBadge(dstRect, color: color, badgeLabel: badgeValue()) drawProgressBadge(dstRect, color: color, badgeLabel: badgeValue())
case .pie(let color):
drawProgressBadge(dstRect, color: color, badgeLabel: 0, isPie: true)
case .custom(let drawingHandler): case .custom(let drawingHandler):
drawingHandler(dstRect) drawingHandler(dstRect)
} }
@ -167,7 +170,7 @@ public enum DockProgress {
progressCircle.render(in: cgContext) progressCircle.render(in: cgContext)
} }
private static func drawProgressBadge(_ dstRect: CGRect, color: NSColor, badgeLabel: Int) { private static func drawProgressBadge(_ dstRect: CGRect, color: NSColor, badgeLabel: Int, isPie: Bool = false) {
guard let cgContext = NSGraphicsContext.current?.cgContext else { guard let cgContext = NSGraphicsContext.current?.cgContext else {
return return
} }
@ -185,7 +188,7 @@ public enum DockProgress {
badge.shadowPath = badge.path badge.shadowPath = badge.path
// Progress circle // Progress circle
let lineWidth = 6.0 let lineWidth = isPie ? radius : 6.0
let innerRadius = radius - lineWidth / 2 let innerRadius = radius - lineWidth / 2
let progressCircle = ProgressCircleShapeLayer(radius: innerRadius, center: newCenter) let progressCircle = ProgressCircleShapeLayer(radius: innerRadius, center: newCenter)
progressCircle.strokeColor = color.cgColor progressCircle.strokeColor = color.cgColor
@ -194,18 +197,21 @@ public enum DockProgress {
progressCircle.progress = progress progressCircle.progress = progress
// Label // Label
let dimension = badge.bounds.height - 5 if !isPie {
let rect = CGRect(origin: progressCircle.bounds.origin, size: CGSize(width: dimension, height: dimension)) let dimension = badge.bounds.height - 5
let textLayer = VerticallyCenteredTextLayer(frame: rect, center: newCenter) let rect = CGRect(origin: progressCircle.bounds.origin, size: CGSize(width: dimension, height: dimension))
let badgeText = kiloShortStringFromInt(number: badgeLabel) let textLayer = VerticallyCenteredTextLayer(frame: rect, center: newCenter)
textLayer.foregroundColor = CGColor(red: 0.23, green: 0.23, blue: 0.24, alpha: 1) let badgeText = kiloShortStringFromInt(number: badgeLabel)
textLayer.string = badgeText textLayer.foregroundColor = CGColor(red: 0.23, green: 0.23, blue: 0.24, alpha: 1)
textLayer.fontSize = scaledBadgeFontSize(text: badgeText) textLayer.string = badgeText
textLayer.font = NSFont.helveticaNeueBold textLayer.fontSize = scaledBadgeFontSize(text: badgeText)
textLayer.alignmentMode = .center textLayer.font = NSFont.helveticaNeueBold
textLayer.truncationMode = .end textLayer.alignmentMode = .center
textLayer.truncationMode = .end
badge.addSublayer(textLayer)
}
badge.addSublayer(textLayer)
badge.addSublayer(progressCircle) badge.addSublayer(progressCircle)
badge.render(in: cgContext) badge.render(in: cgContext)
} }

View File

@ -12,30 +12,15 @@ macOS 10.15+
## Install ## Install
#### Swift Package Manager
Add `https://github.com/sindresorhus/DockProgress` in the [“Swift Package Manager” tab in Xcode](https://developer.apple.com/documentation/xcode/adding_package_dependencies_to_your_app). Add `https://github.com/sindresorhus/DockProgress` in the [“Swift Package Manager” tab in Xcode](https://developer.apple.com/documentation/xcode/adding_package_dependencies_to_your_app).
*Latest version: 4.0.1* *Latest version: 4.0.1*
#### Carthage
```
github "sindresorhus/DockProgress"
```
#### CocoaPods
```ruby
pod 'DockProgress'
```
## Usage ## Usage
### Manually set the progress ### Manually set the progress
```swift ```swift
import Cocoa
import DockProgress import DockProgress
foo.onUpdate = { progress in foo.onUpdate = { progress in
@ -46,7 +31,7 @@ foo.onUpdate = { progress in
### Specify a [`Progress` instance](https://developer.apple.com/documentation/foundation/progress) ### Specify a [`Progress` instance](https://developer.apple.com/documentation/foundation/progress)
```swift ```swift
import Cocoa import Foundation
import DockProgress import DockProgress
let progress = Progress(totalUnitCount: 1) let progress = Progress(totalUnitCount: 1)
@ -59,7 +44,7 @@ The given `Progress` instance is weakly stored. It's up to you to retain it.
## Styles ## Styles
It comes with four styles. PR welcome for more. It comes with five styles. PR welcome for more.
Check out the example app in the Xcode project. Check out the example app in the Xcode project.
@ -113,7 +98,17 @@ DockProgress.style = .badge(color: .systemBlue, badgeValue: { getDownloadCount()
Large `badgeValue` numbers will be written in kilo short notation, for example, `1012``1k`. Large `badgeValue` numbers will be written in kilo short notation, for example, `1012``1k`.
Note: The `badgeValue` is not meant to be used as a numeric percentage. It's for things like count of downloads, number of files being converted, etc. **Note:** The `badgeValue` is not meant to be used as a numeric percentage. It's for things like count of downloads, number of files being converted, etc.
### Pie
![](screenshot-pie.gif)
```swift
import DockProgress
DockProgress.style = .pie(color: .systemBlue)
```
## Related ## Related

BIN
screenshot-pie.gif Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 264 KiB