Views are arranged hierarchically. Every view has one superview and every view has zero or more subviews. Views live inside of a window. UIWindow object is actually just a view. It adds some additional functionality specific to top level view. There is one UIWindow for an iPhone app.

Add/remove views in IB or using UIView methods:

  • - (void)addSubview:(UIView *)view;
  • - (void)removeFromSuperview;

Manipulate the view hierarchy manually:

  • - (void)insertSubview:(UIView *)view atIndex:(int)index;
  • - (void)insertSubview:(UIView *)view belowSubview:(UIView *)view;
  • - (void)insertSubview:(UIView *)view aboveSubview:(UIView *)view;
  • - (void)exchangeSubviewAtIndex:(int)index withSubviewAtIndex:(int)otherIndex;

Superviews retain their subviews. Not uncommon for views to only be retained by superview. Retain subview before removing if you want to reuse it. Views can be temporarily hidden
theView.hidden = YES;

View related Strcture

  • CGPoint –  location in space: { x , y }
  • CGSize – dimensions: { width , height }
  • CGRect – location and dimension: { origin , size }

Frame vs Bounds

View’s location and size expressed in two ways. Frame is in superview’s coordinate system. Bounds is in local coordinate system.

Which to use? Usually depends on the context. If you are using a view, typically you use frame. If you are implementing a view, typically you use bounds.

Matter of perspective:

  • From outside it’s usually the frame
  • From inside it’s usually the bounds


  • Creating a view, positioning a view in superview – use frame
  • Handling events, drawing a view – use bounds

Drag out any of the existing view objects (buttons, labels, etc) Or drag generic UIView and set custom class.

Views are initialized using -initWithFrame:

CGRect frame = CGRectMake(0, 0, 200, 150);
UIView *myView = [[UIView alloc] initWithFrame:frame];


CGRect frame = CGRectMake(20, 45, 140, 21);
UILabel *label = [[UILabel alloc] initWithFrame:frame];
[window addSubview:label];
[label setText:@"Number of sides:"];
[label release]; // label now retained by window

Subclass UIView

  • For custom drawing, you override:
    • - (void)drawRect:(CGRect)rect;
  • For event handling, you override:
    • - (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event;
    • - (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event;
    • - (void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event;
    • - (void)touchesCancelled:(NSSet *)touches withEvent:(UIEvent *)event;


-[UIView drawRect:] does nothing by default.  If not overridden, then backgroundColor is used to fill
Override – drawRect: to draw a custom view.

drawRect: is invoked automatically. Don’t call it directly!. Being lazy is good for performance. When a view needs to be redrawn, use:

- (void)setNeedsDisplay;

For example, in your controller:

- (void)setNumberOfSides:(int)sides {
numberOfSides = sides;
[polygonView setNeedsDisplay];

CoreGraphics and Quartz 2D

UIKit offers very basic drawing functionality

  • UIRectFill(CGRect rect);
  • UIRectFrame(CGRect rect);

Drawing APIs CoreGraphics (CG) is a C-based API, not Objective-C. CG and Quartz 2D drawing engine define simple but powerful graphics primitives. You can draw following objects quickly and easily using CG.

  • Graphics context
  • Transformations
  • Paths
  • Colors
  • Fonts
  • Painting operations

All drawing is done into an opaque graphics context. Draws to screen, bitmap buffer, printer, PDF, etc. Graphics context setup automatically before invoking drawRect. It defines current path, line width, transform, etc. Access the graphics context within drawRect: by calling


Use CG calls to change settings. Context only valid for current call to drawRect. Do not cache a CGContext!

Some CG functionality wrapped by UIKit.


Convenience for common colors. Easily set the fill and/or stroke colors when drawing.

UIColor *redColor = [UIColor redColor];
[redColor set];
// drawing will be done in red

Access system font. Get font by name

UIFont *font = [UIFont systemFontOfSize:14.0];
[myLabel setFont:font];

Example: drawRect

Draw a solid color and shape

- (void)drawRect:(CGRect)rect {
CGRect bounds = [self bounds];
[[UIColor grayColor] set];
UIRectFill (bounds);
CGRect square = CGRectMake (10, 10, 50, 100);
[[UIColor redColor] set];
UIRectFill (square);
[[UIColor blackColor] set];
UIRectFrame (square);

Drawing More Complex Shapes

Common steps for drawRect: are

  1. Get current graphics context
  2. Define a path
  3. Set a color
  4. Stroke or fill path
  5. Repeat, if necessary

CoreGraphics paths define shapes. Made up of lines, arcs, curves and rectangles. Creation and drawing of paths are two distinct operations. Define path first, then draw it

Two parallel sets of functions for using paths

  • CGContext “convenience” throwaway functions
  • CGPath functions for creating reusable paths

Simple Path Example

- (void)drawRect:(CGRect)rect {
CGContextRef context = UIGraphicsGetCurrentContext();
[[UIColor grayColor] set];
UIRectFill ([self bounds]);
CGContextBeginPath (context);
CGContextMoveToPoint (context, 75, 10);
CGContextAddLineToPoint (context, 10, 150);
CGContextAddLineToPoint (context, 160, 150);
CGContextClosePath (context);
[[UIColor redColor] setFill];
[[UIColor blackColor] setStroke];
CGContextDrawPath (context, kCGPathFillStroke);

Tagged with: C/C++ languageiPhone

Leave a Reply

Your email address will not be published.

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>


Looking for something?

Use the form below to search the site:

Still not finding what you're looking for? Drop a comment on a post or contact us so we can take care of it!

Related News Feeds

Set your Twitter account name in your settings to use the TwitterBar Section.