IOS animation and 2D and 3D drawing

There are three main methods: Core animation, core graphic, and OpenGL ES.

Ease of operation: Ca> CG> OpenGL

Performance and functionality: OpenGL> CG> Ca

 

1. Core Animation

Non-entertainment software uses animations, which is easy to operate.

2. Quartz 2D drawing

Is a 2D drawing engine.

(1) The drawing context is the target object of a drawing. It defines the basic attributes of the drawing, such as color, drawing range, line width, and style.

(2) A context is created through uiview. You can use statements similar to the following to obtain the current context.

Cgcontextref currentcontext = uigraphicsgetcurrentcontext ();

(3) If you want to save the current state before modifying it, you can use uigraphicspushcontext;

You can use uigraphicspopcontext to restore the saved context.

(4) path: the path is actually a curve or line marked by a series of coordinate points. After being created, you can draw a line along it or fill the closed space.

 

Familiarize yourself with quartz 2D drawing through a simple canvas (whiteboard)

 

Add an empty application and create a uiview class.

Modify the code in appdelegate:

-(Bool) Application :( uiapplication *) Application didfinishlaunchingwitexceptions :( nsdictionary *) launchoptions

{
Self. Window = [[[uiwindow alloc] initwithframe: [[uiscreen mainscreen] bounds] autorelease];
// Override point for customization after application launch.
Self. Window. backgroundcolor = [uicolor whitecolor];

// Create a view and specify the size of the view as full screen
Whiteboardview * whiteview = [[whiteboardview alloc] initwithframe: [uiscreen mainscreen] applicationframe];
[Self. Window addsubview: whiteview]; // Add the created view as a subview to the window.

[Whiteview release];

[Self. Window makekeyandvisible];
Return yes;
}

Modify the code in the uiview class:

 

// Whiteboardview. h
// Drawingboard

# Import <uikit/uikit. h>

@ Interface whiteboardview: uiview {

Cgcontextref whiteboardcontext;
Cglayerref whiteboardlayer;

}

@ End

 

Implementation class:

 

// Whiteboardview. m
// Drawingboard

# Import "whiteboardview. H"

@ Implementation whiteboardview

// Rewrite to create and set custom context During view Initialization
-(ID) initwithframe :( cgrect) Frame
{
If (Self = [Super initwithframe: frame]) {

Self. backgroundcolor = [uicolor whitecolor]; // specifies the background color of the view.
Cgcolorspaceref colorspace = cgcolorspacecreatedevicergb (); // specify the color space as RGB.

// Create a bitmap context with the View Size
Whiteboardcontext = cgbitmapcontextcreate (null, self. Frame. Size. Width, self. Frame. Size. Height, 8,
4 * Self. Frame. Size. Width, colorspace, kcgimagealphapremultipliedfirst );
Cgcolorspacerelstrap (colorspace );

// Create a new cglayer for drawing
Whiteboardlayer = cglayercreatewithcontext (whiteboardcontext, self. Frame. Size, null );

// Obtain the context of the new layer
Cgcontextref layercontext = cglayergetcontext (whiteboardlayer );

// Specify the width of the new layer Context
Cgcontextsetlinewidth (layercontext, 1.5 );
Cgcontextsetlinecap (layercontext, kcglinecapround); // specify the line header to be circular.
Cgcontextsetrgbstrokecolor (layercontext, 0.0, 0.0, 0.0, 1); // specify the color of the line, black

}
Return self;
}

// Override drawrect
-(Void) drawrect :( cgrect) rect
{
// Obtain the current context first
Cgcontextref currentcontext = uigraphicsgetcurrentcontext ();

// Generate Bitmap Based on context content
Cgimageref image = cgbitmapcontextcreateimage (whiteboardcontext );
// Draw bitmap to context
Cgcontextdrawimage (currentcontext, [self bounds], image );
// Print whiteboardlayer to the current context
Cgcontextdrawlayerinrect (currentcontext, [self bounds], whiteboardlayer );

}

// Screen touch event touch start
-(Void) touchesbegan :( nsset *) touches withevent :( uievent *) event
{
Uitouch * thetouch = [touches anyobject]; // obtain the touch object first.
If ([thetouch tapcount] = 2) // you can double-click the image to clear the image.
{
Cgcontextclearrect (whiteboardcontext, [self bounds]); // clear

[Self setneedsdisplay]; // refresh the screen
}
Else // if it is not a double-click operation, click the mouse and draw a vertex.
{
[Self touchesmoved: touches withevent: event];
}
}

// Specifies the code used to draw a line when the finger is crossed.
-(Void) touchesmoved :( nsset *) touches withevent :( uievent *) event
{
Uitouch * thetouch = [touches anyobject];

// Obtain the current location
Cgpoint currenttouchlocation = [thetouch locationinview: Self];
// Obtain the last location
Cgpoint lasttougateacation = [thetouch previuslocationinview: Self];

// Obtain the context
Cgcontextref layercontext = cglayergetcontext (whiteboardlayer );
// Start to define path
Cgcontextbeginpath (layercontext );
// Move the start point of path to the previous position
Cgcontextmovetopoint (layercontext, lasttouchloacation. X, lasttouchloacation. y );
// Link between the last position and the current position, and enter the path
Cgcontextaddlinetopoint (layercontext, currenttouchlocation. X, currenttouchlocation. y );
// Draw lines along path
Cgcontextstrokepath (layercontext );

[Self setneedsdisplay]; // refresh the screen

}

-(Void) dealloc
{
Cgcontextrelease (whiteboardcontext );
Cglayerrelease (whiteboardlayer );
[Super dealloc];
}

@ End

 

 

 

3. OpenGL ES Programming

Generally, there are three steps:

(1) drawing in context

(2) Send the content in the context to framebuffer

(3) display framebuffer