在 iOS 中以编程方式创建渐变图像

Question

我正在尝试处理一些直接来自设备相机的图像数据。为了理解 CGImage 结构，我使用缓冲区来创建不适合我的图像（我知道我不应该在 Obj-C 代码中使用 C 代码，这只是为了理解）。代码如下：

int *outBuf = malloc(sizeof(int) * width * height);
for (int i = 0; i < width * height;i ++)
{
     outBuf[i] = (((float)i) / ((float) width * height)) * 255.f;
}
CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceGray();

CGContextRef ctx = CGBitmapContextCreate(outBuf, width, height, 8, width * 4, colorSpace, kCGImageAlphaNone);

CGImageRef img = CGBitmapContextCreateImage(ctx);
CFRelease(ref);
CGContextRelease(ctx);
free(outBuf);

CGColorSpaceRelease(colorSpace);

[view.imgView setImage: [UIImage imageWithCGImage:img]];

CGImageRelease(img);

这应该会创建一个从第一个像素到最后一个像素的渐变，但它会产生一个奇怪的图形：

水平间距从何而来？ （我想解决这个问题，我知道还有其他可能绘制渐变）提前谢谢。

Answer 1

我找到了解决办法：

我正在用 int* 初始化缓冲区。每个 int 长度为 4 个字节，但灰度图片每个像素只需要 1 个字节。将缓冲区更改为 char* 并修改 CGBitmapContextCreate 参数修复了问题：

CGBitmapContextCreate(outBuf, width, height, 8, width, colorSpace, kCGImageAlphaNone);

Answer 2

有几种方法可以实现您的愿望。这里有两个例子： 请注意，这只是为了向您展示一个示例，您应该添加参数/颜色/等以准确获得您所追求的。希望这会有所帮助。

1) 直接在draw rect中绘制渐变。如果你想要额外的绘图，也可以在你的视图实现中调用 [super drawRect:rect]。

- (void)drawRect:(CGRect)rect {
    CGPoint center = CGPointMake(CGRectGetMidX(self.bounds), CGRectGetMidY(self.bounds));
    if (CGSizeEqualToSize(self.centerOffset, CGSizeZero) == NO) {
        center.x += self.centerOffset.width;
        center.y += self.centerOffset.height;
    }

    CGContextRef currentContext = UIGraphicsGetCurrentContext();

    size_t num_locations = 2;
    CGFloat locations[2] = { 0.0, 1.0 };
    CGFloat components[8] = { 0.0, 0.0, 0.0, 0.5,   // Start color
                              0.0, 0.0, 0.0, 0.7 }; // End color

    CGColorSpaceRef rgbColorspace = CGColorSpaceCreateDeviceRGB();
    CGGradientRef gradient = CGGradientCreateWithColorComponents(rgbColorspace, components, locations, num_locations);
    CGGradientDrawingOptions options = kCGGradientDrawsBeforeStartLocation | kCGGradientDrawsAfterEndLocation;
    CGFloat endRadius = [UIApplication sharedApplication].keyWindow.bounds.size.height / 2;
    CGContextDrawRadialGradient(currentContext, gradient, center, 50.0f, center, endRadius, options);

    CGGradientRelease(gradient);
    CGColorSpaceRelease(rgbColorspace); 
}

2) 使用 CAGradient 层

    UIColor *startEndColour = [UIColor redColor];
    UIColor *middleColor = [UIColor blueColor];

    NSArray *horizontalGradientColorsArray = [NSArray arrayWithObjects:(id)[startEndColour CGColor], (id)[middleColor CGColor],(id)[middleColor CGColor], (id)[startEndColour CGColor],nil];

    UIView *horizontalGradient1View = [[UIView alloc] initWithFrame:CGRectMake(0.f, 0.f, self.bounds.size.width, 1.f)];
    horizontalGradient1View.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleBottomMargin;
    CAGradientLayer *horizontalGradient1 = [CAGradientLayer layer];
    horizontalGradient1.frame = horizontalGradient1View.bounds;
    horizontalGradient1.colors = horizontalGradientColorsArray;
    horizontalGradient1.startPoint = CGPointMake(0, 0.5);
    horizontalGradient1.endPoint = CGPointMake(1.0, 0.5);
    [horizontalGradient1View.layer insertSublayer:horizontalGradient1 atIndex:0];
    [self addSubview:horizontalGradient1View];
    [horizontalGradient1View release];