GradientEditor

Screenshots

Features

Quick Start

Installation

dependencies: [
 .package(url: "https://github.com/JoshuaSullivan/GradientEditor.git", from: "1.3.0")
]

Basic Usage

import SwiftUI
import GradientEditor
struct ContentView: View {
 @State private var viewModel: GradientEditViewModel
 init() {
 // Create view model with a preset gradient
 viewModel = GradientEditViewModel(scheme: .wakeIsland) { result in
 switch result {
 case .saved(let scheme):
 print("Gradient '\(scheme.name)' saved with \(scheme.colorMap.stops.count) stops")
 // Save the gradient scheme to your app's storage
 case .cancelled:
 print("Editing cancelled")
 }
 }
 }
 var body: some View {
 GradientEditView(viewModel: viewModel)
 }
}

UIKit Usage (iOS/visionOS)

import UIKit
import GradientEditor
class MyViewController: UIViewController {
 func presentGradientEditor() {
 let editor = GradientEditorViewController(scheme: .wakeIsland) { result in
 switch result {
 case .saved(let scheme):
 self.saveGradient(scheme)
 case .cancelled:
 print("User cancelled")
 }
 self.dismiss(animated: true)
 }
 // Present modally with navigation controller
 let nav = UINavigationController(rootViewController: editor)
 present(nav, animated: true)
 }
}

class MyViewController: UIViewController, GradientEditorDelegate {
 func presentGradientEditor() {
 let editor = GradientEditorViewController(scheme: .wakeIsland)
 editor.delegate = self
 let nav = UINavigationController(rootViewController: editor)
 present(nav, animated: true)
 }
 func gradientEditor(_ editor: GradientEditorViewController, didSaveScheme scheme: GradientColorScheme) {
 saveGradient(scheme)
 dismiss(animated: true)
 }
 func gradientEditorDidCancel(_ editor: GradientEditorViewController) {
 dismiss(animated: true)
 }
}

AppKit Usage (macOS)

import AppKit
import GradientEditor
class MyViewController: NSViewController {
 func presentGradientEditor() {
 let editor = GradientEditorViewController(scheme: .wakeIsland) { result in
 switch result {
 case .saved(let scheme):
 self.saveGradient(scheme)
 case .cancelled:
 print("User cancelled")
 }
 self.dismiss(editor)
 }
 // Present as sheet
 presentAsSheet(editor)
 }
}

class MyViewController: NSViewController, GradientEditorDelegate {
 func presentGradientEditor() {
 let editor = GradientEditorViewController(scheme: .wakeIsland)
 editor.delegate = self
 presentAsSheet(editor)
 }
 func gradientEditor(_ editor: GradientEditorViewController, didSaveScheme scheme: GradientColorScheme) {
 saveGradient(scheme)
 dismiss(editor)
 }
 func gradientEditorDidCancel(_ editor: GradientEditorViewController) {
 dismiss(editor)
 }
}

Key Components

GradientEditView

GradientEditViewModel

Data Models

Example: Custom Gradient

// Create a custom gradient
let customGradient = GradientColorScheme(
 name: "Ocean Depths",
 description: "Deep blues fading to black",
 colorMap: ColorMap(stops: [
 ColorStop(position: 0.0, type: .single(.blue)),
 ColorStop(position: 0.7, type: .dual(.cyan, .black)),
 ColorStop(position: 1.0, type: .single(.black))
 ])
)
// Use it in the editor
let viewModel = GradientEditViewModel(scheme: customGradient) { result in
 // Handle result
}

Built-in Presets

Using Gradients in Your App

SwiftUI Gradients

case .saved(let scheme):
 // Linear gradient (horizontal by default)
 let linear = scheme.linearGradient()
 Rectangle().fill(linear)
 // Vertical gradient
 let vertical = scheme.linearGradient(startPoint: .top, endPoint: .bottom)
 Rectangle().fill(vertical)
 // Radial gradient
 let radial = scheme.radialGradient(
 center: .center,
 startRadius: 0,
 endRadius: 200
 )
 Circle().fill(radial)
 // Angular/Conic gradient
 let angular = scheme.angularGradient(center: .center)
 Circle().fill(angular)

UIKit - CAGradientLayer

case .saved(let scheme):
 // Create gradient layer for UIView
 let gradientLayer = scheme.caGradientLayer(
 frame: view.bounds,
 type: .axial,
 startPoint: CGPoint(x: 0, y: 0), // top-left
 endPoint: CGPoint(x: 1, y: 1) // bottom-right
 )
 view.layer.insertSublayer(gradientLayer, at: 0)
 // Radial gradient
 let radial = scheme.caGradientLayer(
 frame: view.bounds,
 type: .radial,
 startPoint: CGPoint(x: 0.5, y: 0.5),
 endPoint: CGPoint(x: 1, y: 1)
 )
 // Conic gradient
 let conic = scheme.caGradientLayer(
 frame: view.bounds,
 type: .conic,
 startPoint: CGPoint(x: 0.5, y: 0.5)
 )

AppKit - NSGradient

case .saved(let scheme):
 guard let gradient = scheme.nsGradient() else { return }
 // Draw linear gradient in NSView
 let startPoint = NSPoint(x: 0, y: bounds.height)
 let endPoint = NSPoint(x: bounds.width, y: bounds.height)
 gradient.draw(from: startPoint, to: endPoint, options: [])
 // Draw radial gradient
 let center = NSPoint(x: bounds.midX, y: bounds.midY)
 gradient.draw(
 fromCenter: center,
 radius: 0,
 toCenter: center,
 radius: bounds.width / 2,
 options: []
 )

Advanced: Component Accessors

// SwiftUI - get raw Gradient.Stop array
let stops = scheme.gradientStops()
let customGradient = LinearGradient(stops: stops, startPoint: .topLeading, endPoint: .bottomTrailing)
// UIKit - get raw CGColor and NSNumber arrays
let (colors, locations) = scheme.caGradientComponents()
let layer = CAGradientLayer()
layer.colors = colors
layer.locations = locations
layer.type = .conic // Apply custom configuration
// AppKit - get raw NSColor and CGFloat arrays
if let (colors, locations) = scheme.nsGradientComponents() {
 let gradient = NSGradient(colors: colors, atLocations: locations, colorSpace: .sRGB)
}

Gestures

Gradient Preview

Color Stop Editor

Adaptive Layout

Compact Width (iPhone Portrait)

Regular Width (iPad, iPhone Landscape)

Accessibility

Localization

Requirements

Architecture

Testing

swift test

Documentation

Contributing

License

Credits