Geek Answers Handbook

IOS and Android Algorithm or library for plumage of edges of images similar to Photoshop

I am looking for a library of iOS and Android (preferably) or an algorithm that will help me move the edges of the image in the same way as in Photoshop. The figure below shows the desired effect of the algorithm. I'm not interested in the borders of the image, just alpha edges. I was looking for an algorithm that could execute it in a few days without any luck. Any help would be appreciated.

Feathering Image

+5
source share
2 answers

Assuming you have an alpha channel (like in a photo with a transparent background), it seems like a regular convolution blur matrix should suit you.

However, instead of going through the RGB channels, you only have to go through the ALPHA channel.

Check out the blur filter here: https://en.wikipedia.org/wiki/Kernel_%28image_processing%29

You are interested in Box Blur / Gaussian Blur. However, to make this effect smoother, you must use a larger matrix.

The reason that the algorithm will satisfy your needs is that if all the surrounding pixels have alpha-0, it will be 0. If 255, it will remain 255. Only the pixel in the border area between alpha 0/255 will be affected.

Edit:

Please check this script on chrome (in ff, which is very slow): http://jsfiddle.net/5L40ms65/

You can take a look at the algorithm at the end of the code. From the moment of implementation, I noted that: - there is no need to blur if all the neigbour pixels are 255 or 0 (alpha channel) - RGB blur is required in another case

Generally:

RADIUS = 2 (makes total width of matrix = 5) For x = 0..width for y = 0..width if all pixels in square of radius 2 are alpha = 0 do nothing elsif all pixels in square have alpha = 255 do nothing else pixel[x][y].RGB = average RGB of adjacent pixels where alpha != 0 pixel[x][y].ALPHA = average ALPHA in square

Example result with radius = 2

Of course, this is more of a conceptual program, there is a lot of space for memoization and customization of this script, however this should make the big picture transparent

enter image description here

+6
source

You can change the alpha of your border based on the background color in the view.

 var r:Float! var g:Float! var b:Float! var a:Float! if self.view.backgroundColor.getRed(red:r, green:g, blue:b, alpha:a) { var imgv = UIImageView(frame: CGRect(x:100, y:100, width:100, height:100)) imgv.image = UIImage(named:"name") imgv.layer.borderWidth = 2.0 imgv.layer.borderColor = UIColor(red:r, green:g, blue:b, alpha:0.5).CGColor imgv.layer.cornerRadius = imgv.frame.size.width / 2 imgv.clipsToBounds = true }else{ //Could not get the RGB of background color }

You can see errors in this code because I have not tested it yet.

0
source

More articles:


All Articles