मैं स्विफ्ट में UIImage कैसे रंग सकता हूं?

Question

मैं एक छवि कहा जाता है arrowWhite। मैं इस छवि को काले रंग में रंगना चाहता हूं।

func attachDropDownArrow() -> NSMutableAttributedString {
    let image:UIImage = UIImage(named: "arrowWhite.png")!
    let attachment = NSTextAttachment()
    attachment.image = image
    attachment.bounds = CGRectMake(2.25, 2, attachment.image!.size.width - 2.25, attachment.image!.size.height - 2.25)
    let attachmentString = NSAttributedString(attachment: attachment)
    let myString = NSMutableAttributedString(string: NSString(format: "%@", self.privacyOptions[selectedPickerRow]) as String)
    myString.appendAttributedString(attachmentString)
    return myString
}

मैं इस छवि को प्राप्त करना चाहता हूं blackColour।
tintColorकाम नहीं कर रहा...

Comments

इंटरफेस बिल्डर से उल्लेखनीय है, @Harry ब्लूम को नीचे से बहुत दूर देखें

— एंडी

सबसे सुरुचिपूर्ण समाधान: stackoverflow.com/a/63167556/2692839

— उमैर अली

Answer 1

स्विफ्ट 4 और 5

extension UIImageView {
  func setImageColor(color: UIColor) {
    let templateImage = self.image?.withRenderingMode(.alwaysTemplate)
    self.image = templateImage
    self.tintColor = color
  }
}

इस तरह से कॉल करें:

let imageView = UIImageView(image: UIImage(named: "your_image_name"))
imageView.setImageColor(color: UIColor.purple)

अल्टरनेटिव फॉर स्विफ्ट 3, 4 या 5

extension UIImage {

    func maskWithColor(color: UIColor) -> UIImage? {
        let maskImage = cgImage!

        let width = size.width
        let height = size.height
        let bounds = CGRect(x: 0, y: 0, width: width, height: height)

        let colorSpace = CGColorSpaceCreateDeviceRGB()
        let bitmapInfo = CGBitmapInfo(rawValue: CGImageAlphaInfo.premultipliedLast.rawValue)
        let context = CGContext(data: nil, width: Int(width), height: Int(height), bitsPerComponent: 8, bytesPerRow: 0, space: colorSpace, bitmapInfo: bitmapInfo.rawValue)!

        context.clip(to: bounds, mask: maskImage)
        context.setFillColor(color.cgColor)
        context.fill(bounds)

        if let cgImage = context.makeImage() {
            let coloredImage = UIImage(cgImage: cgImage)
            return coloredImage
        } else {
            return nil
        }
    }

}

स्विफ्ट 2.3 के लिए

extension UIImage {
func maskWithColor(color: UIColor) -> UIImage? {

    let maskImage = self.CGImage
    let width = self.size.width
    let height = self.size.height
    let bounds = CGRectMake(0, 0, width, height)

    let colorSpace = CGColorSpaceCreateDeviceRGB()
    let bitmapInfo = CGBitmapInfo(rawValue: CGImageAlphaInfo.PremultipliedLast.rawValue)
    let bitmapContext = CGBitmapContextCreate(nil, Int(width), Int(height), 8, 0, colorSpace, bitmapInfo.rawValue) //needs rawValue of bitmapInfo

    CGContextClipToMask(bitmapContext, bounds, maskImage)
    CGContextSetFillColorWithColor(bitmapContext, color.CGColor)
    CGContextFillRect(bitmapContext, bounds)

    //is it nil?
    if let cImage = CGBitmapContextCreateImage(bitmapContext) {
        let coloredImage = UIImage(CGImage: cImage)

        return coloredImage

    } else {
        return nil
    } 
 }
}

इस तरह से कॉल करें:

let image = UIImage(named: "your_image_name")
testImage.image =  image?.maskWithColor(color: UIColor.blue)

Comments

अच्छी शुरुआत है, लेकिन परिणाम दानेदार है। जैसा कि @Darko नीचे उल्लेख करता है, मेरा मानना ​​है कि यह इसलिए है क्योंकि आप पैमाने और अन्य मापदंडों को ध्यान में नहीं रख रहे हैं।

— TruMan1

मेरे लिए भी यही है

— पिक्सलेटेड

स्विफ्ट 3 में मेरे लिए काम किया प्रीफेक्ट। धन्यवाद !!

— ऑस्कर कास्टेलन

स्केलिंग और ओरिएंटेशन को संरक्षित नहीं करता है।

— शैलेश

अंदर विस्तार, समारोह सार्वजनिक होना चाहिए

— शिवम पोखरियाल

Answer 2

वहाँ एक विधि है UIImageकि स्वचालित रूप से टेम्पलेट मोड में प्रदान की जाती है प्राप्त करने के लिए बनाया गया है । यह छवि को रंग देने के लिए एक दृश्य के टिंटकलर का उपयोग करता है:

let templateImage = originalImage.imageWithRenderingMode(UIImageRenderingModeAlwaysTemplate)
myImageView.image = templateImage
myImageView.tintColor = UIColor.orangeColor()

Comments

यह सबसे अच्छा जवाब है - अधिक जानकारी Apple डॉक्स में मिल सकती है - developer.apple.com/library/content/documentation/…

— मार्क

यहां रेंडरिंग मोड के लिए स्विफ्ट 3 सिंटैक्स देखें: stackoverflow.com/a/24145287/448718

— Phil_Ken_Sebben

इमेजव्यू का उपयोग करना स्पष्ट है, लेकिन हम UIImage को केवल चाहते हैं

— djdance

यदि आप UIImageView के स्वतंत्र रूप से UIImage ऑब्जेक्ट्स के साथ काम कर रहे हैं तो समाधान नहीं। यह केवल तभी काम करता है जब आपके पास UIImageView

— Pez

इस मामले में भी महान काम करता है जब myImageView एक UIButton है

— daxh

Answer 3

सबसे पहले आपको .xcassets फ़ोल्डर में इमेज की रेंडरिंग प्रॉपर्टी को "टेम्पलेट इमेज" में बदलना होगा। तब आप अपने UIImageView के उदाहरण की टिंट रंग संपत्ति को बदल सकते हैं:

imageView.tintColor = UIColor.whiteColor()

Comments

क्या किसी बिंदु पर tintColorसे हटा दिया गया UIImage? मैं इस जवाब के बारे में उत्साहित था, लेकिन यह iOS 10 में मौजूद नहीं है

— ट्रैविस ग्रिग्स

अरे @TravisGriggs। क्षमा करें, मैंने अभी-अभी अपने उत्तर को थोड़ा और वर्णनात्मक होने के लिए संपादित किया है, टिंटकलर संपत्ति UIImageView पर है, UIImage पर नहीं

— हैरी ब्लूम

टीएक्स, यह बहुत अच्छा है! नोट: टिंट ImageView इंस्पेक्टर के दृश्य अनुभाग में दिखाई देता है, थोड़ा और नीचे। बस अतिरिक्त स्पष्ट होना चाहिए।

— एंडी वीनस्टीन

Answer 4

मैंने इसे समाप्त कर दिया क्योंकि अन्य उत्तर या तो रिज़ॉल्यूशन खो देते हैं या UIImageView के साथ काम करते हैं, न कि UIImage, या अनावश्यक क्रियाएं शामिल हैं:

स्विफ्ट 3

extension UIImage {

    public func maskWithColor(color: UIColor) -> UIImage {

        UIGraphicsBeginImageContextWithOptions(self.size, false, self.scale)
        let context = UIGraphicsGetCurrentContext()!

        let rect = CGRect(origin: CGPoint.zero, size: size)

        color.setFill()
        self.draw(in: rect)

        context.setBlendMode(.sourceIn)
        context.fill(rect)

        let resultImage = UIGraphicsGetImageFromCurrentImageContext()!
        UIGraphicsEndImageContext()
        return resultImage
    }

}

Comments

यहाँ सबसे अच्छा जवाब, एक ही छवि अभिविन्यास और गुणवत्ता रखता है

— SmartTree

हाँ, मैंने उपरोक्त सभी उत्तरों का परीक्षण किया है और यह वास्तव में पैमाने को ध्यान में रखता है, इसलिए यह आपको पिक्सेलयुक्त नहीं देगा UIImage। वास्तव में अच्छा जवाब, धन्यवाद!

— गुइलहर्मे मटूएला

Answer 5

यह फ़ंक्शन इसे प्राप्त करने के लिए कोर ग्राफिक्स का उपयोग करता है।

func overlayImage(color: UIColor) -> UIImage {
    UIGraphicsBeginImageContextWithOptions(self.size, false, UIScreen.main.scale)
    let context = UIGraphicsGetCurrentContext()

    color.setFill()

    context!.translateBy(x: 0, y: self.size.height)
    context!.scaleBy(x: 1.0, y: -1.0)

    context!.setBlendMode(CGBlendMode.colorBurn)
    let rect = CGRect(x: 0, y: 0, width: self.size.width, height: self.size.height)
    context!.draw(self.cgImage!, in: rect)

    context!.setBlendMode(CGBlendMode.sourceIn)
    context!.addRect(rect)
    context!.drawPath(using: CGPathDrawingMode.fill)

    let coloredImage = UIGraphicsGetImageFromCurrentImageContext()
    UIGraphicsEndImageContext()

    return coloredImage
}

Comments

यह काम करता है, जहां अन्य शीर्ष दो उत्तर गलत हैं।

— 6

हाँ यह पूरी तरह से काम करता है। maskWithColor विस्तार कार्य करता है, लेकिन यह ध्यान नहीं देता है कि scaleछवि उच्च रिज़ॉल्यूशन डिवाइस पर तेज नहीं है।

— मोइन उद्दीन

यह सही काम करता है !! हम एक एक्सटेंशन में उपयोग करते हैं और ठीक चलाते हैं। अन्य समाधान बड़े पैमाने पर नजरअंदाज करते हैं ...

— जावी कैंपाना

Answer 6

आप चाहते हैं (ठोस रंग) के रूप में UIImage रंग बदलने के लिए तेजी से 4.2 के लिए

extension UIImage {
    func imageWithColor(color: UIColor) -> UIImage {
        UIGraphicsBeginImageContextWithOptions(self.size, false, self.scale)
        color.setFill()

        let context = UIGraphicsGetCurrentContext()
        context?.translateBy(x: 0, y: self.size.height)
        context?.scaleBy(x: 1.0, y: -1.0)
        context?.setBlendMode(CGBlendMode.normal)

        let rect = CGRect(origin: .zero, size: CGSize(width: self.size.width, height: self.size.height))
        context?.clip(to: rect, mask: self.cgImage!)
        context?.fill(rect)

        let newImage = UIGraphicsGetImageFromCurrentImageContext()
        UIGraphicsEndImageContext()

        return newImage!
    }
}

कैसे इस्तेमाल करे

self.imgVw.image = UIImage(named: "testImage")?.imageWithColor(UIColor.red)

Answer 7

UIImage पर एक एक्सटेंशन बनाएं:

/// UIImage Extensions
extension UIImage {
    func maskWithColor(color: UIColor) -> UIImage {

        var maskImage = self.CGImage
        let width = self.size.width
        let height = self.size.height
        let bounds = CGRectMake(0, 0, width, height)

        let colorSpace = CGColorSpaceCreateDeviceRGB()
        let bitmapInfo = CGBitmapInfo(CGImageAlphaInfo.PremultipliedLast.rawValue)
        let bitmapContext = CGBitmapContextCreate(nil, Int(width), Int(height), 8, 0, colorSpace, bitmapInfo)

        CGContextClipToMask(bitmapContext, bounds, maskImage)
        CGContextSetFillColorWithColor(bitmapContext, color.CGColor)
        CGContextFillRect(bitmapContext, bounds)

        let cImage = CGBitmapContextCreateImage(bitmapContext)
        let coloredImage = UIImage(CGImage: cImage)

        return coloredImage!
    }
}

तो आप इसे इस तरह से उपयोग कर सकते हैं:

image.maskWithColor(UIColor.redColor())

Comments

यह नजरअंदाज करता है scale, orientationऔर अन्य मापदंडों का UIImage।

— निकोलाई रुहे

Answer 8

मैंने एचआर द्वारा समाधान को सबसे अधिक उपयोगी पाया, लेकिन स्विफ्ट 3 के लिए इसे थोड़ा अनुकूलित किया

extension UIImage {

    func maskWithColor( color:UIColor) -> UIImage {

         UIGraphicsBeginImageContextWithOptions(self.size, false, UIScreen.main.scale)
         let context = UIGraphicsGetCurrentContext()!

         color.setFill()

         context.translateBy(x: 0, y: self.size.height)
         context.scaleBy(x: 1.0, y: -1.0)

         let rect = CGRect(x: 0.0, y: 0.0, width: self.size.width, height: self.size.height)
         context.draw(self.cgImage!, in: rect)

         context.setBlendMode(CGBlendMode.sourceIn)
         context.addRect(rect)
         context.drawPath(using: CGPathDrawingMode.fill)

         let coloredImage = UIGraphicsGetImageFromCurrentImageContext()
         UIGraphicsEndImageContext()

         return coloredImage!
    }
}

यह बड़े पैमाने पर विचार करता है और कुछ अन्य समाधानों की तरह कम रेस इमेज का उत्पादन भी नहीं करता है। उपयोग:

image = image.maskWithColor(color: .green )

Comments

यह निश्चित रूप से उपयोग करने के लिए कार्यान्वयन है (इस पृष्ठ पर अन्य लोगों से अलग)।

— स्कॉट कॉर्सडेन

अतिरिक्त सुरक्षित होने के लिए बल के अल्ट्रस को अगर-लेट्स या गार्ड में लपेटा जाना चाहिए।

— क्रिस पावेलियो

Answer 9

@Nikolai Ruhe उत्तर से स्विफ्ट 3 एक्सटेंशन रैपर।

extension UIImageView {

    func maskWith(color: UIColor) {
        guard let tempImage = image?.withRenderingMode(.alwaysTemplate) else { return }
        image = tempImage
        tintColor = color
    }

}

यह के UIButtonरूप में अच्छी तरह से के लिए उपयोग किया जा सकता है :

button.imageView?.maskWith(color: .blue)

Answer 10

स्विफ्ट 4

 let image: UIImage? =  #imageLiteral(resourceName: "logo-1").withRenderingMode(.alwaysTemplate)
    topLogo.image = image
    topLogo.tintColor = UIColor.white

Answer 11

इस कोड को अपने कोड में जोड़ें और स्टोरीबोर्ड में छवि का रंग बदलें।

स्विफ्ट 4 और 5:

extension UIImageView {
    @IBInspectable
    var changeColor: UIColor? {
        get {
            let color = UIColor(cgColor: layer.borderColor!);
            return color
        }
        set {
            let templateImage = self.image?.withRenderingMode(.alwaysTemplate)
            self.image = templateImage
            self.tintColor = newValue
        }
    }
}

---

स्टोरीबोर्ड पूर्वावलोकन:

Answer 12

IOS13 + के लिए withTintColor (__ :) और withTintColor (_: rendMode :) तरीके हैं।

उदाहरण का उपयोग:

let newImage = oldImage.withTintColor(.red)

या

let newImage = oldImage.withTintColor(.red, renderingMode: .alwaysTemplate)

Answer 13

स्विफ्ट 3

21 जून 2017

मैं अल्फा चैनल के साथ दी गई छवि को मुखौटा करने के लिए काइलेयर का उपयोग करता हूं

import Foundation


extension UIImage {

    func maskWithColor(color: UIColor) -> UIImage? {
    
        let maskLayer = CALayer()
        maskLayer.bounds = CGRect(x: 0, y: 0, width: size.width, height: size.height)
        maskLayer.backgroundColor = color.cgColor
        maskLayer.doMask(by: self)
        let maskImage = maskLayer.toImage()
        return maskImage
    }

}


extension CALayer {
    func doMask(by imageMask: UIImage) {
        let maskLayer = CAShapeLayer()
        maskLayer.bounds = CGRect(x: 0, y: 0, width: imageMask.size.width, height: imageMask.size.height)
        bounds = maskLayer.bounds
        maskLayer.contents = imageMask.cgImage
        maskLayer.frame = CGRect(x: 0, y: 0, width: frame.size.width, height: frame.size.height)
        mask = maskLayer
    }

    func toImage() -> UIImage?
    {
        UIGraphicsBeginImageContextWithOptions(bounds.size,
                                               isOpaque,
                                               UIScreen.main.scale)
        guard let context = UIGraphicsGetCurrentContext() else {
            UIGraphicsEndImageContext()
            return nil
        }
        render(in: context)
        let image = UIGraphicsGetImageFromCurrentImageContext()
        UIGraphicsEndImageContext()
        return image
    }
}

Answer 14

पैमाने और ओरिएंटेशन के साथ @kuzdu उत्तर से स्विफ्ट 3 संस्करण

extension UIImage {

    func mask(_ color: UIColor) -> UIImage? {
        let maskImage = cgImage!

        let width = (cgImage?.width)!
        let height = (cgImage?.height)!
        let bounds = CGRect(x: 0, y: 0, width: width, height: height)

        let colorSpace = CGColorSpaceCreateDeviceRGB()
        let bitmapInfo = CGBitmapInfo(rawValue: CGImageAlphaInfo.premultipliedLast.rawValue)
        let context = CGContext(data: nil, width: Int(width), height: Int(height), bitsPerComponent: 8, bytesPerRow: 0, space: colorSpace, bitmapInfo: bitmapInfo.rawValue)!

        context.clip(to: bounds, mask: maskImage)
        context.setFillColor(color.cgColor)
        context.fill(bounds)

        if let cgImage = context.makeImage() {
            let coloredImage = UIImage.init(cgImage: cgImage, scale: scale, orientation: imageOrientation)
            return coloredImage
        } else {
            return nil
        }
    }
}

Answer 15

स्विफ्ट 4।

ठोस रंग की छवि बनाने के लिए इस एक्सटेंशन का उपयोग करें

extension UIImage {   

    public func coloredImage(color: UIColor) -> UIImage? {
        return coloredImage(color: color, size: CGSize(width: 1, height: 1))
    }

    public func coloredImage(color: UIColor, size: CGSize) -> UIImage? {

        UIGraphicsBeginImageContextWithOptions(size, false, 0)

        color.setFill()
        UIRectFill(CGRect(origin: CGPoint(), size: size))

        guard let image = UIGraphicsGetImageFromCurrentImageContext() else { return nil }
        UIGraphicsEndImageContext()

        return image
    }
}

Comments

नेवीगेशन में मेरे लिए प्रीफेक्ट काम किया। Bar.setBackgroundImage और Swift 5. धन्यवाद!

— जेसी

Answer 16

IOS 13 पोस्ट करें आप इसे कुछ इस तरह से उपयोग कर सकते हैं

arrowWhiteImage.withTintColor(.black, renderingMode: .alwaysTemplate)

Answer 17

एक्सटेंशन जोड़ें

extension UIImageView {
    func setImage(named: String, color: UIColor) {
        self.image = #imageLiteral(resourceName: named).withRenderingMode(.alwaysTemplate)
        self.tintColor = color
    }
}

जैसे उपयोग करें:

anyImageView.setImage(named: "image_name", color: .red)

Answer 18

यहां HR के समाधान का 3 संस्करण स्विफ्ट है।

func overlayImage(color: UIColor) -> UIImage? {
    UIGraphicsBeginImageContextWithOptions(self.size, false, UIScreen.main.scale)
    let context = UIGraphicsGetCurrentContext()

    color.setFill()

    context!.translateBy(x: 0, y: self.size.height)
    context!.scaleBy(x: 1.0, y: -1.0)

    context!.setBlendMode(CGBlendMode.colorBurn)
    let rect = CGRect(x: 0, y: 0, width: self.size.width, height: self.size.height)
    context!.draw(self.cgImage!, in: rect)

    context!.setBlendMode(CGBlendMode.sourceIn)
    context!.addRect(rect)
    context!.drawPath(using: CGPathDrawingMode.fill)

    let coloredImage = UIGraphicsGetImageFromCurrentImageContext()
    UIGraphicsEndImageContext()

    return coloredImage
}

Answer 19

चूँकि मैंने डार्कव्यू के उत्तर को मैपव्यू एनोटेशन के लिए कस्टम पिंस को रंगने में बहुत मददगार पाया, लेकिन स्विफ्ट 3 के लिए कुछ रूपांतरण करना पड़ा, सोचा कि मैं उसके जवाब के लिए अपनी सिफारिश के साथ अपडेटेड कोड साझा करूंगा:

extension UIImage {
    func maskWithColor(color: UIColor) -> UIImage {

        var maskImage = self.CGImage
        let width = self.size.width
        let height = self.size.height
        let bounds = CGRect(x: 0, y: 0, width: width, height: height)

        let colorSpace = CGColorSpaceCreateDeviceRGB()
        let bitmapInfo = CGBitmapInfo(rawValue: CGImageAlphaInfo.premultipliedLast.rawValue)
        let bitmapContext = CGContext(data: nil, width: Int(width), height: Int(height), bitsPerComponent: 8, bytesPerRow: 0, space: colorSpace, bitmapInfo: bitmapInfo.rawValue)

        bitmapContext!.clip(to: bounds, mask: maskImage!)
        bitmapContext!.setFillColor(color.cgColor)
        bitmapContext!.fill(bounds)

        let cImage = bitmapContext!.makeImage()
        let coloredImage = UIImage(CGImage: cImage)

        return coloredImage!
    }
}

Answer 20

मैंने यहां पाए गए एक्सटेंशन को संशोधित किया है: गितुब गिस्ट , Swift 3जिसके लिए मैंने UIImage के एक्सटेंशन के संदर्भ में परीक्षण किया है।

func tint(with color: UIColor) -> UIImage 
{
   UIGraphicsBeginImageContext(self.size)
   guard let context = UIGraphicsGetCurrentContext() else { return self }

   // flip the image
   context.scaleBy(x: 1.0, y: -1.0)
   context.translateBy(x: 0.0, y: -self.size.height)

   // multiply blend mode
   context.setBlendMode(.multiply)

   let rect = CGRect(x: 0, y: 0, width: self.size.width, height: self.size.height)
   context.clip(to: rect, mask: self.cgImage!)
   color.setFill()
   context.fill(rect)

   // create UIImage
   guard let newImage = UIGraphicsGetImageFromCurrentImageContext() else { return self }
   UIGraphicsEndImageContext()

   return newImage
}