Lab 5 - Views

Objectives

You will be creating a custom view for the polygon lab which will draw the polygons shapes with a subview to display the name of the polygon.  We will also save the state of the application so that it is where you left it when you launch it again.

  1. Modify lab4 so that it contains a custom UIView below the buttons with a filled solid color in the background.  The border of the view should be another solid color.  You can create the UIView in IB and then change the class in the Inspector to PolygonView.
     
  2. Add a subview which is simply a label containing the polygon shape name.  Write out the new PolygonView.h and .m files.
     
  3. Add outlets in the Controller for the view and label and connect them up.  Write out the new Controller file using the merge option so you don't loose your old code.
     
  4. Implement code for the PolygonView class.  You will want an instance variable to connect you to your PolygonShape.  Write the drawRect method to draw the polygon.  The following method will help you.  It calculates the points of a polygon given a rectangle and a number of sides.

    + (NSArray *)pointsForPolygonInRect:(CGRect)rect numberOfSides:(int)numberOfSides {
            CGPoint center = CGPointMake(rect.size.width / 2.0, rect.size.height / 2.0);
            float radius = 0.9 * center.x;
            NSMutableArray *result = [NSMutableArray array];
            float angle = (2.0 * M_PI) / numberOfSides;
            float exteriorAngle = M_PI - angle;
            float rotationDelta = angle - (0.5 * exteriorAngle);

            for (int currentAngle = 0; currentAngle < numberOfSides; currentAngle++) {
                float newAngle = (angle * currentAngle) - rotationDelta;
                float curX = cos(newAngle) * radius;
                float curY = sin(newAngle) * radius;
                [result addObject:[NSValue valueWithCGPoint:CGPointMake(center.x + curX,center.y + curY)]];
            }

            return result;
    }

    The method returns an array of NSValue objects that wrap CGPoints.  You can retrieve the CGPoint contents by sending the CGPointValue message to the NSValue object:

        NSValue *theValue = ... // retrieve an object from the array
        CGPoint thePoint = [theValue CGPointValue];
     

  5. Update the view when the user changes the number of sides (both the polygon drawing and the text label).  Remember that to draw the PolygonView you will send it the message setNeedsDisplay.
     
  6. Add a segmented control allowing the user to select from solid or dashed lines for the sides of the polygon.  Dashed lines may be achieved by using CGContextSetLineDash.
     
  7. Finally, we would like to save the number of sides in the user defaults, and restore that value when the user launches the application.  Look up the [NSUserDefaults standardUserDefaults] in the documentation.  You can use [[NSUserDefaults standardUserDefaults] integerForKey:] and [[NSUserDefaults standardUserDefaults] setInteger: forKey:] methods to retrieve and save information that can be used when the application exits and relaunches.
     
  8. Compress your project and send it to me through the Dropbox in BlackBoard.