Removing a colour from a UIImage

Question

I have an image:

As you can clearly see, the barcode doesn't fit in very well with the UI :/

I thought a potential fix for this, was to "green screen" out the black in the image, leaving on the white part of the barcode.

The barcode itself is generated on the fly.

func generateBarcode(from string: String) -> UIImage? {
        let data = string.data(using: String.Encoding.ascii)

        if let filter = CIFilter(name: "CICode128BarcodeGenerator") {
            filter.setValue(data, forKey: "inputMessage")

            let transform = CGAffineTransform(scaleX: 3, y: 3)

            if let output = filter.outputImage?.applying(transform) {
                let invertFiler = CIFilter(name: "CIColorInvert")!
                invertFiler.setValue(output, forKey: kCIInputImageKey)

                return UIImage(ciImage: (invertFiler.outputImage?.applying(transform))!) //TODO: Remove force unwrap
            }
        }
        return nil
    }

Now I've heard I can use a "CIColorCube" filter but haven't been able to work out to use it.

Is removing the black part possible? And, if so, would you be able to help me out?

Thanks

Lou Franco · Answer 1 · 2017-07-16T15:45:57.107

1

There is a filter (CIMaskToAlpha) for taking gray images and using the gray level as an alpha value. For black and white images, this makes black transparent and white opaque-white, which I think is what you want.

func generateBarcode(from string: String) -> UIImage? {
    let data = string.data(using: String.Encoding.ascii)

    if let filter = CIFilter(name: "CICode128BarcodeGenerator") {
        filter.setValue(data, forKey: "inputMessage")

        let transform = CGAffineTransform(scaleX: 3, y: 3)

        if let outputBarcode = filter.outputImage?.applying(transform) {
            let invertFilter = CIFilter(name: "CIColorInvert")!
            invertFilter.setValue(outputBarcode, forKey: kCIInputImageKey)

            if let outputInvert = invertFilter.outputImage?.applying(transform) {
                let mask = CIFilter(name: "CIMaskToAlpha")!
                mask.setValue(outputInvert, forKey: kCIInputImageKey)

                return UIImage(ciImage: (mask.outputImage?.applying(transform))!) //TODO: Remove force unwrap
            }
        }
    }
    return nil
}

If you put the resulting image on a background that is blue, you will see just the white bars.

PS: When you say "green screen", what you mean (in imaging language) is the pixel is transparent. This is represented by the alpha component of the color (R, G, B, A). This filter sets each pixel to white, but uses the original color to set the alpha. White (which is 1.0) is a fully opaque alpha, and Black (which is 0.0) is fully transparent. If you had other gray levels, those pixels would be semi-transparent white.

edited Jul 16 '17 at 15:45

answered Jul 16 '17 at 15:38

Lou Franco

87,846
14
132
192

Thank you! This is very close to what I want, however I results in this: https://gyazo.com/b5ea60b2c517ffc633faa4e218a5222c It's not removing the white inbetween the lines – Will Jul 16 '17 at 15:53
It's likely because barcode readers **need** the contrast between black and white. Speaking personally - and I've dealt with barcode creation - I've **never** seen anything *but* a black/white contrast in a barcode. – Jul 16 '17 at 16:55
You said " "green screen" out the black in the image, leaving on the white part of the barcode." The picture you posted has transparent where black was and white where white was (as you requested). If you want something else, update the question. – Lou Franco Jul 16 '17 at 23:15
Sorry, I meant the black between the lines. But after reading @dfd's take on it, I think it should stay how it is, thanks – Will Jul 17 '17 at 02:49
@Will, don't take my word on anything. But yes, see if - or how well - anything *but* a black/white barcode scans with your client's average scanner. You definitely want function over aesthetics here! EDIT: if you find accuracy means black/white, consider putting some nice border around the barcode. – Jul 17 '17 at 04:07
@LouFranco could you take a look at my issue please? You seem to be well versed in CIFilters. https://stackoverflow.com/questions/55103412/xcode-10-1-how-to-fix-user-interface-inspector-capturing-user-interface-not-wo – Joshua Hart Apr 04 '20 at 04:25
You mean: https://stackoverflow.com/questions/60999480/how-to-not-cause-black-color-to-be-transparent-removing-background-from-image – Lou Franco Apr 04 '20 at 15:34

Removing a colour from a UIImage

1 Answers1