17

I would like to know the difference between:

  • Assigning my UIView a color with <1 alpha vs
  • Assigning it a non-transparent color but giving the UIView a <1 alpha value.

On the screenshot I have made two UIViews with two black (alpha = 1.0) UILabels on top of each:

Two UIView's with same color but 0.5 alpha on UIView and bg. color and a third one with alpha 1

Assume a macro _RGB is defined before:

#define _RGB(r,g,b,a) [UIColor colorWithRed:r/255.0 green:g/255.0 blue:b/255.0 alpha:a]

and then here is the code::

[_view1 setBackgroundColor:_RGB(255, 0, 0, 1)];
[_view1 setAlpha:0.5];

[_view2 setBackgroundColor:_RGB(255, 0, 0, 0.5)];
[_view2 setAlpha:1];

[_view3 setBackgroundColor:_RGB(255, 0, 0, 1)];
[_view3 setAlpha:1];

I can see only one difference visually: Changing view's own alpha instead of bg color's, affects the subviews as well. But other than that is there any difference in functionality that I should consider? (eg. On animations, layers, etc.)

Yunus Nedim Mehel
  • 12,089
  • 4
  • 50
  • 56
  • 7
    From my understanding the only difference is the one you have already noted, `setAlpha:` on a view will affect it's subviews (Not Superviews) whereas the `alpha` on `UIColor` will only affect the background color itself. – Popeye Dec 06 '13 at 12:04

1 Answers1

24

The difference is:

  • By settings background color with alpha <1, only the background color will have the alpha and all subviews will by default have alpha 1, i.e. will be 100% opaque
  • By settings alpha to the view, the whole view (including all the subviews) will be drawn with the given alpha

So in your examples:

  • _view1 (alpha <1 on view): alpha is also applied to the subview UILabel
  • _view2 (alpha <1 on background color): subview UILabel is nicely opaque
  • _view3 (defualt alpha 1 on both): well, we all see :-) background color and label are both opaque

Example usage of both:

Alpha on background clor Alpha on whole view

Left image: You have a semi-transparent black overlay which has a subview UIImageView containing a white checkmark icon and you usually want the icon to be fully opaque (non-transparent). So you set just the background color black with alpha <1 (0.75f in the example).

In opposing to:

Right image: You have have a semi-transparent black overlay which has a subview UIImageView containing a white pattern image (the pattern is opaque white, no alpha). And you want the pattern in overlay to be also semi-transparent. You then would set background color to black with alpha 1 (opaque) and alpha <1 to the whole view.

As you can see, icon on left image is fully opaque, but on a right, you can see also through a stars pattern.

Lukas Kukacka
  • 7,604
  • 2
  • 25
  • 50
  • I want such effect like in check box(non transparent). I don't want to show background inside view(black alpha .5f)please tell me – Gajendra Rawat Jul 14 '14 at 13:10
  • To answer your question 007: Just set the background color to black and alpha to 1. You should get a solid black box with your checkmark in it. – RichardNixon Jul 16 '14 at 18:23