Genta Hirauchi

公開日:2020/03/24
更新日:2020/08/03

【Swift CIFilter】CIColorControlsで彩度を補正する方法を解説

  • 画像の彩度を補正する方法が知りたい。

SwiftのCore Imageには、CIFilterという、画像の補正を行うことができるクラスがあります。

CIFilterには、さまざなま画像補正のフィルタが用意されております。本記事では、その中のCIColorControlsというフィルタを使用し、画像の彩度を補正する方法を解説致します。

目次

CIColorControlsについて

CIColorControlsは、彩度、明るさ、コントラストを補正する際に使用されるCore Image Filterです。

CIColorControlsには、以下のパラメータがあります。

inputImage入力画像(補正をかける画像)
inputSaturation彩度
デフォルト値:1、最小値:0、最大値:-
inputBrightness明るさ
デフォルト値:0、最小値:-1、最大値:-
inputContrastコントラスト
デフォルト値:1、最小値:0、最大値:-

Reference: CIColorControls | Core Image Filter Reference

CIColorControlsで彩度を補正する方法

では、CIColorControlsで、彩度を補正する方法を解説致します。

以下は、スライダーを動かすと、その値を彩度値として、画像の補正を行うサンプルコードです。

  • ViewController.swift
import UIKit

class ViewController: UIViewController {

    @IBOutlet weak var imageView: UIImageView!
    @IBOutlet weak var valueSlider: UISlider!
    @IBOutlet weak var valueLabel: UILabel!

    private var ciFilter: CIFilter!

    override func viewDidLoad() {
        super.viewDidLoad()

        title = "彩度"

        guard let uiImage = UIImage(named: "sample"), let ciImage = uiImage.ciImage ?? CIImage(image: uiImage) else { return }

        imageView.image = uiImage

        // Filterに合わせた最大値、最小値、初期値の設定
        valueSlider.maximumValue = 2
        valueSlider.minimumValue = 0
        valueSlider.value = 1

        valueLabel.text = String(valueSlider.value)

        // CIFilterの生成
        ciFilter = CIFilter(name: "CIColorControls")

        // 入力画像の設定
        ciFilter.setValue(ciImage, forKey: kCIInputImageKey)
    }

    @IBAction func valueChanged(_ sender: UISlider) {
        valueLabel.text = String(sender.value)

        // 彩度の設定
        ciFilter.setValue(sender.value, forKey: "inputSaturation")

        // Filter適応後の画像を表示
        if let filteredImage = ciFilter.outputImage {
            imageView.image = UIImage(ciImage: filteredImage)
        }
    }
}

CIFilter(name: “CIColorControls”)で、CIColorControlsフィルタのインスタンスを生成しております。

その後、生成したCIFilterのインスタンスに対し、setValue(ciImage, forKey: kCIInputImageKey)で、入力画像の設定を行っております。

スライダーの値が変更されたら、setValue(sender.value, forKey: “inputSaturation”)で、彩度値の設定を行います。

そして、outputImageで、彩度が補正されたCIImageを取得し、UIImageに変換後、画面に表示しております。

Point
  • CIFilter(name: “CIColorControls”)で、フィルタを生成する
  • setValue(ciImage, forKey: kCIInputImageKey)で、入力画像を設定する
  • setValue(sender.value, forKey: “inputSaturation”)で、彩度値を設定する
  • outputImageで、補正されたCIImageを取得する

まとめ

  • CIFilter(name: “CIColorControls”)で、フィルタを生成する
  • setValue(ciImage, forKey: kCIInputImageKey)で、入力画像を設定する
  • setValue(sender.value, forKey: “inputSaturation”)で、彩度値を設定する
  • outputImageで、補正されたCIImageを取得する