Core Image iOS Tutorial
Core Image provides a mechanism for manipulating images and videos. Core Image includes a range of filters such as cropping, gradients, color effects and blurring. In this tutorial we will set a mono effect on a coloured image. This tutorial is made with Xcode 10 and built for iOS 12.
Open Xcode and create a new Single View App.
For product name, use iOS12CoreImageTutorial and then fill out the Organization Name and Organization Identifier with your customary values. Enter Swift as Language and choose Next.
Go to the Storyboard and drag an Image View to the main View. Select the Image View and go to the Size inspector and fill in the following values.
Select the Image View again and select the Auto Layout “Add New Constraints” button. Pin the Button to the top. Also select the Height and Width checkboxes and select “Add 3 constraints”
Select the Image View again and select the Auto Layout align button. Select the "Horizontally in Container" checkbox and click "Add 1 Constraint".
The Storyboard will look like this.
Select the Assistant Editor and make sure the ViewController.swift is visible. Ctrl and drag from the Image View to the ViewController class and create the following Outlet.
Download the image, and drag it to the project. Select the image to see how the original will look like.
Go to the ViewController.swift file and change the viewDidLoad method
override func viewDidLoad() { super.viewDidLoad() // 1 if let image = UIImage(named: "dog.jpg") { let originalImage = CIImage(image: image) // 2 let filter = CIFilter(name: "CIPhotoEffectMono") filter?.setDefaults() filter?.setValue(originalImage, forKey: kCIInputImageKey) // 3 if let outputImage = filter?.outputImage { let newImage = UIImage(ciImage: outputImage) imageView.image = newImage } } }
The image is loaded and assigned to the image variable. Since Core Image works on CIImage object the UIImage will be converted to a CIImage.
a CIFilter object is initialised with the CIPhotoEffectMono filter. The filter is first set to default and then assigned to the CIImage.
The filter is applied to the outputImage and is then converted back to an UIImage object. Finally the filtered image is assigned to the Image View.
Build and Run the project, the filtered image is displayed.
You can download the source code of the IOS12CoreImageTutorial at the ioscreator repository on Github.
