रंग टिंट UIButton छवि

Question

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

Comments

क्या आप उस छवि को पोस्ट कर सकते हैं जिसे आप उपयोग करना चाहते हैं और वांछित परिणाम के लिए भी छवि?

— प्रत्यूषा टेरली

इस इंटरफेस बिल्डर से भी ऐसा ही करने stackoverflow.com/a/25179217/2051381

— Chuy47

Answer 1

IOS 7 के रूप में, UIImageरेंडरिंग मोड को निर्दिष्ट करने के लिए एक नया तरीका है। रेंडरिंग मोड का उपयोग UIImageRenderingModeAlwaysTemplateकरने से छवि का रंग बटन के रंग से नियंत्रित हो सकेगा।

उद्देश्य सी

UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
UIImage *image = [[UIImage imageNamed:@"image_name"] imageWithRenderingMode:UIImageRenderingModeAlwaysTemplate];
[button setImage:image forState:UIControlStateNormal]; 
button.tintColor = [UIColor redColor];

तीव्र

let button = UIButton(type: .custom)
let image = UIImage(named: "image_name")?.withRenderingMode(.alwaysTemplate)
button.setImage(image, for: .normal)
button.tintColor = UIColor.red

Comments

मुझे लगता है कि बटन का उपयोग करना बेहतर है ।imageView.tintColor

— M.Othman

@ M.Othman मेरे लिए तभी काम करता है जब मैं बटन का उपयोग करता हूं। CintColor और बटन का नहीं ।imageview.tintColor

— pnizzle

बस छवि पर छवि रेंडर मोड को सेट करने के लिए याद रखें xhaassets पर @hashier

— डीन

UIButtonTypeSystem प्रकार का एक UIButton बनाना स्वचालित रूप से आपके द्वारा सेट किए गए tintColor का सम्मान करेगा।

— कार्लोशवा

यदि आपका tintColorअंधेरा बहुत गहरा है, तो सुनिश्चित करें adjustsImageWhenHighlightedकि नहीं है। (या आईबी में: "हाइलाइटेड एडजस्टमेंट इमेज" अनियंत्रित है।)

— जेसन मूर

Answer 2

जैसा कि रिक ने पहले ही अपने पोस्ट में उल्लेख किया है कि आप रेंडर मोड को कोड में सेट कर सकते हैं, आप इसे सीधे इमेज कैटलॉग में भी कर सकते हैं, नीचे संलग्न इमेज देखें। बस करने के Render Asलिए सेटTemplate Image

कैविएट I को iOS 7 और इस दृष्टिकोण के साथ समस्या है। इसलिए यदि आप iOS 7 का उपयोग करते हैं, तो आप इसे कोड में भी करना चाहते हैं, साथ ही साथ यहाँ बताया गया है ।

Comments

एक साइड नोट के रूप में, छवि फ़ाइल काली और पारदर्शी होनी चाहिए (b & w नहीं)

— Axel Guilmin

@AxelGuilmin वास्तव में नहीं। आपकी छवि आपके इच्छित और पारदर्शी किसी भी रंग की हो सकती है। पारदर्शी से अलग किसी भी रंग को एक जेनेरिक में बदल दिया जाएगा और फिर इसे डिफ़ॉल्ट रूप से काले रंग से रंगा जाएगा।

— अलेजांद्रो इवान

Answer 3

कस्टम बटन उनके संबंधित छवि रंगों में दिखाई देते हैं। स्टोरीबोर्ड (या UIButtonTypeSystemकोड में) के लिए बटन प्रकार "सिस्टम" पर सेट करना, डिफ़ॉल्ट टिंट रंग के साथ बटन की छवि को प्रस्तुत करेगा।

(iOS9, Xcode 7.3 पर परीक्षण किया गया)

Comments

जिसे यहाँ सुझाए गए हमेशाटीमप्लेट और टिंटकलर विधियों से टाला जा सकता है। .System बटन के लाभ से आपको टैप पर टच डाउन के साथ रंग में परिवर्तन प्राप्त होता है।

— क्रिस प्रिंस

Answer 4

UIImage UIImageRenderingModeAlwaysTemplateको tintColorप्रभावित करने के लिए आपको छवि रेंडरिंग मोड सेट करना होगा । यहाँ स्विफ्ट में समाधान है:

let image = UIImage(named: "image-name")
let button = UIButton()
button.setImage(image?.imageWithRenderingMode(UIImageRenderingMode.AlwaysTemplate), forState: .Normal)
button.tintColor = UIColor.whiteColor()

स्विफ्ट 4x

button.setImage(image.withRenderingMode(UIImage.RenderingMode.alwaysTemplate), for: .normal)
button.tintColor = UIColor.blue

Answer 5

अगर आपके पास बैकग्राउंड इमेज वाला कस्टम बटन है। आप अपने बटन का टिंट कलर सेट कर सकते हैं और निम्नलिखित के साथ इमेज को ओवरराइड कर सकते हैं।

परिसंपत्तियों में उस बटन पृष्ठभूमि का चयन करें जिसे आप टिंट रंग सेट करना चाहते हैं।

छवि के विशेषता निरीक्षक में "टेम्पलेट छवि" के रूप में मूल्य रेंडर सेट करें

अब जब भी आप सेट button.tintColor = UIColor.redकरेंगे बटन लाल रंग में दिखाया जाएगा।

Comments

यदि आप यहां हैं तो आप इस लिंक पर जा सकते हैं: useyourloaf.com/blog/styling-buttons-use-the-asset-catalog और टेम्पलेट छवियों के लिए नीचे जाएं (स्पष्टीकरण के रूप में सेवा करने के लिए)

— cspam

यह एक बेहतर उपाय है क्योंकि यह कोड को कम करता है और स्वीकृत उत्तर के समान ही बहुत कुछ करता है।

— डी.एस.

मुझे लगता है कि यह सही होना चाहिए। कम कोड और संभालना आसान।

— उमैर_यूएएस

Answer 6

स्विफ्ट में आप ऐसा कर सकते हैं:

var exampleImage = UIImage(named: "ExampleImage.png")?.imageWithRenderingMode(.AlwaysTemplate)

फिर अपने viewDidLoad में

exampleButtonOutlet.setImage(exampleImage, forState: UIControlState.Normal)

और रंग को संशोधित करने के लिए

exampleButtonOutlet.tintColor = UIColor(red: 1, green: 0, blue: 0, alpha: 1) //your color

EDIT Xcode 8 अब आप अपने .xcassets में इमेज की रेंडरिंग मोड को भी टेम्प्लेट इमेज में बदल सकते हैं और फिर आपको इसे विशेष रूप से घोषित करने की आवश्यकता var exampleImageनहीं है

Answer 7

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

ImageUtils.h

- (UIImage *) maskWithColor:(UIColor *)color;

ImageUtils.m

-(UIImage *) maskWithColor:(UIColor *)color 
{
    CGImageRef maskImage = self.CGImage;
    CGFloat width = self.size.width;
    CGFloat height = self.size.height;
    CGRect bounds = CGRectMake(0,0,width,height);

    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
    CGContextRef bitmapContext = CGBitmapContextCreate(NULL, width, height, 8, 0, colorSpace, kCGImageAlphaPremultipliedLast);
    CGContextClipToMask(bitmapContext, bounds, maskImage);
    CGContextSetFillColorWithColor(bitmapContext, color.CGColor);    
    CGContextFillRect(bitmapContext, bounds);

    CGImageRef cImage = CGBitmapContextCreateImage(bitmapContext);
    UIImage *coloredImage = [UIImage imageWithCGImage:cImage];

    CGContextRelease(bitmapContext);
    CGColorSpaceRelease(colorSpace);
    CGImageRelease(cImage);

    return coloredImage;    
}

ImageUtils श्रेणी को आयात करें और ऐसा कुछ करें ...

#import "ImageUtils.h"

...

UIImage *icon = [UIImage imageNamed:ICON_IMAGE];

UIImage *redIcon = [icon maskWithColor:UIColor.redColor];
UIImage *blueIcon = [icon maskWithColor:UIColor.blueColor];

Comments

का प्रयोग करें kCGBitmapAlphaInfoMask & kCGImageAlphaPremultipliedLastपरCGBitmapContextCreate

— लुइस Ascorbe

अच्छा है, लेकिन रेटिना ग्राफिक्स के लिए इसे ट्वीक करने की आवश्यकता है ... जब मैं इसे रेटिना छवि पर चलाता हूं, तो यह मुझे एक गैर-रेटिना लौटाता है।

— जौई

रेटिना उपकरणों का समर्थन करने के लिए आप के पैमाने संपत्ति इस्तेमाल कर सकते हैं UIDeviceवर्ग: संपत्ति iOS 4.0 के रूप में मौजूद है। CGFloat scale = [UIScreen mainScreen].scale; CGFloat width = self.size.width * scale; CGFloat height = self.size.height * scale;scale

— फिलिप फ्रिस्मथ

निर्मित scaleहोने पर आपको मूल्य का उपयोग करने की भी आवश्यकता UIImageहै:UIImage *coloredImage = [UIImage imageWithCGImage:cImage scale:scale orientation:self.imageOrientation];

— फिलिप फ्रिस्मुथ

Answer 8

रिवाज के साथ स्विफ्ट 4:

let button = UIButton(frame: aRectHere)
    let buttonImage = UIImage(named: "imageName")
    button.setImage(buttonImage?.withRenderingMode(.alwaysTemplate), for: .normal)
    button.tintColor = .white

Answer 9

Xamarin.iOS (C #) के लिए:

        UIButton messagesButton = new UIButton(UIButtonType.Custom);
        UIImage icon = UIImage.FromBundle("Images/icon.png");
        messagesButton.SetImage(icon.ImageWithRenderingMode(UIImageRenderingMode.AlwaysTemplate), UIControlState.Normal);
        messagesButton.TintColor = UIColor.White;
        messagesButton.Frame = new RectangleF(0, 0, 25, 25);

Answer 10

स्विफ्ट 3 :

यदि आप पहले से ही xCode इंटरफ़ेस बिल्डर के माध्यम से अपनी छवि को व्यवस्थित कर चुके हैं तो यह समाधान आरामदायक हो सकता है। मूल रूप से आपके पास एक छवि को रंग देने के लिए एक एक्सटेंशन है:

extension UIImage {
    public func image(withTintColor color: UIColor) -> UIImage{
        UIGraphicsBeginImageContextWithOptions(self.size, false, self.scale)
        let context: CGContext = UIGraphicsGetCurrentContext()!
        context.translateBy(x: 0, y: self.size.height)
        context.scaleBy(x: 1.0, y: -1.0)
        context.setBlendMode(CGBlendMode.normal)
        let rect: CGRect = 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)
        let newImage: UIImage = UIGraphicsGetImageFromCurrentImageContext()!
        UIGraphicsEndImageContext()
        return newImage
    }
}

फिर, आप किसी विशेष राज्य के लिए छवि को रंगीन करने के लिए इस UIButton एक्सटेंशन को तैयार कर सकते हैं :

extension UIButton {
    func imageWith(color:UIColor, for: UIControlState) {
        if let imageForState = self.image(for: state) {
            self.image(for: .normal)?.withRenderingMode(.alwaysTemplate)
            let colorizedImage = imageForState.image(withTintColor: color)
            self.setImage(colorizedImage, for: state)
        }
    }
}

उपयोग:

myButton.imageWith(.red, for: .normal)

पी एस (तालिका सेल में भी काम कर रहे हैं अच्छा है, तो आप कॉल करने के लिए की जरूरत नहीं है setNeedDisplay()विधि, रंग के परिवर्तन के लिए तत्काल कारण है UIImage विस्तार ..

Answer 11

यदि आप मैन्युअल रूप से अपनी छवि को मास्क करना चाहते हैं, तो यहां अपडेट किया गया कोड है जो रेटिना स्क्रीन के साथ काम करता है

- (UIImage *)maskWithColor:(UIColor *)color
{
    CGImageRef maskImage = self.CGImage;
    CGFloat width = self.size.width * self.scale;
    CGFloat height = self.size.height * self.scale;
    CGRect bounds = CGRectMake(0,0,width,height);

    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
    CGContextRef bitmapContext = CGBitmapContextCreate(NULL, width, height, 8, 0, colorSpace, kCGBitmapAlphaInfoMask & kCGImageAlphaPremultipliedLast);
    CGContextClipToMask(bitmapContext, bounds, maskImage);
    CGContextSetFillColorWithColor(bitmapContext, color.CGColor);
    CGContextFillRect(bitmapContext, bounds);

    CGImageRef cImage = CGBitmapContextCreateImage(bitmapContext);
    UIImage *coloredImage = [UIImage imageWithCGImage:cImage scale:self.scale orientation:self.imageOrientation];

    CGContextRelease(bitmapContext);
    CGColorSpaceRelease(colorSpace);
    CGImageRelease(cImage);

    return coloredImage;
}

Answer 12

तुम्हें कोशिश करनी चाहिए

फ़्रेम स्थापित करने के बाद

NSArray *arr10 =[NSArray arrayWithObjects:btn1,btn2,nil];
for(UIButton *btn10 in arr10)
{
CAGradientLayer *btnGradient2 = [CAGradientLayer layer];
btnGradient2.frame = btn10.bounds;

btnGradient2.colors = [NSArray arrayWithObjects:
                       (id)[[UIColor colorWithRed:151.0/255.0f green:206.0/255.5 blue:99.0/255.0 alpha:1] CGColor],
                       (id)[[UIColor colorWithRed:126.0/255.0f green:192.0/255.5 blue:65.0/255.0 alpha:1]CGColor],
                       nil];
[btn10.layer insertSublayer:btnGradient2 atIndex:0];

}

Answer 13

स्विफ्ट 3.0

    let image = UIImage(named:"NoConnection")!

 warningButton = UIButton(type: .system)        
    warningButton.setImage(image, for: .normal)
    warningButton.tintColor = UIColor.lightText
    warningButton.frame = CGRect(origin: CGPoint(x:-100,y:0), size: CGSize(width: 59, height: 56))

    self.addSubview(warningButton)

Answer 14

बटन छवि या छवि दृश्य रंग रंग स्विफ्ट बदलें:

btn.imageView?.image = btn.imageView?.image?.withRenderingMode(.alwaysTemplate)

btn.imageView?.tintColor = #colorLiteral(red: 0, green: 0, blue: 0, alpha: 1)

Answer 15

उपरोक्त में से किसी ने भी मेरे लिए काम नहीं किया, क्योंकि क्लिक के बाद टिंट साफ़ हो गया था। मुझे इस्तेमाल करना था

button.setImageTintColor(Palette.darkGray(), for: UIControlState())