UIImage from UIColor with alpha

Question

I am trying to create a UIImage from this UIColor value I have. The UIImage is being created, but the alpha value is lost. The image remains opaque. I am using the following code:

@implementation GetImage

+ (UIImage *)imageWithColor:(UIColor *)color andSize:(CGSize)size
{
    UIImage *img = nil;

    CGRect rect = CGRectMake(0, 0, size.width, size.height);
    UIGraphicsBeginImageContext(rect.size);
    CGContextRef context = UIGraphicsGetCurrentContext();
    CGContextSetFillColorWithColor(context,
                               color.CGColor);
    CGContextFillRect(context, rect);

    img = UIGraphicsGetImageFromCurrentImageContext();

    UIGraphicsEndImageContext();

    return img;
}

@end

Which I call like so:

-(void) setButtonColours{

    UIImage *img1, *img2;

    UIColor *red = [UIColor colorWithRed:205.0/255.0 green:68.0/255.0 blue:51.0/255.0 alpha:1.0],
    *blue = [UIColor colorWithRed:71.0/255.0 green:97.0/255.0 blue:151.0/255.0 alpha:1.0];

    img1 = [GetImage imageWithColor: blue andSize: self.dummyButton.frame.size];

    img2 = [GetImage imageWithColor: red andSize: self.dummyButton.frame.size];

    [self.dummyButton setBackgroundImage: img1 forState:UIControlStateNormal];
    [self.dummyButton setBackgroundImage: img2 forState:UIControlStateSelected];

}

Any idea what I'm missing?

Answer 1

You are creating an opaque image context.

Replace this line:

UIGraphicsBeginImageContext(rect.size);

with:

UIGraphicsBeginImageContextWithOptions(rect.size, NO, 0);

Answer 2

In the event someone finds this question and they are looking for the Monotouch implementation:

    public class ColorRGBA
        {
            public float Red=0;
            public float Green=0;
            public float Blue=0;
            public float Alpha=0;

            public ColorRGBA (float red, float green, float blue, float alpha)
            {
                Red = red;
                Green = green;
                Blue = blue;
                Alpha = alpha;
            }
        }

//then from within a custom mt.d element

private ColorRGBA color;

    public override UITableViewCell GetCell (UITableView tv)
                {
                    //create square with color
                    var imageSize = new SizeF(30, 30);
                    var imageSizeRectF = new RectangleF (0, 0, 30, 30);
                    UIGraphics.BeginImageContextWithOptions (imageSize, false, 0);
                    var context = UIGraphics.GetCurrentContext ();
                    context.SetFillColor (color.Red, color.Green, color.Blue, color.Alpha);
                    context.FillRect (imageSizeRectF);
                    var image = UIGraphics.GetImageFromCurrentImageContext ();
                    UIGraphics.EndImageContext ();

                    var cell = base.GetCell(tv);
                    cell.Accessory = UITableViewCellAccessory.DisclosureIndicator;
                    cell.ImageView.Image = image;

                    return cell;
                }

Answer 3

For those interested, here is a simple rewrite in Swift 4+:

import UIKit

extension UIImage {
  class func colorAsImage(from color:UIColor, for size:CGSize) -> UIImage? {
    var img:UIImage?
    let rect = CGRect(x:0.0, y:0.0, width: size.width, height: size.height)
    UIGraphicsBeginImageContextWithOptions(rect.size, false, 0)
    guard let context = UIGraphicsGetCurrentContext() else { return nil }
    context.setFillColor(color.cgColor)
    context.fill(rect)
    img = UIGraphicsGetImageFromCurrentImageContext()
    UIGraphicsEndImageContext()
    guard let colorImage = img else { return nil }
    return colorImage
  }
}