### Display SwiftyCropView in Full Screen Cover Source: https://github.com/benedom/swiftycrop/blob/master/README.md This example demonstrates how to present SwiftyCropView modally after an image has been loaded. It includes a button to trigger the cropping process and a helper function to download a sample image. ```swift import SwiftUI import SwiftyCrop struct ExampleView: View { @State private var showImageCropper: Bool = false @State private var selectedImage: UIImage? var body: some View { VStack { /* Update `selectedImage` with the image you want to crop, e.g. after picking it from the library or downloading it. As soon as you have done this, toggle `showImageCropper`. Below is a sample implementation: */ Button("Crop downloaded image") { Task { selectedImage = await downloadExampleImage() showImageCropper.toggle() } } } .fullScreenCover(isPresented: $showImageCropper) { if let selectedImage = selectedImage { SwiftyCropView( imageToCrop: selectedImage, maskShape: .square ) { // Do something with the returned, cropped image } } } } // Example function for downloading an image private func downloadExampleImage() async -> UIImage? { let urlString = "https://picsum.photos/1000/1200" guard let url = URL(string: urlString), let (data, _) = try? await URLSession.shared.data(from: url), let image = UIImage(data: data) else { return nil } return image } } ``` -------------------------------- ### Integrating SwiftyCropView with Custom Configuration Source: https://context7.com/benedom/swiftycrop/llms.txt Shows how to use a custom SwiftyCropConfiguration with the SwiftyCropView. This example integrates the configured cropper into a SwiftUI view, handling cancel and save actions. ```swift // Using configuration with SwiftyCropView struct ConfiguredCropperView: View { let imageToCrop: UIImage @Environment(\.dismiss) var dismiss var body: some View { SwiftyCropView( imageToCrop: imageToCrop, maskShape: .rectangle, configuration: customConfig, onCancel: { print("User cancelled cropping") dismiss() } ) { croppedImage in if let result = croppedImage { print("Cropped image size: \(result.size)") // Save or use the cropped image } else { print("Cropping failed") } } } } ``` -------------------------------- ### macOS Support with NSImage Source: https://context7.com/benedom/swiftycrop/llms.txt This example demonstrates SwiftyCrop usage on macOS, utilizing NSImage for platform-specific image handling. Automatic platform detection ensures the API remains consistent. ```swift import SwiftUI import SwiftyCrop #if os(macOS) import AppKit typealias PlatformImage = NSImage #else import UIKit typealias PlatformImage = UIImage #endif struct MacOSCropExample: View { @State private var showCropper = false @State private var image: PlatformImage? @State private var croppedImage: PlatformImage? let config = SwiftyCropConfiguration( maxMagnificationScale: 4.0, maskRadius: 150 ) var body: some View { VStack { if let result = croppedImage { #if os(macOS) Image(nsImage: result) .resizable() .scaledToFit() .frame(maxWidth: 400, maxHeight: 400) #else Image(uiImage: result) .resizable() .scaledToFit() .frame(maxWidth: 400, maxHeight: 400) #endif } Button("Crop Image") { showCropper = true } } #if os(macOS) .sheet(isPresented: $showCropper) { if let image = image { SwiftyCropView( imageToCrop: image, maskShape: .square, configuration: config ) { result in croppedImage = result } .frame(width: 600, height: 600) } } #else .fullScreenCover(isPresented: $showCropper) { if let image = image { SwiftyCropView( imageToCrop: image, maskShape: .square, configuration: config ) { result in croppedImage = result } } } #endif } } ``` -------------------------------- ### Handling User Cancellation in SwiftyCrop Source: https://context7.com/benedom/swiftycrop/llms.txt This example shows how to implement a separate handler for user cancellation in SwiftyCrop. This allows for distinct actions when a user cancels the cropping process versus when they save the result. ```swift import SwiftUI import SwiftyCrop struct CancelHandlerExample: View { @State private var showCropper = false @State private var image: UIImage? @State private var statusMessage = "" var body: some View { VStack { Text(statusMessage) .foregroundColor(.secondary) Button("Edit Image") { statusMessage = "Editing..." showCropper = true } } .fullScreenCover(isPresented: $showCropper) { if let image = image { SwiftyCropView( imageToCrop: image, maskShape: .square, configuration: SwiftyCropConfiguration(), onCancel: { // Called when user taps Cancel button statusMessage = "Editing cancelled" // Optionally show confirmation dialog, revert changes, etc. } ) { croppedImage in // Called when user taps Save/Done button if let result = croppedImage { statusMessage = "Image cropped successfully" // Save the cropped image } else { statusMessage = "Cropping failed" } } } } } } ``` -------------------------------- ### Basic SwiftyCropConfiguration Source: https://context7.com/benedom/swiftycrop/llms.txt Sets up common cropping options like zoom limits, mask size, and gesture enablement. Use this for a straightforward implementation. ```swift import SwiftUI import SwiftyCrop // Basic configuration with common options let basicConfig = SwiftyCropConfiguration( maxMagnificationScale: 4.0, // Maximum zoom level (1.0 - 10.0 typical) maskRadius: 150, // Mask size in points cropImageCircular: true, // Output circular image when using .circle mask rotateImage: true, // Enable rotation via pinch gestures zoomSensitivity: 1.0 // Zoom speed (lower = more sensitive) ) ``` -------------------------------- ### Presenting SwiftyCrop View Source: https://github.com/benedom/swiftycrop/blob/master/README.md This snippet shows how to present the SwiftyCropView using a fullScreenCover, passing the selected image and custom configuration. ```swift .fullScreenCover(isPresented: $showImageCropper) { if let selectedImage = selectedImage { SwiftyCropView( imageToCrop: selectedImage, maskShape: .square, // Use the configuration configuration: configuration ) { croppedImage in // Do something with the returned, cropped image } } } ``` -------------------------------- ### Full SwiftyCropConfiguration Customization Source: https://context7.com/benedom/swiftycrop/llms.txt Demonstrates extensive customization including zoom, rotation buttons, legacy design choice, aspect ratio, and detailed text, font, and color settings. Use for highly tailored cropping experiences. ```swift // Full customization example let customConfig = SwiftyCropConfiguration( maxMagnificationScale: 6.0, maskRadius: 140, cropImageCircular: false, rotateImage: true, rotateImageWithButtons: true, // Show rotation buttons usesLiquidGlassDesign: false, // Use legacy design (or true for iOS 26+) zoomSensitivity: 0.8, rectAspectRatio: 4/3, texts: SwiftyCropConfiguration.Texts( cancelButton: "Discard", interactionInstructions: "Pinch to zoom, drag to move", saveButton: "Apply", progressLayerText: "Processing..." ), fonts: SwiftyCropConfiguration.Fonts( cancelButton: .system(size: 16, weight: .medium), interactionInstructions: .system(size: 14, weight: .light), saveButton: .system(size: 16, weight: .bold) ), colors: SwiftyCropConfiguration.Colors( cancelButton: .red, interactionInstructions: .white.opacity(0.8), saveButton: .green, background: .black.opacity(0.95), cropHandle: .yellow // Rectangle resize handle color ) ) ``` -------------------------------- ### Configure Aspect Ratio Resizing Source: https://github.com/benedom/swiftycrop/blob/master/README.md Configure SwiftyCrop to allow users to resize the crop area's aspect ratio at runtime. Optionally set minimum and maximum aspect ratios. ```swift let configuration = SwiftyCropConfiguration( rectAspectRatio: 4/3, allowAspectRatioResizing: true, minAspectRatio: 0.5, // narrowest: 1:2 maxAspectRatio: 3.0 // widest: 3:1 ) ``` -------------------------------- ### Basic Image Cropping with SwiftyCropView Source: https://context7.com/benedom/swiftycrop/llms.txt Integrates SwiftyCropView into a SwiftUI view to allow users to select and crop an image. The cropped image is returned via a completion handler. Ensure the image is loaded before presenting the cropper. ```swift import SwiftUI import SwiftyCrop struct ImageCropperExample: View { @State private var showImageCropper = false @State private var originalImage: UIImage? @State private var croppedImage: UIImage? var body: some View { VStack(spacing: 20) { if let image = croppedImage ?? originalImage { Image(uiImage: image) .resizable() .scaledToFit() .frame(height: 300) .cornerRadius(12) } Button("Select & Crop Image") { // Load your image (from photo picker, camera, or network) Task { if let url = URL(string: "https://picsum.photos/1000/1200"), let (data, _) = try? await URLSession.shared.data(from: url), let image = UIImage(data: data) { originalImage = image showImageCropper = true } } } .buttonStyle(.borderedProminent) } .fullScreenCover(isPresented: $showImageCropper) { if let image = originalImage { SwiftyCropView( imageToCrop: image, maskShape: .square ) { result { croppedImage = result } } } } } } ``` -------------------------------- ### Custom UI Texts for SwiftyCrop Source: https://context7.com/benedom/swiftycrop/llms.txt Configure custom text strings for UI elements like buttons and instructions. Set to nil to use localized defaults or an empty string to hide instructions. This is only effective when not using the Liquid Glass design. ```swift import SwiftyCrop // Custom texts for legacy UI let customTexts = SwiftyCropConfiguration.Texts( cancelButton: "Cancel", interactionInstructions: "Drag to reposition, pinch to zoom", saveButton: "Done", progressLayerText: "Cropping image..." ) // Minimal instructions let minimalTexts = SwiftyCropConfiguration.Texts( cancelButton: nil, // Uses localized default interactionInstructions: "", // Hide instructions saveButton: nil, // Uses localized default progressLayerText: nil // Uses localized default ) let configWithTexts = SwiftyCropConfiguration( maskRadius: 130, usesLiquidGlassDesign: false, // Required to see text buttons texts: customTexts ) ``` -------------------------------- ### Rectangle Cropping with Aspect Ratio Source: https://context7.com/benedom/swiftycrop/llms.txt Configures rectangle cropping with a specific aspect ratio and allows the user to resize it within defined limits. Useful for enforcing specific output dimensions. ```swift // Rectangle with custom aspect ratio let rectangleConfig = SwiftyCropConfiguration( maskRadius: 160, rectAspectRatio: 16/9, // Widescreen aspect ratio allowAspectRatioResizing: true, // Allow user to drag edges minAspectRatio: 0.5, // Narrowest allowed (1:2) maxAspectRatio: 3.0 // Widest allowed (3:1) ) ``` -------------------------------- ### Create a Custom SwiftyCropConfiguration Source: https://github.com/benedom/swiftycrop/blob/master/README.md This snippet shows how to create a custom configuration for SwiftyCropView, allowing you to modify properties like magnification scale, mask radius, circular cropping, rotation options, and aspect ratio. ```swift let configuration = SwiftyCropConfiguration( maxMagnificationScale: 4.0, maskRadius: 130, cropImageCircular: false, rotateImage: false, rotateImageWithButtons: false, usesLiquidGlassDesign: false, zoomSensitivity: 1.0, rectAspectRatio: 4/3, texts: SwiftyCropConfiguration.Texts( cancelButton: "Cancel", interactionInstructions: "Custom instruction text", saveButton: "Save" ), fonts: SwiftyCropConfiguration.Fonts( cancelButton: Font.system(size: 12), interactionInstructions: Font.system(size: 14), saveButton: Font.system(size: 12) ), colors: SwiftyCropConfiguration.Colors( cancelButton: Color.red, ``` -------------------------------- ### Aspect Ratio Resizing with Rectangle Mask Source: https://context7.com/benedom/swiftycrop/llms.txt Enable dynamic aspect ratio adjustment for rectangle masks, allowing users to resize the cropping area by dragging edge handles. Configure minimum and maximum aspect ratios and customize the appearance of drag handles. This requires setting the mask shape to .rectangle. ```swift import SwiftUI import SwiftyCrop struct AspectRatioResizingExample: View { @State private var showCropper = false @State private var image: UIImage? @State private var croppedImage: UIImage? // Configuration for resizable rectangle cropping let resizableConfig = SwiftyCropConfiguration( maskRadius: 150, rectAspectRatio: 4/3, // Starting aspect ratio allowAspectRatioResizing: true, // Enable edge dragging minAspectRatio: 0.5, // Minimum: 1:2 (portrait) maxAspectRatio: 2.0, // Maximum: 2:1 (landscape) colors: SwiftyCropConfiguration.Colors( cropHandle: .yellow // Visible drag handles ) ) var body: some View { VStack { if let result = croppedImage { Image(uiImage: result) .resizable() .scaledToFit() .frame(maxHeight: 300) Text("Size: \(Int(result.size.width)) x \(Int(result.size.height))") .font(.caption) } Button("Crop with Resizable Rectangle") { showCropper = true } } .fullScreenCover(isPresented: $showCropper) { if let image = image { SwiftyCropView( imageToCrop: image, maskShape: .rectangle, // Required for aspect ratio resizing configuration: resizableConfig ) { result in croppedImage = result } } } } } ``` -------------------------------- ### Implement Circular Cropping with Transparency Source: https://context7.com/benedom/swiftycrop/llms.txt Configure SwiftyCrop to output circular images with transparent backgrounds. Set `maskShape` to `.circle` and `cropImageCircular` to `true` in `SwiftyCropConfiguration`. ```swift import SwiftUI import SwiftyCrop struct CircularCropExample: View { @State private var showCropper = false @State private var image: UIImage? @State private var profileImage: UIImage? // Configuration for circular avatar cropping let avatarConfig = SwiftyCropConfiguration( maxMagnificationScale: 5.0, maskRadius: 120, // Circle diameter = 240pt cropImageCircular: true, // Output circular image with transparency rotateImage: false, zoomSensitivity: 1.2 ) var body: some View { VStack(spacing: 20) { if let avatar = profileImage { Image(uiImage: avatar) .resizable() .scaledToFit() .frame(width: 150, height: 150) .clipShape(Circle()) .overlay(Circle().stroke(.gray, lineWidth: 2)) } else { Circle() .fill(.gray.opacity(0.3)) .frame(width: 150, height: 150) .overlay( Image(systemName: "person.fill") .font(.system(size: 60)) .foregroundColor(.gray) ) } Button("Set Profile Photo") { showCropper = true } .buttonStyle(.borderedProminent) } .fullScreenCover(isPresented: $showCropper) { if let image = image { SwiftyCropView( imageToCrop: image, maskShape: .circle, configuration: avatarConfig ) { croppedImage in // Returns circular image with transparent corners profileImage = croppedImage } } } } } ``` -------------------------------- ### SwiftyCropConfiguration with Custom Colors Source: https://context7.com/benedom/swiftycrop/llms.txt Applies a custom color theme, such as the dark theme, to a SwiftyCropConfiguration. This allows for consistent styling across the cropping interface. ```swift let configWithColors = SwiftyCropConfiguration( maskRadius: 130, colors: darkThemeColors ) ``` -------------------------------- ### Enable Image Rotation with SwiftyCrop Source: https://context7.com/benedom/swiftycrop/llms.txt Configure SwiftyCrop to allow image rotation via pinch gestures, dedicated buttons, or both. Ensure `rotateImage` or `rotateImageWithButtons` is set to true. ```swift import SwiftUI import SwiftyCrop struct RotationExample: View { @State private var showCropper = false @State private var image: UIImage? // Gesture-based rotation only let gestureRotationConfig = SwiftyCropConfiguration( maskRadius: 130, rotateImage: true, // Enable pinch rotation rotateImageWithButtons: false ) // Button-based rotation only let buttonRotationConfig = SwiftyCropConfiguration( maskRadius: 130, rotateImage: false, rotateImageWithButtons: true // Show +/- 90 degree buttons ) // Both rotation methods enabled let fullRotationConfig = SwiftyCropConfiguration( maskRadius: 130, rotateImage: true, // Pinch to rotate freely rotateImageWithButtons: true // Plus buttons for quick 90-degree turns ) var body: some View { VStack { Button("Crop with Rotation") { showCropper = true } } .fullScreenCover(isPresented: $showCropper) { if let image = image { SwiftyCropView( imageToCrop: image, maskShape: .square, configuration: fullRotationConfig ) { croppedImage in // Rotation is applied before cropping // The final image includes the rotation } } } } } ``` -------------------------------- ### Light Theme Colors for SwiftyCrop Source: https://context7.com/benedom/swiftycrop/llms.txt Defines a set of colors for a light theme, suitable for standard UI elements and Liquid Glass design. Use this to style the cropping interface for light mode. ```swift // Light theme configuration let lightThemeColors = SwiftyCropConfiguration.Colors( cancelButton: .red, cancelButtonBackground: .red.opacity(0.1), interactionInstructions: .gray, rotateButton: .blue, rotateButtonBackground: .blue.opacity(0.1), resetRotationButton: .orange, resetRotationButtonBackground: .orange.opacity(0.1), saveButton: .blue, saveButtonBackground: .blue.opacity(0.2), background: .white, cropHandle: .blue ) ``` -------------------------------- ### Dark Theme Colors for SwiftyCrop Source: https://context7.com/benedom/swiftycrop/llms.txt Defines a set of colors for a dark theme, including specific overrides for Liquid Glass design elements like button backgrounds. Use this to style the cropping interface for dark mode. ```swift // Dark theme configuration let darkThemeColors = SwiftyCropConfiguration.Colors( cancelButton: .white, cancelButtonBackground: .red.opacity(0.3), // Liquid Glass only interactionInstructions: .white.opacity(0.7), rotateButton: .white, rotateButtonBackground: .clear, // Liquid Glass only resetRotationButton: .orange, resetRotationButtonBackground: .clear, // Liquid Glass only saveButton: .white, saveButtonBackground: .green, // Liquid Glass: button bg background: .black, cropHandle: .white // Rectangle resize handles ) ``` -------------------------------- ### Using Different Mask Shapes in SwiftyCrop Source: https://context7.com/benedom/swiftycrop/llms.txt Demonstrates how to use the MaskShape enum to define the cropping area (circle, square, or rectangle) in SwiftyCropView. The picker allows dynamic selection of the mask shape before presenting the cropper. ```swift import SwiftyCrop // Available mask shapes let circleShape: MaskShape = .circle // Circular cropping area let squareShape: MaskShape = .square // Square cropping area let rectangleShape: MaskShape = .rectangle // Rectangle with custom aspect ratio // Using different mask shapes struct MaskShapeExample: View { @State private var showCropper = false @State private var selectedShape: MaskShape = .circle @State private var image: UIImage? var body: some View { VStack { Picker("Shape", selection: $selectedShape) { ForEach(MaskShape.allCases, id: \.self) { shape in Text(String(describing: shape)) } } .pickerStyle(.segmented) } .fullScreenCover(isPresented: $showCropper) { if let image = image { SwiftyCropView( imageToCrop: image, maskShape: selectedShape ) { croppedImage in // Handle cropped image based on shape: // .circle -> square output (use cropImageCircular for circular) // .square -> square output // .rectangle -> rectangle matching aspect ratio } } } } } ``` -------------------------------- ### Add SwiftyCrop Package Dependency Source: https://github.com/benedom/swiftycrop/blob/master/README.md Integrate SwiftyCrop into your Xcode project using Swift Package Manager by adding the repository URL in Xcode's package dependency settings. ```ogdl https://github.com/benedom/SwiftyCrop ``` -------------------------------- ### Custom Fonts for SwiftyCrop UI Source: https://context7.com/benedom/swiftycrop/llms.txt Define custom fonts for text elements in the cropping interface. This configuration is only applied when the Liquid Glass design is disabled. You can use system fonts with specific sizes and weights or custom font families. ```swift import SwiftUI import SwiftyCrop let customFonts = SwiftyCropConfiguration.Fonts( cancelButton: .system(size: 14, weight: .regular), interactionInstructions: .system(size: 12, weight: .light, design: .rounded), saveButton: .system(size: 14, weight: .semibold) ) // Using custom font family let brandedFonts = SwiftyCropConfiguration.Fonts( cancelButton: .custom("Helvetica Neue", size: 14), interactionInstructions: .custom("Helvetica Neue", size: 12), saveButton: .custom("Helvetica Neue", size: 14).bold() ) let configWithFonts = SwiftyCropConfiguration( maskRadius: 130, usesLiquidGlassDesign: false, fonts: customFonts ) ``` === COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.