FeatureIcons.swift 17 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329
  1. import Cocoa
  2. enum FeatureIconKind {
  3. case scanFile
  4. case printText
  5. case printContacts
  6. case printWebsite
  7. case drawPrint
  8. case ocrFile
  9. }
  10. final class FeatureIconView: NSView {
  11. private let kind: FeatureIconKind
  12. init(kind: FeatureIconKind) {
  13. self.kind = kind
  14. super.init(frame: .zero)
  15. translatesAutoresizingMaskIntoConstraints = false
  16. setContentHuggingPriority(.required, for: .horizontal)
  17. setContentHuggingPriority(.required, for: .vertical)
  18. setContentCompressionResistancePriority(.required, for: .horizontal)
  19. setContentCompressionResistancePriority(.required, for: .vertical)
  20. }
  21. @available(*, unavailable)
  22. required init?(coder: NSCoder) { nil }
  23. override var isFlipped: Bool { true }
  24. override var isOpaque: Bool { false }
  25. override func draw(_ dirtyRect: NSRect) {
  26. super.draw(dirtyRect)
  27. guard let context = NSGraphicsContext.current?.cgContext else { return }
  28. switch kind {
  29. case .scanFile: drawScanFile(in: context)
  30. case .printText: drawPrintText(in: context)
  31. case .printContacts: drawPrintContacts(in: context)
  32. case .printWebsite: drawPrintWebsite(in: context)
  33. case .drawPrint: drawDrawPrint(in: context)
  34. case .ocrFile: drawOCRFile(in: context)
  35. }
  36. }
  37. // MARK: - Layout
  38. /// Shared artboard so every icon fills the same visual area.
  39. private struct IconLayout {
  40. let fill: CGRect
  41. let d: CGFloat
  42. init(bounds: NSRect) {
  43. let side = min(bounds.width, bounds.height)
  44. let originX = (bounds.width - side) / 2
  45. let originY = (bounds.height - side) / 2
  46. let inset = side * 0.12
  47. fill = CGRect(x: originX + inset, y: originY + inset, width: side - inset * 2, height: side - inset * 2)
  48. d = fill.width
  49. }
  50. func rect(_ x: CGFloat, _ y: CGFloat, _ w: CGFloat, _ h: CGFloat) -> CGRect {
  51. CGRect(
  52. x: fill.minX + fill.width * x,
  53. y: fill.minY + fill.height * y,
  54. width: fill.width * w,
  55. height: fill.height * h
  56. )
  57. }
  58. func dim(_ fraction: CGFloat) -> CGFloat {
  59. d * fraction
  60. }
  61. }
  62. // MARK: - Scan File
  63. private func drawScanFile(in context: CGContext) {
  64. let layout = IconLayout(bounds: bounds)
  65. let bodyRect = layout.rect(0.08, 0.38, 0.84, 0.50)
  66. drawSoftShadow(in: context, rect: CGRect(x: bodyRect.minX, y: bodyRect.maxY - layout.dim(0.03), width: bodyRect.width, height: layout.dim(0.05)), radius: layout.dim(0.025))
  67. let blueTop = NSColor(red: 0.38, green: 0.66, blue: 1.0, alpha: 1)
  68. let blueBottom = NSColor(red: 0.18, green: 0.44, blue: 0.94, alpha: 1)
  69. fillGradient(in: context, path: roundedRect(bodyRect, radius: layout.dim(0.06)), colors: [blueTop.cgColor, blueBottom.cgColor], start: CGPoint(x: bodyRect.midX, y: bodyRect.minY), end: CGPoint(x: bodyRect.midX, y: bodyRect.maxY))
  70. let glassRect = CGRect(x: bodyRect.minX + layout.dim(0.06), y: bodyRect.minY + layout.dim(0.05), width: bodyRect.width * 0.84, height: bodyRect.height * 0.52)
  71. context.setFillColor(NSColor.white.withAlphaComponent(0.25).cgColor)
  72. context.addPath(roundedRect(glassRect, radius: layout.dim(0.03)))
  73. context.fillPath()
  74. let lidRect = layout.rect(0.06, 0.22, 0.88, 0.18)
  75. fillGradient(in: context, path: roundedRect(lidRect, radius: layout.dim(0.04)), colors: [NSColor(red: 0.55, green: 0.76, blue: 1.0, alpha: 1).cgColor, blueTop.cgColor], start: CGPoint(x: lidRect.midX, y: lidRect.minY), end: CGPoint(x: lidRect.midX, y: lidRect.maxY))
  76. let paperRect = layout.rect(0.28, 0.06, 0.44, 0.20)
  77. context.setFillColor(NSColor.white.cgColor)
  78. context.addPath(roundedRect(paperRect, radius: layout.dim(0.02)))
  79. context.fillPath()
  80. for i in 0..<3 {
  81. let lineY = paperRect.minY + layout.dim(0.06) + CGFloat(i) * layout.dim(0.045)
  82. let lineW = paperRect.width * (0.85 - CGFloat(i) * 0.1)
  83. context.setFillColor(NSColor(red: 0.72, green: 0.82, blue: 0.98, alpha: 1).cgColor)
  84. context.addPath(roundedRect(CGRect(x: paperRect.minX + layout.dim(0.05), y: lineY, width: lineW, height: layout.dim(0.025)), radius: layout.dim(0.01)))
  85. context.fillPath()
  86. }
  87. let lightRect = CGRect(x: bodyRect.maxX - layout.dim(0.14), y: bodyRect.minY + layout.dim(0.08), width: layout.dim(0.06), height: layout.dim(0.06))
  88. context.setFillColor(NSColor(red: 0.30, green: 0.90, blue: 0.55, alpha: 1).cgColor)
  89. context.fillEllipse(in: lightRect)
  90. }
  91. // MARK: - Print Text
  92. private func drawPrintText(in context: CGContext) {
  93. let layout = IconLayout(bounds: bounds)
  94. let frameRect = layout.rect(0.08, 0.08, 0.84, 0.84)
  95. drawSoftShadow(in: context, rect: frameRect.insetBy(dx: layout.dim(0.04), dy: -layout.dim(0.02)), radius: layout.dim(0.03))
  96. context.setStrokeColor(NSColor(red: 0.62, green: 0.44, blue: 0.96, alpha: 1).cgColor)
  97. context.setLineWidth(layout.dim(0.03))
  98. context.setLineDash(phase: 0, lengths: [layout.dim(0.04), layout.dim(0.04)])
  99. context.addPath(roundedRect(frameRect, radius: layout.dim(0.04)))
  100. context.strokePath()
  101. context.setLineDash(phase: 0, lengths: [])
  102. let purple = NSColor(red: 0.55, green: 0.36, blue: 0.96, alpha: 1)
  103. let font = NSFont.systemFont(ofSize: layout.dim(0.40), weight: .bold)
  104. let attrs: [NSAttributedString.Key: Any] = [.font: font, .foregroundColor: purple]
  105. let text = "T" as NSString
  106. let textSize = text.size(withAttributes: attrs)
  107. text.draw(at: CGPoint(x: frameRect.midX - textSize.width / 2, y: frameRect.midY - textSize.height / 2), withAttributes: attrs)
  108. }
  109. // MARK: - Print Contacts
  110. private func drawPrintContacts(in context: CGContext) {
  111. let layout = IconLayout(bounds: bounds)
  112. let bookRect = layout.rect(0.08, 0.08, 0.84, 0.84)
  113. drawSoftShadow(in: context, rect: CGRect(x: bookRect.minX, y: bookRect.maxY - layout.dim(0.03), width: bookRect.width, height: layout.dim(0.05)), radius: layout.dim(0.025))
  114. let greenTop = NSColor(red: 0.42, green: 0.86, blue: 0.52, alpha: 1)
  115. let greenBottom = NSColor(red: 0.18, green: 0.68, blue: 0.38, alpha: 1)
  116. fillGradient(in: context, path: roundedRect(bookRect, radius: layout.dim(0.05)), colors: [greenTop.cgColor, greenBottom.cgColor], start: CGPoint(x: bookRect.midX, y: bookRect.minY), end: CGPoint(x: bookRect.midX, y: bookRect.maxY))
  117. let spineRect = CGRect(x: bookRect.minX, y: bookRect.minY, width: layout.dim(0.08), height: bookRect.height)
  118. context.setFillColor(NSColor(red: 0.12, green: 0.52, blue: 0.30, alpha: 1).cgColor)
  119. context.addPath(roundedRect(spineRect, radius: layout.dim(0.02), topLeft: layout.dim(0.05), topRight: 0, bottomLeft: layout.dim(0.05), bottomRight: 0))
  120. context.fillPath()
  121. let tabColors: [NSColor] = [
  122. NSColor(red: 0.96, green: 0.55, blue: 0.55, alpha: 1),
  123. NSColor(red: 0.55, green: 0.72, blue: 0.96, alpha: 1),
  124. NSColor(red: 0.96, green: 0.82, blue: 0.40, alpha: 1),
  125. ]
  126. for (i, color) in tabColors.enumerated() {
  127. let tabRect = CGRect(x: bookRect.maxX - layout.dim(0.02), y: bookRect.minY + layout.dim(0.10) + CGFloat(i) * layout.dim(0.14), width: layout.dim(0.10), height: layout.dim(0.10))
  128. context.setFillColor(color.cgColor)
  129. context.addPath(roundedRect(tabRect, radius: layout.dim(0.02), topLeft: 0, topRight: layout.dim(0.02), bottomLeft: 0, bottomRight: layout.dim(0.02)))
  130. context.fillPath()
  131. }
  132. let personCenter = CGPoint(x: bookRect.midX - layout.dim(0.02), y: bookRect.midY + layout.dim(0.04))
  133. context.setFillColor(NSColor.white.cgColor)
  134. context.fillEllipse(in: CGRect(x: personCenter.x - layout.dim(0.10), y: personCenter.y - layout.dim(0.16), width: layout.dim(0.20), height: layout.dim(0.20)))
  135. context.fillEllipse(in: CGRect(x: personCenter.x - layout.dim(0.14), y: personCenter.y + layout.dim(0.02), width: layout.dim(0.28), height: layout.dim(0.22)))
  136. }
  137. // MARK: - Print Website
  138. private func drawPrintWebsite(in context: CGContext) {
  139. let layout = IconLayout(bounds: bounds)
  140. let globeRect = layout.rect(0.08, 0.08, 0.84, 0.84)
  141. drawSoftShadow(in: context, rect: globeRect.insetBy(dx: 0, dy: -layout.dim(0.03)), radius: layout.dim(0.03))
  142. let blueTop = NSColor(red: 0.40, green: 0.70, blue: 1.0, alpha: 1)
  143. let blueBottom = NSColor(red: 0.16, green: 0.44, blue: 0.92, alpha: 1)
  144. fillGradient(in: context, path: CGPath(ellipseIn: globeRect, transform: nil), colors: [blueTop.cgColor, blueBottom.cgColor], start: CGPoint(x: globeRect.midX, y: globeRect.minY), end: CGPoint(x: globeRect.midX, y: globeRect.maxY))
  145. context.setStrokeColor(NSColor.white.withAlphaComponent(0.55).cgColor)
  146. context.setLineWidth(layout.dim(0.018))
  147. context.strokeEllipse(in: globeRect.insetBy(dx: globeRect.width * 0.15, dy: 0))
  148. context.strokeEllipse(in: globeRect.insetBy(dx: 0, dy: globeRect.height * 0.22))
  149. context.move(to: CGPoint(x: globeRect.minX, y: globeRect.midY))
  150. context.addLine(to: CGPoint(x: globeRect.maxX, y: globeRect.midY))
  151. context.strokePath()
  152. let cursorSize = layout.dim(0.22)
  153. let cursorOrigin = CGPoint(x: layout.fill.maxX - layout.dim(0.12), y: layout.fill.minY + layout.fill.height * 0.42)
  154. context.setFillColor(NSColor.white.cgColor)
  155. let cursor = CGMutablePath()
  156. cursor.move(to: cursorOrigin)
  157. cursor.addLine(to: CGPoint(x: cursorOrigin.x, y: cursorOrigin.y + cursorSize))
  158. cursor.addLine(to: CGPoint(x: cursorOrigin.x + cursorSize * 0.35, y: cursorOrigin.y + cursorSize * 0.72))
  159. cursor.closeSubpath()
  160. context.addPath(cursor)
  161. context.fillPath()
  162. context.setStrokeColor(NSColor(red: 0.30, green: 0.50, blue: 0.90, alpha: 1).cgColor)
  163. context.setLineWidth(layout.dim(0.02))
  164. context.addPath(cursor)
  165. context.strokePath()
  166. }
  167. // MARK: - Draw & Print
  168. private func drawDrawPrint(in context: CGContext) {
  169. let layout = IconLayout(bounds: bounds)
  170. let paletteRect = layout.rect(0.06, 0.14, 0.80, 0.72)
  171. drawSoftShadow(in: context, rect: CGRect(x: paletteRect.minX, y: paletteRect.maxY - layout.dim(0.02), width: paletteRect.width, height: layout.dim(0.04)), radius: layout.dim(0.025))
  172. let woodTop = NSColor(red: 0.96, green: 0.78, blue: 0.48, alpha: 1)
  173. let woodBottom = NSColor(red: 0.86, green: 0.58, blue: 0.28, alpha: 1)
  174. let palettePath = paletteShape(in: paletteRect)
  175. fillGradient(in: context, path: palettePath, colors: [woodTop.cgColor, woodBottom.cgColor], start: CGPoint(x: paletteRect.midX, y: paletteRect.minY), end: CGPoint(x: paletteRect.midX, y: paletteRect.maxY))
  176. let paintColors: [NSColor] = [
  177. NSColor(red: 0.96, green: 0.35, blue: 0.35, alpha: 1),
  178. NSColor(red: 0.35, green: 0.65, blue: 0.96, alpha: 1),
  179. NSColor(red: 0.35, green: 0.82, blue: 0.45, alpha: 1),
  180. NSColor(red: 0.96, green: 0.78, blue: 0.25, alpha: 1),
  181. NSColor(red: 0.72, green: 0.40, blue: 0.96, alpha: 1),
  182. ]
  183. let thumbCenter = CGPoint(x: paletteRect.minX + paletteRect.width * 0.18, y: paletteRect.midY)
  184. for (i, color) in paintColors.enumerated() {
  185. let angle = CGFloat(i) * .pi * 0.32 - .pi * 0.5
  186. let radius = paletteRect.width * 0.28
  187. let dotCenter = CGPoint(x: thumbCenter.x + cos(angle) * radius, y: thumbCenter.y + sin(angle) * radius * 0.55)
  188. let dotSize = layout.dim(0.09)
  189. context.setFillColor(color.cgColor)
  190. context.fillEllipse(in: CGRect(x: dotCenter.x - dotSize / 2, y: dotCenter.y - dotSize / 2, width: dotSize, height: dotSize))
  191. }
  192. context.saveGState()
  193. context.translateBy(x: layout.fill.minX + layout.fill.width * 0.58, y: layout.fill.minY + layout.fill.height * 0.04)
  194. context.rotate(by: -.pi / 5)
  195. let brushRect = CGRect(x: 0, y: 0, width: layout.dim(0.10), height: layout.dim(0.44))
  196. fillGradient(in: context, path: roundedRect(brushRect, radius: layout.dim(0.02)), colors: [NSColor(red: 0.72, green: 0.48, blue: 0.28, alpha: 1).cgColor, NSColor(red: 0.52, green: 0.32, blue: 0.18, alpha: 1).cgColor], start: CGPoint(x: brushRect.midX, y: brushRect.minY), end: CGPoint(x: brushRect.midX, y: brushRect.maxY))
  197. let bristleRect = CGRect(x: brushRect.midX - layout.dim(0.05), y: brushRect.maxY - layout.dim(0.02), width: layout.dim(0.10), height: layout.dim(0.10))
  198. context.setFillColor(NSColor(red: 0.96, green: 0.55, blue: 0.30, alpha: 1).cgColor)
  199. context.fillEllipse(in: bristleRect)
  200. context.restoreGState()
  201. }
  202. private func paletteShape(in rect: CGRect) -> CGPath {
  203. let path = CGMutablePath()
  204. path.addEllipse(in: rect)
  205. let thumb = CGRect(x: rect.minX - rect.width * 0.08, y: rect.midY - rect.height * 0.18, width: rect.width * 0.22, height: rect.height * 0.36)
  206. path.addEllipse(in: thumb)
  207. return path
  208. }
  209. // MARK: - OCR File
  210. private func drawOCRFile(in context: CGContext) {
  211. let layout = IconLayout(bounds: bounds)
  212. let docRect = layout.rect(0.08, 0.06, 0.84, 0.88)
  213. drawSoftShadow(in: context, rect: CGRect(x: docRect.minX, y: docRect.maxY - layout.dim(0.03), width: docRect.width, height: layout.dim(0.05)), radius: layout.dim(0.025))
  214. context.setFillColor(NSColor.white.cgColor)
  215. context.addPath(roundedRect(docRect, radius: layout.dim(0.04)))
  216. context.fillPath()
  217. let purpleTop = NSColor(red: 0.62, green: 0.44, blue: 0.96, alpha: 1)
  218. let purpleBottom = NSColor(red: 0.45, green: 0.28, blue: 0.86, alpha: 1)
  219. let headerRect = CGRect(x: docRect.minX, y: docRect.minY, width: docRect.width, height: layout.dim(0.18))
  220. fillGradient(in: context, path: roundedRect(headerRect, radius: layout.dim(0.04), topLeft: layout.dim(0.04), topRight: layout.dim(0.04), bottomLeft: 0, bottomRight: 0), colors: [purpleTop.cgColor, purpleBottom.cgColor], start: CGPoint(x: headerRect.midX, y: headerRect.minY), end: CGPoint(x: headerRect.midX, y: headerRect.maxY))
  221. let font = NSFont.systemFont(ofSize: layout.dim(0.14), weight: .bold)
  222. let attrs: [NSAttributedString.Key: Any] = [.font: font, .foregroundColor: NSColor.white]
  223. let text = "OCR" as NSString
  224. let textSize = text.size(withAttributes: attrs)
  225. text.draw(at: CGPoint(x: docRect.midX - textSize.width / 2, y: docRect.minY + layout.dim(0.04)), withAttributes: attrs)
  226. let lineColor = NSColor(red: 0.78, green: 0.72, blue: 0.96, alpha: 1)
  227. for i in 0..<4 {
  228. let lineY = docRect.minY + layout.dim(0.24) + CGFloat(i) * layout.dim(0.10)
  229. let lineW = docRect.width * (0.80 - CGFloat(i) * 0.08)
  230. context.setFillColor(lineColor.cgColor)
  231. context.addPath(roundedRect(CGRect(x: docRect.minX + layout.dim(0.08), y: lineY, width: lineW, height: layout.dim(0.035)), radius: layout.dim(0.012)))
  232. context.fillPath()
  233. }
  234. }
  235. // MARK: - Helpers
  236. private func drawSoftShadow(in context: CGContext, rect: CGRect, radius: CGFloat) {
  237. context.saveGState()
  238. context.setFillColor(NSColor.black.withAlphaComponent(0.10).cgColor)
  239. context.addPath(roundedRect(rect.offsetBy(dx: 0, dy: radius * 0.2), radius: radius))
  240. context.fillPath()
  241. context.restoreGState()
  242. }
  243. private func fillGradient(in context: CGContext, path: CGPath, colors: [CGColor], start: CGPoint, end: CGPoint) {
  244. context.saveGState()
  245. context.addPath(path)
  246. context.clip()
  247. guard let gradient = CGGradient(colorsSpace: CGColorSpaceCreateDeviceRGB(), colors: colors as CFArray, locations: [0, 1]) else {
  248. context.restoreGState()
  249. return
  250. }
  251. context.drawLinearGradient(gradient, start: start, end: end, options: [])
  252. context.restoreGState()
  253. }
  254. private func roundedRect(_ rect: CGRect, radius: CGFloat) -> CGPath {
  255. roundedRect(rect, radius: radius, topLeft: radius, topRight: radius, bottomLeft: radius, bottomRight: radius)
  256. }
  257. private func roundedRect(_ rect: CGRect, radius: CGFloat, topLeft: CGFloat, topRight: CGFloat, bottomLeft: CGFloat, bottomRight: CGFloat) -> CGPath {
  258. let path = CGMutablePath()
  259. path.move(to: CGPoint(x: rect.minX + topLeft, y: rect.maxY))
  260. path.addLine(to: CGPoint(x: rect.maxX - topRight, y: rect.maxY))
  261. path.addQuadCurve(to: CGPoint(x: rect.maxX, y: rect.maxY - topRight), control: CGPoint(x: rect.maxX, y: rect.maxY))
  262. path.addLine(to: CGPoint(x: rect.maxX, y: rect.minY + bottomRight))
  263. path.addQuadCurve(to: CGPoint(x: rect.maxX - bottomRight, y: rect.minY), control: CGPoint(x: rect.maxX, y: rect.minY))
  264. path.addLine(to: CGPoint(x: rect.minX + bottomLeft, y: rect.minY))
  265. path.addQuadCurve(to: CGPoint(x: rect.minX, y: rect.minY + bottomLeft), control: CGPoint(x: rect.minX, y: rect.minY))
  266. path.addLine(to: CGPoint(x: rect.minX, y: rect.maxY - topLeft))
  267. path.addQuadCurve(to: CGPoint(x: rect.minX + topLeft, y: rect.maxY), control: CGPoint(x: rect.minX, y: rect.maxY))
  268. path.closeSubpath()
  269. return path
  270. }
  271. }