Radial gradient background programmatically in UIViewController

Question

I researched a lot but I cannot find a proper solutions. I want to add a radial background to a UIViewController which fits to a iPhone 4 and iPhone 5 screen (view See attached screenshot). The background should be done programmatically because i have several Scrollview with a height more than view.bounds.

Does anybody know a solution?

Answer 1

You can follow two different ways to achieve this.

The simple way. If you have an image (you posted a screenshot) wrap it into an UIImageView. Once done you can add it as a subview of your controller's view sending it to back like the following.

UIImageView* radialImage = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"radialBackground"]];
[radialImage setFrame:[[self view] bounds]];
[[self view] addSubview:radialImage];   
[[self view] sendSubviewToBack:radialImage];

The not simple one. Create a custom UIView (named RadialBackgroundView for example) and override drawRect: method.

- (void)drawRect:(CGRect)rect
{
    // Take a look to CGContextDrawRadialGradient to draw radial gradient
}

You can use it like a simple image.

RadialBackgroundView* radialView = [[RadialBackgroundView alloc] initWithFrame:[[self view] bounds]];
[[self view] addSubview:radialView];    
[[self view] sendSubviewToBack:radialView];