Uikit FRAME (quartz2d)

• quartz2d Introduction

What is quartz2d?

is a two-dimensional drawing engine that supports both iOS and Mac systems.

The value of quartz2d?

However, some UI interfaces are extremely complex and more personalized and cannot be implemented with normal UI controls, so you can use quartz2d technology to draw the structure inside the control and customize the control's appearance.

In fact, the contents of most controls in iOS are drawn by quartz2d (some are rendered by WebKit)

How to develop?

Using Frame Coregraphics

Quartz2d is a set of C-language APIs, but uses an object-oriented approach to development

Image Context object:

Is the most core object, the Cgcontextref type

Many of the C language frameworks in iOS have types that are suffixed with ref, which can be understood as objects

such as Cfstringref cfcolorref cfimageref, etc.

The role of the context:

Save drawing information, status, determine the output target of the drawing (layer of view object, image artboard, PDF, etc.)

650) this.width=650; "src=" Http://s4.51cto.com/wyfs02/M01/7C/A4/wKiom1bUN5yAbZoHAARe3L5-rpQ650.png "title=" screen shot 2016-02-29 pm 8.20.18.png "width=" height= "408" border= "0" hspace= "0" vspace= "0" style= "width:600px;height:408px;" alt= "Wkiom1bun5yabzohaare3l5-rpq650.png"/>

• Drawing of UIView

To draw a uiview, you need to override DrawRect in the subclass: method

-(void) DrawRect: (cgrect) rect

In this method, a context object that loves a layer of the current view object is created automatically, and is obtained by using the following function

Cgcontextref uigraphicsgetcurrentcontext (void);

UIView The Brush frame:

DrawRect of the UIView subclass: Timing of method invocation:

1) The first time the object is displayed

2) Call the Setneedsdisplay or Setneedsdisplayinrect method of the View object

Therefore, the Setneedsdisplay method can be used to achieve the graphical brush frame (redraw) operation.

-(void) Setneedsdisplay

• Drawing of pictures

The context of the picture drawing needs to be created in code:

void Uigraphicsbeginimagecontext (cgsize size);       Identifies the beginning of the context void uigraphicsendimagecontext (void); Identifies the end of the context

Size parameter: The sizes of the picture canvas

Within this position, the context object can be obtained through the Uigraphicsgetcurrentcontext () function

Gets the UIImage object drawn in the current context

UIImage * Uigraphicsgetimagefromcurrentimagecontext (void);

UIImage the function that the object is saved to the photo:

void Uiimagewritetosavedphotosalbum (UIImage *image, id completiontarget, selcompletionselector, void *contextinfo);

• How to Draw

To draw the steps:

1) Get Context object

2) to draw

3) Rendering

Once the context is obtained, it is possible to draw the graphic on the context, and the content drawn needs to be rendered to the context

void Cgcontextstrokepath (Cgcontextref c);     The boundary mode renders void Cgcontextfillpath (Cgcontextref c); Fill mode rendering

To set the color of a brush:

void Cgcontextsetrgbstrokecolor (cgcontextref context, CGFloat red, Cgfloatgreen, CGFloat Blue, cgfloat alpha); void Cgco Ntextsetrgbfillcolor (cgcontextref context, CGFloat red, Cgfloatgreen, CGFloat Blue, cgfloat Alpha);

You can also set the Uicolor object by its set mode.

-(void) set-(void) setfill-(void) Setstroke

To set the brush line width:

void Cgcontextsetlinewidth (Cgcontextref C, cgfloat width);

Set the style of the brush ending point:

void Cgcontextsetlinecap (cgcontextref C, cglinecap cap);

To set the style of the brush inflection point:

void Cgcontextsetlinejoin (Cgcontextref C, cglinejoin join);

Save/restore of Brush State (stacked)

void Cgcontextsavegstate (Cgcontextref c); void Cgcontextrestoregstate (Cgcontextref c);

• Draw Basic Shapes

To determine where to draw:

void Cgcontextmovetopoint (Cgcontextref C, CGFloat x, cgfloat y);

To draw a segment:

void Cgcontextaddlinetopoint (Cgcontextref C, CGFloat x, cgfloat y); Draws from the current position to the specified position void Cgcontextaddlines (cgcontextref C, const Cgpoint points[], size_t count); Multi-point draw void Cgcontextclosepath (Cgcontextref c); Draw closed Segments

To draw a rectangle:

void Cgcontextaddrect (Cgcontextref C, CGRect rect);

To draw an ellipse:

void Cgcontextaddellipseinrect (Cgcontextref context, cgrect rect);

To draw an arc:

void Cgcontextaddarc (Cgcontextref C, CGFloat x, cgfloat y, cgfloat radius,cgfloat startangle, cgfloat endAngle, int cloc Kwise);

• Path drawing

Bezier-based drawing (Uibezierpath)

+ (instancetype) bezierpath-(void) moveToPoint: (cgpoint) point-(void) Addlinetopoint: (cgpoint) point-(void) closepath-(void) removeallpoints@property (nonatomic) cgfloat linewidth@property (nonatomic) CGLineCap Linecapstyle@property (nonatomic) cglinejoin linejoinstyle-(void) fill-(void) stroke

Cgpath-based drawing

cgmutablepathref cgpathcreatemutable  ( void );void cgpathmovetopoint  (  cgmutablepathref path, const cgaffinetransform *m, cgfloat x, cgfloat  y );void cgpathaddlinetopoint  ( CGMutablePathRef path, const  cgaffinetransform *m, cgfloat x, cgfloat y );void cgpathaddrect  (  CGMutablePathRef path, const CGAffineTransform *m, CGRect rect ); void  CGPathAddEllipseInRect  ( cgmutablepathref path, const cgaffinetransform *m , cgrect rect );void cgpathaddarc  ( CGMutablePathRef path, const  cgaffinetransform *m, cgfloat x, cgfloat y, cgfloat radius,cgfloat  startangle, cgfloat endangle, bool clockwise );void cgpathrelease  (  cgpathref path );

• Draw text

To draw text on the context, you need to use the NSString method:

-(void) Drawinrect: (cgrect) rect-(void) Drawatpoint: (cgpoint) point

• Drawing pictures

-(void) Drawinrect: (cgrect) rect-(void) Drawatpoint: (cgpoint) point blendmode: (cgblendmode) Blendmode Alpha: (cgfloat) alpha-(void) Drawatpoint: (cgpoint) point-(void) Drawatpoint: (cgpoint) point blendmode: (cgblendmode) Blendmode Alpha: ( CGFloat) Alpha

• Screen

Steps:

A. Creating a bitmap context

B. The desired view, drawing its layer to the context

The method by which the view object's Layer property (that is, the view's shape) is drawn to the context

-(void) Renderincontext: (cgcontextref) CTX

C. Getting a UIImage object from a bitmap context

D. Ending a bitmap context

This article is from the "Teacheran" blog, make sure to keep this source http://annmeng.blog.51cto.com/3321237/1746143

Uikit FRAME (quartz2d)