4

I want to use the actual color of the image, apply alpha effect pixel by pixel and create something like this but in colored way. How can I do it?

I tried giving it a color but it turned my image from white to pink.

In this code, I go pixel by pixel and change the pixel alpha to 0 or 1. If I make the rgb to black e.g 0, it creates the right gradient, however when I use rgb values other than 0, it turns into white shades which is not required

func processPixels(in image: UIImage) -> UIImage? {
    let cgImage = convertCIImageToCGImage(inputImage: image)
    guard let inputCGImage = cgImage else {
        print("unable to get cgImage")
        return nil
    }
    let colorSpace       = CGColorSpaceCreateDeviceRGB()
    let width            = inputCGImage.width
    let height           = inputCGImage.height
    let bytesPerPixel    = 4
    let bitsPerComponent = 8
    let bytesPerRow      = bytesPerPixel * width
    let bitmapInfo       = RGBA32.bitmapInfo

    guard let context = CGContext(data: nil, width: width, height: height, bitsPerComponent: bitsPerComponent, bytesPerRow: bytesPerRow, space: colorSpace, bitmapInfo: bitmapInfo) else {
        print("unable to create context")
        return nil
    }
    context.draw(inputCGImage, in: CGRect(x: 0, y: 0, width: width, height: height))

    guard let buffer = context.data else {
        print("unable to get context data")
        return nil
    }

    let pixelBuffer = buffer.bindMemory(to: RGBA32.self, capacity: width * height)

    var rowAlpha: UInt8 = 0
    for row in 0 ..< Int(height) {
        rowAlpha = UInt8(row)
        for column in 0 ..< Int(width) {
            let offset = row * width + column
            if pixelBuffer[offset].alphaComponent > 0 {
                pixelBuffer[offset] = RGBA32(red: pixelBuffer[offset].redComponent, green:  pixelBuffer[offset].greenComponent, blue: pixelBuffer[offset].blueComponent, alpha: rowAlpha)
            }
        }
    }

    let outputCGImage = context.makeImage()!
    let outputImage = UIImage(cgImage: outputCGImage, scale: image.scale, orientation: image.imageOrientation)

    return outputImage
}

func convertCIImageToCGImage(inputImage: UIImage) -> CGImage? {
    guard let ciImage = inputImage.ciImage else {
        print("unable to get ciImage")
        return nil
    }
    let context = CIContext(options: nil)
    if let cgImage = context.createCGImage(ciImage, from: ciImage.extent) {
        return cgImage
    }
    return nil
}

Original Image

Original Image

Gradient Image without color image with black color

Saad Tahir
  • 325
  • 2
  • 13
  • *"create something like this"* ... Show your original image that you want to use to create that. – DonMag Sep 30 '20 at 18:24
  • added the original image and the desired image – Saad Tahir Oct 01 '20 at 06:33
  • Is that really the original image? Pink and Green? Same size as the full screen? – DonMag Oct 01 '20 at 14:24
  • It is not fullscreen. It is a resized mask where green color is the background color of the view. The uiimage is opaque only where the pink color is. Original image is not required because it doesn't involve anything in the question – Saad Tahir Oct 02 '20 at 06:39

0 Answers0