Swiftで無地のUIImageを作成する


140

単色で塗りつぶされたUIImageをプログラムで作成したいと思います。誰でもこれをSwiftで行う方法についてのアイデアがありますか?


UIImage-initWithSize:andColor:メソッドはありませんが、NSImageOS Xにはあります。これにカスタムライブラリまたはカスタムカテゴリを使用していますか?
ttarik、2014年

申し訳ありませんが、(古いプロジェクトを見て)カテゴリを介して使用したのは本当です。質問を編集してください。
Henry Pham 2014年

回答:


194

Swift 2.2互換のもう1つの優れたソリューションは、UIImageに別のコンストラクターを次のように作成することです。

public extension UIImage {
    public convenience init?(color: UIColor, size: CGSize = CGSize(width: 1, height: 1)) {
        let rect = CGRect(origin: .zero, size: size)
        UIGraphicsBeginImageContextWithOptions(rect.size, false, 0.0)
        color.setFill()
        UIRectFill(rect)
        let image = UIGraphicsGetImageFromCurrentImageContext()
        UIGraphicsEndImageContext()

        guard let cgImage = image?.CGImage else { return nil }
        self.init(CGImage: cgImage)
    }  
}

このようにして、次の方法でカスタムカラー画像を作成できます。

let redImage = UIImage(color: .redColor())

または、オプションで、カスタムサイズの画像を作成します。

let redImage200x200 = UIImage(color: .redColor(), size: CGSize(width: 200, height: 200))

Swift 3.0

public extension UIImage {
  public convenience init?(color: UIColor, size: CGSize = CGSize(width: 1, height: 1)) {
    let rect = CGRect(origin: .zero, size: size)
    UIGraphicsBeginImageContextWithOptions(rect.size, false, 0.0)
    color.setFill()
    UIRectFill(rect)
    let image = UIGraphicsGetImageFromCurrentImageContext()
    UIGraphicsEndImageContext()

    guard let cgImage = image?.cgImage else { return nil }
    self.init(cgImage: cgImage)
  }
}

1
あなたが1倍のサイズで画像を作成する場合は、このコードで始まるUIGraphicsBeginImageContextWithOptions(rect.size, true, 1.0) :REF developer.apple.com/library/ios/documentation/UIKit/Reference/...
nahung89

3
これらの画像を丸みを帯びたコーナーにするにはどうすればよいですか?
Umair Afzal

なぜ私たちはただ戻ることができないのimageですか?なぜこれを行う必要があるのですか?self.init(cgImage: cgImage)
Andrey Gagan 2017年

@AndreyGagan AFAIK、コンストラクタで新しく作成さUIImageれたもので自分自身を「置き換える」ことはできませんが、UIImage.init(cgImage: )代わりにコンストラクタを介してチェーンすることができます。
アルニタク2017年

2
画像は適切な縮尺で作成されていません。たとえば、サイズが1x1の場合、メイン画面のスケールが2.0の場合、画像2x2が返されます。あなたは、呼び出す必要がありますself.init(cgImage: cgImage, scale: image!.scale, orientation: image!.imageOrientation)
マリアンチェルニー

92

ここに別のオプションがあります。正確なUIImageオブジェクトが必要だと思います。

func getImageWithColor(color: UIColor, size: CGSize) -> UIImage {
    let rect = CGRectMake(0, 0, size.width, size.height)
    UIGraphicsBeginImageContextWithOptions(size, false, 0)
    color.setFill()
    UIRectFill(rect)
    let image: UIImage = UIGraphicsGetImageFromCurrentImageContext()
    UIGraphicsEndImageContext()
    return image
}

これをSwiftコードに貼り付けて呼び出します

Swift 3.1:

func getImageWithColor(color: UIColor, size: CGSize) -> UIImage {
    let rect = CGRect(x: 0, y: 0, width: size.width, height: size.height)
    UIGraphicsBeginImageContextWithOptions(size, false, 0)
    color.setFill()
    UIRectFill(rect)
    let image: UIImage = UIGraphicsGetImageFromCurrentImageContext()!
    UIGraphicsEndImageContext()
    return image
}

メソッドはないと思いますがUIRectMake(0, 0, size.width, size.height)、これは正しいようです:CGRectMake(0, 0, size.width, size.height)
Henry Pham 2014年

1
一般に、不変変数のlet代わりに使用してみてくださいvar。ここでは、どちらrectも宣言imageを使用していないようvarです。
Zorayr 2015

1
これらの画像を丸みを帯びたコーナーにするにはどうすればよいですか?
Umair Afzal

83

Swift 4バージョン:

extension UIColor {
    func image(_ size: CGSize = CGSize(width: 1, height: 1)) -> UIImage {
        return UIGraphicsImageRenderer(size: size).image { rendererContext in
            self.setFill()
            rendererContext.fill(CGRect(origin: .zero, size: size))
        }
    }
}

使用法:

let image0 = UIColor.orange.image(CGSize(width: 128, height: 128))
let image1 = UIColor.yellow.image()

3
作成されたイメージがオプションではないことを気に入っています
jlukanta

1
私はこれがとても好きです。私にとって、拡張が画像ではなく色からのものであることは、理にかなっています。
quemeful

1
(⚠️iOS 10以降)。さて、すてきな答え
フルー

19

よりクリーンなアプローチは、UIImage拡張機能内にロジックをカプセル化することです。

import UIKit

extension UIImage {
  class func imageWithColor(color: UIColor) -> UIImage {
    let rect: CGRect = CGRectMake(0, 0, 1, 1)
    UIGraphicsBeginImageContextWithOptions(CGSizeMake(1, 1), false, 0)
    color.setFill()
    UIRectFill(rect)
    let image: UIImage = UIGraphicsGetImageFromCurrentImageContext()
    UIGraphicsEndImageContext()
    return image
  }
}

これで、消費者はUIImage.imageWithColor(UIColor.blackColor())、黒の背景の画像を作成するために呼び出すことができます。


これらの画像を丸みを帯びたコーナーにするにはどうすればよいですか?
Umair Afzal

10
class ViewController: UIViewController {

    @IBOutlet weak var imageView: UIImageView!

    override func viewDidLoad() {
        super.viewDidLoad()

        imageView.backgroundColor = UIColor.redColor()
    }
}

自分で画像を描画する場合と、IBOutletを介して画像を接続する場合の同様の方法。

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()

        var frame = CGRectMake(100,100,100,100)
        var imageView2 = UIImageView(frame: frame)
        imageView2.backgroundColor = UIColor.redColor()
        self.view.addSubview(imageView2)
    }
}

anthonyliaoから借用する3番目の方法。もう少し複雑:

class ViewController: UIViewController {

    func getImageWithColor(color: UIColor, size: CGSize) -> UIImage {
        UIGraphicsBeginImageContextWithOptions(size, false, 0)
        color.setFill()
        UIRectFill(CGRectMake(0, 0, 100, 100))
        var image = UIGraphicsGetImageFromCurrentImageContext()
        UIGraphicsEndImageContext()
        return image
    }

    override func viewDidLoad() {
        super.viewDidLoad()

        var imageView = UIImageView(frame: CGRectMake(100,100,100,100))
        let screenImage = getImageWithColor(UIColor.redColor(), size: CGSize(width: 100, height: 100))
        imageView.image = screenImage
        self.view.addSubview(imageView)
    }
}

2
これはおそらく OPが望んだ効果を達成しますがUIImage、を設定するのではなく、を作成するメソッドがあったことには何の価値もありませんUIImageView
ttarik、2014年

2番目の方法でも、@ ev0lutionが指摘していた、画像ではなく画像ビューを作成します。
rdelmar 2014年

編集3を添付。今、私たちはたくさんの方法を持っています。UIImageViewの最後の1つ。
スティーブRosenberg

1
getImageWithColor(color: UIColor, size: CGSize) -> UIImage全員がUIImageViewと一緒にこれを使用するわけではないので、メソッドは答えとして十分です
Henry Pham

これらの画像を丸みを帯びたコーナーにするにはどうすればよいですか?
Umair Afzal

9

@neoneyeの優れた答えを少し調整し、呼び出し元のコードでCGSizeを作成する必要がないようにし、名前を変更して他の多数のコードと衝突しないようにしました。

スウィフト4

extension UIColor {
    func imageWithColor(width: Int, height: Int) -> UIImage {
        let size = CGSize(width: width, height: height)
        return UIGraphicsImageRenderer(size: size).image { rendererContext in
            self.setFill()
            rendererContext.fill(CGRect(origin: .zero, size: size))
        }
    }
}

8

新しいiOS 10 UIGraphicsImageRendererを使用できます APIをます。

これはSwift 3.1の UIColorの拡張です

extension UIColor {
func getImage(size: CGSize) -> UIImage {
    let renderer = UIGraphicsImageRenderer(size: size)
    return renderer.image(actions: { rendererContext in
        self.setFill()
        rendererContext.fill(CGRect(x: 0, y: 0, width: size.width, height: size.height))
    })
}}

6

良い方法は次のような計算されたプロパティを持つことです:

extension UIColor {
    var imageRepresentation : UIImage {
      let rect = CGRect(x: 0.0, y: 0.0, width: 1.0, height: 1.0)
      UIGraphicsBeginImageContext(rect.size)
      let context = UIGraphicsGetCurrentContext()

      context?.setFillColor(self.cgColor)
      context?.fill(rect)

      let image = UIGraphicsGetImageFromCurrentImageContext()
      UIGraphicsEndImageContext()

    return image!
  }
}

使用法:

let redImage = UIColor.red.imageRepresentation

ここでいくつかの答えは少し誤解を招くと思います。ほとんどの場合、特定のケース(1x1など)ではなく、イメージのサイズを指定する必要があります。しかし、これは素晴らしいアプローチです。
Henry Pham 2017

4

@anthonyliaoのSwift 3バージョン

class func getImageWithColor(color: UIColor, size: CGSize) -> UIImage
{
    let rect = CGRect(origin: CGPoint(x: 0, y: 0), size: CGSize(width: size.width, height: size.height))
    UIGraphicsBeginImageContextWithOptions(size, false, 0)
    color.setFill()
    UIRectFill(rect)
    let image: UIImage = UIGraphicsGetImageFromCurrentImageContext()!
    UIGraphicsEndImageContext()
    return image
}

0

角の丸い長方形

extension UIImage {
convenience init?(color: UIColor) {
    let rect = CGRect(x: 0, y: 0, width: 10, height: 2)
    UIGraphicsBeginImageContextWithOptions(CGSize(width: 10, height: 2), false, 0)
    let bezierPath = UIBezierPath(roundedRect: rect, cornerRadius: 8)
    color.setFill()
    bezierPath.fill()
    let image = UIGraphicsGetImageFromCurrentImageContext()!
    UIGraphicsEndImageContext()

    guard  let cgImage = image.cgImage else {
        return nil
    }
    self.init(cgImage: cgImage)
}

}

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.