Strange alpha blending with UIImageView on UIView - ios

Currently I'm working on a simple image editor where you can with a brush alter the alpha channel.
My problem is, when a UIImageView with 0 or near zero alpha image is presented on another UIView, that has a dark color (like brown, black, etc), a strange composition appears. Image becomes visible like its alpha has never been changed. When the back UIView is white, everything is normal.
You'll want to say "keep it white" but I'm currently using this UIView as the background canvas and user has the ability to change the color.
The captures I took are from Reveal, but the appearance is exactly the same on device as well. Here is what I mean with all this talk:
This is an image with 20% alpha set to all it's pixels. The image looks ok. From Reveal, I can see that the image has the correct alpha channel. Everyting is as it should be.
Here is the same image with 15% alpha on a darker blue background (sorry, while capturing I changed the alpha). From Reveal, everything is again looking normal.
But when you look at the device, this is what you see. This is the same UIImage with 15% alpha set to all pixels and presented in UIImageView.
The image is fully appearing on the background dark blue UIView, like its alpha is not 15%. Changing alpha when working on a dark background has not much effect. It simply adds blue all over, or 100% alpha returns to the original image. Even when setting the alpha of all pixels to 0, the image is clearly visible.
Is there something I'm missing? Why this composition (or blending of two UIView objects) error/bug/problem appearing? Is there a value that I am forgetting to set? Or is this normal and am I doing something wrong?

Related

How to display a background image for a kivy button unchanged?

I want to use a background image for a kivy button. I have used the following builder string:
<MenuScreen>:
BoxLayout:
Button:
background_normal: './Pictures/my_background.png'
The image is displayed, however, it is much darker than expected and partially inverted. What do I have to do in order to display my original image without changes?
The resulting button
Original image
I think your problem is that the two colors in your image are grey and transparent (the white appearing areas are actually transparent in your image). In a Button, the background_normal image is multiplied by the background_color which is also a shade of grey by default. So what you end up with is the background grey showing through your transparent areas (white areas above) and your grey appearing everywhere else. So there is not much contrast. See the Button Docs for more information.
You can modify your image (using something like Gimp) to replace the transparent areas with a white color, and perhaps change the grey colors in your image with black. The distortion of the image is due to Kivy fitting your image to the button size.
Here is your image edited as I described. You should be able to click on it and download it.

GIMP: Setting entire foreground to a particular colour

In GIMP version 2.8, I have an image with a black foreground, and a transparent background. I want to set the entire foreground to red, instead of black. What's the simplest way of doing this?
I have tried using the fuzzy select tool and doing a bucket fill on the selection, but this doesn't seem to select the entire foreground. After the bucket fill, there is still a black line around the edge of the foreground image. So it seems that the fuzzy selector didn't select the entire foreground. On closer inspection, the edges of the foreground are not perfectly black, but have some grey pixels. But when using the fuzzy selection, I set a very high threshold (250), so I would have thought this this would select the entire foreground, including the grey pixels.
Any help? Thanks!
The gray pixels aren't grey, they are partially transparent black pixels. If you replace black, you want to keep that partial transparency because this is what gives smooth edges. And there is an easy solution:
Set the alpha-lock of the layer (this is the checkerboard icon at the top of the Layers list) (or in code: gimp-layer-set-lock-alpha)
Do not use selection.
Bucket-fill the layer with the required color. The alpha-lock will preserve the opacity of the pixels.

Transparent text color in a Today View Widget

I'm trying to get the same color/transparent effect as Apple has used on the bottom borders of table view cells in the today view. How can I also use this effect on for example a UILabel?
How do you get the white transparent effect on a UILabel in a today view widget?
I've wondered the same myself. I think They're setting a color of white with 0.4 alpha on the font and a color of black with 0.4 alpha on the background. They overlay the whole thing over a gaussian-blurred and saturated image of what was previously behind the today view.
So the required steps to produce the same effect would be something like the following:
1. Grab background image
2. Blur and saturate image
3. Add below the current view
4. Set black background of 0.4 alpha and white font of 0.4 alpha on the current view.
If you can think of a way to make the background translucent right behind the font that would make the color show more.
Here's an image of what that would look like (including the translucent background behind the text). I did this real quick in photoshop, don't mind the font.
Hope this helps!

iOS 8 bar button item image color [duplicate]

I am adding my own image icon in the bottom of the tab bar, but it only shows a grey square and the title.
How can I fix this?
The problem is that your image lacks transparency. The tab bar expects your image to be a transparency mask (also called a template) - only its degree of transparency / opacity is taken into account. Your image is completely solid opaque, so it appears as a solid square.
Either fix your image, or derive from it an image whose rendering mode is Always Original to force that actual drawing of the image to appear instead of its opacity.

make button glyph have a transparent background in delphi 7?

I have four TSpeedButton objects, each with a BMP file assigned as a glyph for the button image. For whatever reason, delphi has decided that two of the button images should have a transparent background and two should have a white background. I created the bitmaps myself, so they are all saved at the same color depth and are using pure white (not some shade of almost white) for the background and have background color in all four corner pixels of the image.
Why would some of the glyph images show up with a transparent background and some not? What is the criterion for making the background transparent? How can I make my button images all have transparent backgrounds instead of half of them having transparent backgrounds?
Ken's comment
Delphi's glyph handling uses the pixel in the lower-left corner to determine the transparent color. All pixels that match that color should be shown as transparent. Does the lower-left pixel color match in all of the glyphs, and does it match the areas you want to be transparent? (Without the images, it's hard to tell what the problem is, but I thought I'd post this as a potential for investigation.)
appeared to hold the correct answer (sorry, can't accept a comment as the right answer!). The image I was using had a shadow reaching to the lower left corner so it was almost white in that corner and exactly white in all the other corners.
I had a similar problem with D5 and I cludged a fix for this as I never found out why it was happening.
Define the image size one Row taller than the actual image/glyph is. This will force the image to be written starting at the top left and stop just before the last row. That will force the use of a non-transparent color and the extra row below the image is not visually noticeable.

Resources