it-swarm.com.ru

Color Tint UIButton Image

Я заметил, что когда я помещаю белый или черный UIImage в UISegmentedControl, он автоматически маскирует его в соответствии с оттенком сегментированного элемента управления. Я думал, что это действительно круто, и мне было интересно, смогу ли я сделать это в другом месте. Например, у меня есть несколько кнопок, которые имеют одинаковую форму, но разные цвета. Вместо того, чтобы делать PNG для каждой кнопки, могу ли я как-то использовать эту цветовую маскировку, чтобы использовать одно и то же изображение для всех них, но затем установить оттенок или что-то, чтобы изменить их фактический цвет?

238
Logan Shire

Начиная с iOS 7, в UIImage появился новый метод для указания режима рендеринга. Использование режима рендеринга UIImageRenderingModeAlwaysTemplate позволит цвету изображения управлять цветом оттенка кнопки.

Objective-C

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
524
Ric Santos

Как уже упоминал Рик в его post , вы можете установить режим рендеринга в коде, вы также можете сделать это прямо в каталоге изображений, см. Прикрепленное изображение ниже. Просто установите Render As в Template Image

enter image description here

Caveat У меня были проблемы с iOS 7 и таким подходом. Так что, если вы используете iOS 7 также, вы можете сделать это в коде, чтобы быть уверенным, как описано здесь .

203
hashier

Пользовательские кнопки отображаются в соответствующих цветах изображения. Если для кнопки установить тип «Система» в раскадровке (или UIButtonTypeSystem в коде), изображение кнопки будет отображаться с оттенком цвета по умолчанию.

 Button Type System Renders Icons tinted

(протестировано на iOS9, Xcode 7.3)

68
auco

Вы должны установить режим рендеринга изображения на UIImageRenderingModeAlwaysTemplate, чтобы tintColor влиял на UIImage. Вот решение в Swift:

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

Если у вас есть пользовательская кнопка с фоновым изображением. Вы можете установить цвет оттенка вашей кнопки и переопределить изображение следующим.

В активах выберите фон кнопки, которую вы хотите установить оттенок цвета.

В инспекторе атрибутов изображения установите значение render как «Шаблон изображения»

 enter image description here

Теперь, когда вы установите button.tintColor = UIColor.red, ваша кнопка будет отображаться красным цветом. 

23
Ilker Baltaci

В Swift вы можете сделать это так:

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

Тогда по вашему мнению DidLoad

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

И чтобы изменить цвет

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

РЕДАКТИРОВАТЬ Xcode 8 Теперь вы также можете просто включить режим рендеринга изображения в ваших .xcassets в Template Image, и вам больше не нужно специально объявлять его в var exampleImage больше

17
Fri3ndlyGerman

Не уверен, что именно вы хотите, но этот метод категории будет маскировать 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];
14
Kirby Todd

Swift 4 с customType: 

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

Swift 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 ..

4
Alessandro Ornano

Для 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);
4
Maciek z Wrocławia

Если вы хотите вручную замаскировать свое изображение, вот обновленный код, который работает с экранами сетчатки

- (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;
}
3
Josh Bernfeld

Тебе стоит попробовать

После настройки кадра 

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];

}
2
guptha

Swift 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)
1
Jad

Изменение цвета изображения кнопки или вида изображения Swift:

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

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

Ничто из вышеперечисленного не помогло мне, потому что оттенок был очищен после щелчка. Я должен был использовать

button.setImageTintColor(Palette.darkGray(), for: UIControlState())
0
Szymon Klimaszewski