Merge pull request #17 from Festanny/master

Adding Rectangle (4:3) for cropping

Author: benedom

Demo/SwiftyCropDemo/ContentView.swift

@@ -5,13 +5,29 @@ struct ContentView: View {
     @State private var showImageCropper: Bool = false
     @State private var selectedImage: UIImage?
     @State private var selectedShape: MaskShape = .square
+    @State private var rectAspectRatio: PresetAspectRatios = .fourToThree
     @State private var cropImageCircular: Bool
     @State private var rotateImage: Bool
     @State private var maxMagnificationScale: CGFloat
     @State private var maskRadius: CGFloat
     @State private var zoomSensitivity: CGFloat
     @FocusState private var textFieldFocused: Bool
 
+    enum PresetAspectRatios: String, CaseIterable {
+        case fourToThree = "4:3"
+        case sixteenToNine = "16:9"
+        
+        func getValue() -> CGFloat {
+            switch self {
+            case .fourToThree:
+                4/3
+                
+            case .sixteenToNine:
+                16/9
+            }
+        }
+    }
+    
     init() {
         let defaultConfiguration = SwiftyCropConfiguration()
         _cropImageCircular = State(initialValue: defaultConfiguration.cropImageCircular)
@@ -59,14 +75,29 @@ struct ContentView: View {
                         Text("Mask shape")
                             .frame(maxWidth: .infinity, alignment: .leading)
 
-                        Picker("maskShape", selection: $selectedShape) {
+                        Picker("maskShape", selection: $selectedShape.animation()) {
                             ForEach(MaskShape.allCases, id: \.self) { mask in
                                 Text(String(describing: mask))
                             }
                         }
                         .pickerStyle(.segmented)
                     }
 
+                    if selectedShape == .rectangle {
+                        HStack {
+                            Text("Rect aspect ratio")
+                                .frame(maxWidth: .infinity, alignment: .leading)
+                            
+                            Picker("rectAspectRatio", selection: $rectAspectRatio) {
+                                ForEach(PresetAspectRatios.allCases, id: \.self) { aspectRatio in
+                                    Text(aspectRatio.rawValue)
+                                }
+                                
+                            }
+                            .pickerStyle(.segmented)
+                        }
+                    }
+                    
                     Toggle("Crop image to circle", isOn: $cropImageCircular)
 
                     Toggle("Rotate image", isOn: $rotateImage)
@@ -129,7 +160,8 @@ struct ContentView: View {
                         maskRadius: maskRadius,
                         cropImageCircular: cropImageCircular,
                         rotateImage: rotateImage,
-                        zoomSensitivity: zoomSensitivity
+                        zoomSensitivity: zoomSensitivity,
+                        rectAspectRatio: rectAspectRatio.getValue()
                     )
                 ) { croppedImage in
                     // Do something with the returned, cropped image

README.md

@@ -138,8 +138,9 @@ If you want to display `SwiftyCrop` inside a sheet, use `NavigationView` instead
 SwiftyCrop supports two different mask shapes for cropping:
 - `circle`
 - `square`
+- `rectangle`
 
-This is only the shape of the mask the user will see when cropping the image. The resulting, cropped image will always be a square by default. You can override this using a configuration.
+This is only the shape of the mask the user will see when cropping the image. The resulting, cropped image will always be a square by default when using `circle` or `square`. To get a circular cropped image, you can override this using a configuration.
 
 You can also configure `SwiftyCropView` by passing a `SwiftyCropConfiguration`. A configuration has the following properties:
 
@@ -148,8 +149,9 @@ You can also configure `SwiftyCropView` by passing a `SwiftyCropConfiguration`.
 | `maxMagnificationScale` | `CGFloat`: The maximum scale factor that the image can be magnified while cropping. Defaults to `4.0`. |
 | `maskRadius` | `CGFloat`: The radius of the mask used for cropping. Defaults to `130`. A good way is to make it dependend on the screens size. |
 | `cropImageCircular` | `Bool`: When using the cropping mask `circle`, whether the resulting image should also be masked as circle. Defaults to `false`. |
-| `rotateImage` | `Bool`: Whether the image can be rotated when cropping using pinch gestures. Defaults to `true`. |
+| `rotateImage` | `Bool`: Whether the image can be rotated when cropping using pinch gestures. Defaults to `false`. |
 | `zoomSensitivity` | `CGFloat`: Zoom sensitivity when cropping. Increase to make zoom faster / less sensitive. Defaults to `1.0`. |
+| `rectAspectRatio` | `CGFloat`: The aspect ratio to use when a rectangular mask shape is used. Defaults to `4:3`. |
 
 Create a configuration like this:
 ```swift
@@ -158,7 +160,8 @@ let configuration = SwiftyCropConfiguration(
     maskRadius: 130,
     cropImageCircular: false,
     rotateImage: true,
-    zoomSensitivity = 1.0
+    zoomSensitivity = 1.0,
+    rectAspectRatio = 4/3
 )
 ```
 and use it like this:
@@ -185,6 +188,8 @@ Thanks to [@leoz](https://github.com/leoz) for adding the circular crop mode, th
 
 Thanks to [@kevin-hv](https://github.com/kevin-hv) for adding the hungarian localization 🇭🇺
 
+Thanks to [@Festanny](https://github.com/Festanny) for helping with the recangular cropping functionality 🎉
+
 ## ✍️ Author
 
 Benedikt Betz & CHECK24