UI Advanced--quartz2d Simple Introduction

1, Quartz 2D is a two-dimensional drawing engine, while supporting the iOS and Mac system API is pure C language, API from the core graphics framework, data types and functions are basically a CG as a prefix, such as:

Cgcontextref

Cgpathref

Cgcontextstrokepath (CTX);

......

2, quartz2d can do the work :

draw graphics : lines \ triangle \ Rectangle" Span style= "Font-family:simsun;" lang= "en-US" >\ round \ arc \ fan-like

Draw text ;

Draw \ generate picture ( image );

Read \ generate PDF;

\ crop the picture ;

Custom UI controls ;

......

3. Thevalue of quartz2d in iOS development:

iOS provides a uikit framework for easy-to-build UI interface,?? There are a variety of UI controls

UILabel: Explicit text

Uiimageview: Show Pictures

UIButton: Simultaneous display of pictures and words (can click)

Philip? Uikit Framework provides controls that can be pieced together to build and realistically some simple, common UI realms?

However, some UI interfaces are extremely complex, and more personalized, and the normal UI controls cannot be implemented, so you can use the quartz2d technique to draw the structure inside the control and customize what the control looks like

In fact, the contents of some controls in iOS are drawn through quartz2d.

So, quartz2d is important in iOS development. The value is: Custom view (custom UI control)

4. Graphics Context (Graphics Context): is a cgcontextref type of data

The role of the graphics context:

(1) Save drawing information, drawing status

(2) Decide which output target to draw (to what place?) (The output target can be a PDF file, a bitmap or a display window)

The same set of drawing sequences, specifying different graphics Context, can draw the same image to different targets

QUARTZ2D provides the following types of graphical contexts:

5. Use quartz2d to customize view:

1, first drag a control on the Main.storyboard , with the control as a graphical context ;

2.create a new class, inherit from UIView, and associate with the control in 1;

3.implement the DrawRect method in the new class ;

3.1, get the graphical context:

Cgcontextref context = Uigraphicsgetcurrentcontext ();

3.2 , draw the appropriate content:

Cgcontext the beginning of the method // specific look at the graphics you need to draw

3.3, using the graphical context to render the content rendered to the view ;

1 cgcontextstrokepath// method, achieve the hollow effect 2 cgcontextfillpath// method, The fill effect is achieved

6, DrawRect: Method:

1, why to achieve DrawRect: "Law to draw to the view?"

Because the Graphical context associated with the view can be obtained in the DrawRect:? Method

2, DrawRect: When was the law called?

When view is first displayed on the screen (added to UIWindow)

Call view's Setneedsdisplay or Setneedsdisplayinrect: when

After getting the context in the DrawRect: method, it is possible to draw something into the view with a layer property inside the view, DrawRect: The method obtains a layer Graphics context, so The drawing is actually drawn to the layer of the view, the view is able to display things, completely because of its internal layer

7, quartz2d the code of the drawing steps:

//Get the graphics contextCgcontextref CTX =Uigraphicsgetcurrentcontext ();//Draw PathCgcontextstrokepath (CTX);//draw a hollow effectCgcontextfillpath (CTX);//draw a solid effect//create a new starting pointvoidCgcontextmovetopoint (cgcontextref C, CGFloat x, cgfloat y)//Add a new segment to a pointvoidCgcontextaddlinetopoint (cgcontextref C, CGFloat x, cgfloat y)//Add a rectanglevoidCgcontextaddrect (cgcontextref C, cgrect rect)//Add an ellipsevoidCgcontextaddellipseinrect (cgcontextref context, CGRect rect)//Add an arcvoidCgcontextaddarc (cgcontextref C, CGFloat x, cgfloat y, cgfloat radius, cgfloat startangle, CGFloat endangle,intclockwise)//related Operations on the graphics context stack//Save the current context copy to the top of the stack (the stack is called the "graphics Context stack")voidcgcontextsavegstate (cgcontextref c)//Stack the context of the top of the stack, replacing the current contextvoidCgcontextrestoregstate (Cgcontextref c)

UI Advanced--quartz2d Simple Introduction