Understanding the Image Reflection - Gradient

This is my second post about image reflection. In our first post we discussed about basic principles of image inversion. We discussed translation, scaling and bitmap context to understand image inversion. Today we will discuss about gray scale images and gradients. These concepts are important not only to understand reflection but these could also be used in other scenarios. Our main goal is to understand image reflection which is implemented in Reflection sample provided by Apple. All examples which we are going to discussed today can be downloaded from github repository. If you are looking for complete example of Reflection which covers image inversion, gradient and masking then I would refer you to my post about image masking.

Gray Scale images:
As we know pixels are basic elements of digital image. Each pixel contains number of values which determine the type of image. There are mainly three types of images: black & white, gray scale and color. Black & white images are also called binary images as each pixel has a value either 0 or 1. The next complex type is a gray scale image where each pixel stores value of gray level or gray scale. For example if an image is 8-bit grayscale then each pixel can contain value between 0 to 256 inclusive.

Understanding the image reflection

There is a sample provided by Apple to demonstrate UIImageView reflection effect as implemented in iTunes and iPod player applications. Although it is a small sample but it covers number of concepts which if understood properly could be very helpful for developers and could be used  in other scenarios. In next couple of posts, I would like to cover following concepts which are used in this example:

1. Image inversion.
2. Gradient
3. Masking

Today I will discuss image inversion. In my next posts I have discussed Gradient and Masking. If you are looking for complete example which includes image inversion, gradient and masking then you can refer my post about image masking. For this post, I have provided sample code which you can download and test on your machine. The output of our application will look like as in the picture below. Note that we not only want to vertically invert our image but we also want to control the height of reflection which is being displayed.

iPhone - Custom Alert View

Recently while developing an iPhone application I  needed to display a message box which is similar to UIAlertView but which could be modified by adding different objects like Activity indicator. I also wanted to replicate animation of UIAlertView. I created my custom alert view which I would like to post here. I hope some of the techniques I have used here could be useful to other developers. You can download code from github repository. Please note that I have taken some ideas from Brad Larson's iTunes lecture: Quartz 2D drawing. Here is how the Custom alert view looks like.

CustomAlertView class :
First we need to create a CustomAlertView class in our project. This class is derived from UIView class.

Implement init method
Init method will receive frame and the text which needs to be displayed.

-(id)initWithFrame:(CGRect)frame withText:(NSString*)text{
    self = [super initWithFrame:frame];
    if (self) {
        self.backgroundColor = [UIColor clearColor];
        [self initTextLabel:text];
        [self initActivityIndicator];
    }
    return self;
}

We call initTextLabel function which creates label and adjusts its position. The second function initActivityIndicator adjusts activity indicator control.