iOS Graphics 编程

Apple提供了以下几个框架来进行Graphics 和 Animations编程

 1、UIKit

The high-level framework that allows developers to create views, windows, buttons, and other UI related components. It also incorporates some of the low-level APIs into an easier-to-use high-level API.

2、 Quartz 2D

The main engine running under the hood to facilitate drawing in iOS; UIKit usesQuartz.

3、Core Graphics

A framework that supports the graphics context (more on this later), loading images,drawing images, and so on.

4、 Core Animation

A framework that, as its name implies, facilitates animations in iOS.

 

 

 font families：

- (void) enumerateFonts{
for (NSString *familyName in [UIFont familyNames]){
　　NSLog(@"Font Family = %@", familyName);
}
}

fontName：

- (void) enumerateFonts{
for (NSString *familyName in [UIFont familyNames]){
　　NSLog(@"Font Family = %@", familyName);
　　for (NSString *fontName in
　　　　　　[UIFont fontNamesForFamilyName:familyName]){
　　　　　　NSLog(@"\t%@", fontName);
　　　　}
　　}
}

加载字体：

UIFont *helveticaBold = [UIFont fontWithName:@"HelveticaNeue-Bold" size:12.0f];

画字：
首先创建一个UIView的子类，然后在drawRect方法中处理：

#import "GraphicsViewControllerView.h"
@implementation GraphicsViewControllerView
- (id)initWithFrame:(CGRect)frame{
self = [super initWithFrame:frame];
if (self) {
// Initialization code
}
return self;
}
- (void)drawRect:(CGRect)rect{
    // Drawing code
/* Load the color */
    UIColor *magentaColor =
    [UIColor colorWithRed:0.5f
        green:0.0f
        blue:0.5f
        alpha:1.0f];
/* Set the color in the graphical context */
    [magentaColor set];
    UIFont *helveticaBold =
    [UIFont fontWithName:@"HelveticaNeue-Bold" size:40.0f];
    NSString *myString = @"Some String";
    [myString drawAtPoint:CGPointMake(40, 180) withFont:helveticaBold];
/* Our string to be drawn */
    NSString *myString2 = @"I Learn Really Fast";
/* Draw the string using the font. The color has
already been set */
    [myString2 drawInRect:CGRectMake(100, /* x */
        120, /* y */
        100, /* width */
        200) /* height */
        withFont:helveticaBold];
}
- (void)dealloc{
    [super dealloc];
}
@en                    

#import "GraphicsViewControllerView.h"
@implementation GraphicsViewControllerView
- (id)initWithFrame:(CGRect)frame{
self = [super initWithFrame:frame];
if (self) {
// Initialization code
}
return self;
}
- (void)drawRect:(CGRect)rect{
    // Drawing code
/* Load the color */
    UIColor *magentaColor =
    [UIColor colorWithRed:0.5f
        green:0.0f
        blue:0.5f
        alpha:1.0f];
/* Set the color in the graphical context */
    [magentaColor set];
    UIFont *helveticaBold =
    [UIFont fontWithName:@"HelveticaNeue-Bold" size:40.0f];
    NSString *myString = @"Some String";
    [myString drawAtPoint:CGPointMake(40, 180) withFont:helveticaBold];
/* Our string to be drawn */
    NSString *myString2 = @"I Learn Really Fast";
/* Draw the string using the font. The color has already been set */
    [myString2 drawInRect:CGRectMake(100, /* x */
        120, /* y */
        100, /* width */
        200) /* height */
        withFont:helveticaBold];
}
- (void)dealloc{
    [super dealloc];
}
@en                    

 

画图片：

- (void)drawRect:(CGRect)rect{
// Drawing code
/* Assuming the image is in your app bundle
and we can load it */
    UIImage *xcodeIcon =[UIImage imageNamed:@"Xcode.png"];
    [xcodeIcon drawAtPoint:CGPointMake(0.0f,20.0f)];
    [xcodeIcon drawInRect:CGRectMake(50.0f,
　　　　10.0f,
　　　　40.0f,
　　　　35.0f)];
}

画线：

- (void)drawRect:(CGRect)rect{

// Drawing code
/* Set the color that we want
to use to draw the line */
    [[UIColor brownColor] set];
/* Get the current graphics context */
    CGContextRef currentContext = UIGraphicsGetCurrentContext();
/* Set the width for the line */
    CGContextSetLineWidth(currentContext,5.0f);
/* Start the line at this point */
    CGContextMoveToPoint(currentContext,50.0f,10.0f);
/* And end it at this point */
    CGContextAddLineToPoint(currentContext,100.0f,200.0f);
/* Use the context's current color to draw
the line */
    CGContextStrokePath(currentContext);
}

PATH：

 Here are the methods you have to work with:

CGPathCreateMutable function

Creates a new mutable path of type CGMutablePathRef and returns its handle. We

should dispose of this path once we are done with it, as you will soon see.

CGPathMoveToPoint procedure

Moves the current pen position on the path to the point specified by a parameter

of type CGPoint.

CGPathAddLineToPoint procedure

Draws a line segment from the current pen position to the specified position (again,

specified by a value of type CGPoint).

CGContextAddPath procedure

Adds a given path (specified by a path handle) to a graphics context, ready for

drawing.

CGContextDrawPath procedure

Draws a given path on the graphics context.

CGPathRelease procedure

Releases the memory allocated for a path handle.

CGPathAddRect procedure

Adds a rectangle to a path. The rectangle’s boundaries are specified by a CGRect

structure.

 

 There are three important drawing methods that you can ask the CGContextDrawPath

 procedure to perform:

kCGPathStroke

 Draws a line (stroke) to mark the boundary or edge of the path, using the currently

selected stroke color.

kCGPathFill

 Fills the area surrounded by the path with the currently selected fill color.

kCGPathFillStroke

 Combines stroke and fill. Uses the currently selected fill color to fill the path, and

the currently selected stroke color to draw the edge of the path. We’ll see an example

of this method in the following section

 

- (void)drawRect:(CGRect)rect{
// Drawing code
/* Create the path */
    CGMutablePathRef path = CGPathCreateMutable();
/* How big is our screen? We want the X to cover
the whole screen */
    CGRect screenBounds = [[UIScreen mainScreen] bounds];
/* Start from top-left */
    CGPathMoveToPoint(path,NULL,screenBounds.origin.x,screenBounds.origin.y);
/* Draw a line from top-left to
bottom-right of the screen */
    CGPathAddLineToPoint(path,NULL,screenBounds.size.width,screenBounds.size.height);
/* Start another line from top-right */
CGPathMoveToPoint(path,NULL,screenBounds.size.width,screenBounds.origin.y);
/* Draw a line from top-right to bottom-left */
    CGPathAddLineToPoint(path,NULL,screenBounds.origin.x,screenBounds.size.height);
/* Get the context that the path has to be
drawn on */
    CGContextRef currentContext =UIGraphicsGetCurrentContext();
/* Add the path to the context so we can
draw it later */
    CGContextAddPath(currentContext,path);
/* Set the blue color as the stroke color */
　　[[UIColor blueColor] setStroke];
/* Draw the path with stroke color */
    CGContextDrawPath(currentContext,kCGPathStroke);
/* Finally release the path object */
　　CGPathRelease(path);
}

 

画矩形：

- (void)drawRect:(CGRect)rect{
// Drawing code
/* Create the path first. Just the path handle. */
    CGMutablePathRef path = CGPathCreateMutable();
/* Here are our rectangle boundaries */
    CGRect rectangle = CGRectMake(10.0f,10.0f,200.0f,300.0f);
/* Add the rectangle to the path */
    CGPathAddRect(path,NULL,rectangle);
/* Get the handle to the current context */
    CGContextRef currentContext =UIGraphicsGetCurrentContext();
/* Add the path to the context */
    CGContextAddPath(currentContext,path);
/* Set the fill color to cornflower blue */
    [[UIColor colorWithRed:0.20fgreen:0.60f blue:0.80f alpha:1.0f] setFill];
/* Set the stroke color to brown */
    [[UIColor brownColor] setStroke];
/* Set the line width (for the stroke) to 5 */
    CGContextSetLineWidth(currentContext,5.0f);
/* Stroke and fill the path on the context */
    CGContextDrawPath(currentContext,kCGPathFillStroke);
/* Dispose of the path */
    CGPathRelease(path);
}

给图形增加阴影：

- (void) drawRectAtTopOfScreen{
/* Get the handle to the current context */
    CGContextRef currentContext =
UIGraphicsGetCurrentContext();

　　CGContextSaveGState(currentContext);

    CGContextSetShadowWithColor(currentContext,
CGSizeMake(10.0f, 10.0f),20.0f,[[UIColor grayColor] CGColor]);
/* Create the path first. Just the path handle. */
    CGMutablePathRef path = CGPathCreateMutable();
/* Here are our rectangle boundaries */
    CGRect firstRect = CGRectMake(55.0f,60.0f,150.0f,150.0f);
/* Add the rectangle to the path */
    CGPathAddRect(path,NULL,firstRect);
/* Add the path to the context */
    CGContextAddPath(currentContext,path);
/* Set the fill color to cornflower blue */
    [[UIColor colorWithRed:0.20fgreen:0.60f，blue:0.80f，alpha:1.0f] setFill];
/* Fill the path on the context */
    CGContextDrawPath(currentContext,kCGPathFill);
/* Dispose of the path */
    CGPathRelease(path);

　　CGContextRestoreGState(currentContext);

}

Gradients：

- (void)drawRect:(CGRect)rect{
// Drawing code
    CGContextRef currentContext = UIGraphicsGetCurrentContext();
    CGContextSaveGState(currentContext);
    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
    UIColor *startColor = [UIColor orangeColor];
    CGFloat *startColorComponents = (CGFloat *)CGColorGetComponents([startColor CGColor]);
    UIColor *endColor = [UIColor blueColor];
    CGFloat *endColorComponents = (CGFloat *)CGColorGetComponents([endColor CGColor]);
    CGFloat colorComponents[8] = {
/* Four components of the orange color (RGBA) */
　　　　startColorComponents[0],
　　　　startColorComponents[1],
　　　　startColorComponents[2],
　　　　startColorComponents[3], /* First color = orange */
/* Four components of the blue color (RGBA) */
　　　　endColorComponents[0],
　　　　endColorComponents[1],
　　　　endColorComponents[2],
　　　　endColorComponents[3], /* Second color = blue */
　　};
    CGFloat colorIndices[2] = {
　　　　0.0f, /* Color 0 in the colorComponents array */
　　　　1.0f, /* Color 1 in the colorComponents array */
　　};
    CGGradientRef gradient = CGGradientCreateWithColorComponents(colorSpace,(const CGFloat *)&colorComponents,(const CGFloat *)&colorIndices,2);
　　CGColorSpaceRelease(colorSpace);
　　CGPoint startPoint, endPoint;
　　startPoint = CGPointMake(120,260);
　　endPoint = CGPointMake(200.0f,220);
    CGContextDrawLinearGradient(currentContext,gradient,startPoint,endPoint,kCGGradientDrawsBeforeStartLocation |kCGGradientDrawsAfterEndLocation);
　　CGGradientRelease(gradient);
　　CGContextRestoreGState(currentContext);
}

 

Displacing Shapes

- (void)drawRect:(CGRect)rect{ // Drawing code
/* Create the path first. Just the path handle. */               
 CGMutablePathRef path = CGPathCreateMutable();
/* Here are our rectangle boundaries */

 CGRect rectangle = CGRectMake(10.0f, 10.0f,200.0f, 300.0f);
/* We want to displace the rectangle to the right by 100 points but want to keep the y position untouched */
CGAffineTransform transform = CGAffineTransformMakeTranslation(100.0f,0.0f);
/* Add the rectangle to the path */ 
CGPathAddRect(path,&transform, rectangle);
/* Get the handle to the current context */ CGContextRef currentContext =
UIGraphicsGetCurrentContext();
/* Add the path to the context */ 
CGContextAddPath(currentContext,path);
/* Set the fill color to cornflower blue */ 
[[UIColor colorWithRed:0.20f
　　green:0.60f blue:0.80f
　　alpha:1.0f] setFill];
/* Set the stroke color to brown */ 
[[UIColor brownColor] setStroke];
/* Set the line width (for the stroke) to 5 */ 
CGContextSetLineWidth(currentContext,5.0f);
/* Stroke and fill the path on the context */ 
CGContextDrawPath(currentContext,kCGPathFillStroke);
/* Dispose of the path */ 
CGPathRelease(path);
}

- (void)drawRect:(CGRect)rect{ // Drawing code
/* Create the path first. Just the path handle. */ 
CGMutablePathRef path = CGPathCreateMutable();
/* Here are our rectangle boundaries */ 
CGRect rectangle = CGRectMake(10.0f, 10.0f,200.0f, 300.0f);
/* Add the rectangle to the path */ 
CGPathAddRect(path,NULL, rectangle);
/* Get the handle to the current context */ 
CGContextRef currentContext = UIGraphicsGetCurrentContext();
/* Save the state of the context to revert back to how it was at this state, later */
CGContextSaveGState(currentContext);
/* Translate the current transformation matrix to the right by 100 points */
CGContextTranslateCTM(currentContext, 100.0f,0.0f);
/* Add the path to the context */ 
CGContextAddPath(currentContext,path);
/* Set the fill color to cornflower blue */ 
[[UIColor colorWithRed:0.20f
green:0.60f blue:0.80f
alpha:1.0f] setFill];
/* Set the stroke color to brown */ 
[[UIColor brownColor] setStroke];
/* Set the line width (for the stroke) to 5 */ 
CGContextSetLineWidth(currentContext,5.0f);
/* Stroke and fill the path on the context */ 
CGContextDrawPath(currentContext,kCGPathFillStroke);
/* Dispose of the path */ 
CGPathRelease(path);
/* Restore the state of the context */ 
CGContextRestoreGState(currentContext);
}

 

 

Scaling Shapes

/* Scale the rectangle to half its size */ 
CGAffineTransform transform = CGAffineTransformMakeScale(0.5f, 0.5f);
/* Add the rectangle to the path */ 
CGPathAddRect(path,&transform, rectangle);

- (void)drawRect:(CGRect)rect{
// Drawing code
/* Create the path first. Just the path handle. */ 
CGMutablePathRef path = CGPathCreateMutable();
/* Here are our rectangle boundaries */ 
CGRect rectangle = CGRectMake(10.0f, 10.0f,200.0f, 300.0f);
/* Add the rectangle to the path */ 
CGPathAddRect(path,NULL, rectangle);
/* Get the handle to the current context */ CGContextRef currentContext =
UIGraphicsGetCurrentContext();
/* Scale everything drawn on the current graphics context to half its size */
CGContextScaleCTM(currentContext, 0.5f,0.5f);
/* Add the path to the context */ 
CGContextAddPath(currentContext,path);
/* Set the fill color to cornflower blue */ 
[[UIColor colorWithRed:0.20f
green:0.60f blue:0.80f
alpha:1.0f] setFill];
/* Set the stroke color to brown */ 
[[UIColor brownColor] setStroke];
/* Set the line width (for the stroke) to 5 */ 
CGContextSetLineWidth(currentContext,5.0f);
/* Stroke and fill the path on the context */ 
CGContextDrawPath(currentContext,kCGPathFillStroke);
/* Dispose of the path */ CGPathRelease(path);
}

 

Rotating Shapes

/* Rotate the rectangle 45 degrees clockwise */ CGAffineTransform transform =
CGAffineTransformMakeRotation((45.0f * M_PI) / 180.0f);
/* Add the rectangle to the path */ 
CGPathAddRect(path,&transform, rectangle);