Path to the IOS 2D drawing (quartz2d) (stroke,fill,clip,subpath,blend)

As usual, this series of blogs is followed by the footsteps of the great God. Follow the example here to post the origin of the original blog:

Http://blog.csdn.net/hello_hwc?viewmode=list

My admiration for the great God is like the surging River Balabala ...

Anyway

stroke-Strokes

Factors that affect strokes

The width of the line-cgcontextsetlinewidth

How the intersection line is handled-cgcontextsetlinejoin

How to handle the top of the line-cgcontextsetlinecap

Further limiting the way the intersection is handled-cgcontextsetmiterlimit

Do you want dashed-line dash Pattern

Color Control-cgcontextsetstrokecolorspace

Brush Color-cgcontextsetstrokecolor/cgcontextsetstrokecolorwithcolor

Stroke Mode-cgcontextsetstrokepattern

The way the dashed brush color crosses the front of the blog has been said, here is not to repeat.

Cgcontextsetmiterlimit

If the current intersection drawing mode is Kcglinejoinmiter (cgcontextsetlinejoin), Quartz determines that the line join is bevel or miter based on the miter value set.
The specific pattern is: Divide the length of the miter by the width of the line, or the join style is bevel if it is less than the set miterlimit value;

First look at the three effects of join

An example might be easier to understand

Cgcontextmovetopoint (context,ten,90 10.0) ;   Cgcontextsetlinejoin (context, kcglinejoinmiter); Cgcontextsetmiterlimit (context,20.0); Cgcontextstrokepath (context);

Effect

Setting Miter to 1 results in the following:

Fill fills

Quartz fill will be considered subpath is closed, and then according to the rules to fill, there are two kinds of rules

1>nonzero winding number rule. Follow the current point, draw a line outside the area, check the intersection if the intersection points from left to right plus one, right to left, minus one. If the result is not 0, it is drawn.

2>even-odd rule, along the current point, takes a line outside the area, checks the intersecting path, the even number is drawn, and the odd number is not drawn.
The specific effect is as follows

Related functions

Cgcontexteofillpath-is populated with even-odd rule.

Cgcontextfillpath-populated with nonzero winding number rule method

cgcontextfillrect/cgcontextfillrects-fills the path within the specified area

cgcontextfillellipseinrect-filled Ellipse

cgcontextdrawpath-drawing Current path (based on parameter Stroke/fill)

clip-Cutting

As the name implies, only the specified area is drawn according to path and is not drawn outside the region.

For example, intercept a circular area.

Effect

Note that the cut is related to the state, assuming that the cut is drawn later in the context of the cut.

If you want to save the state, you need to do a stack and stack processing

Code

- (void) DrawRect: (cgrect) Rect {cgcontextref context=Uigraphicsgetcurrentcontext ();    Cgcontextbeginpath (context); Cgcontextaddarc (Context, -, -, -,0, M_PI *2,true);    Cgcontextclosepath (context);    Cgcontextclip (context); Cgcontextsetfillcolorwithcolor (context, [Uicolor Lightgraycolor].    Cgcolor);    Cgcontextfillrect (context, rect); //New CodeCgcontextsetstrokecolorwithcolor (context, [Uicolor Whitecolor].    Cgcolor); Cgcontextmovetopoint (Context,Ten,Ten); Cgcontextaddlinetopoint (Context, -, -); Cgcontextaddlinetopoint (Context,Ten, -); Cgcontextsetlinewidth (Context,10.0);    Cgcontextsetlinejoin (context, kcglinejoinmiter); Cgcontextsetmiterlimit (Context,20.0); Cgcontextstrokepath (context);}-(Instancetype) initWithFrame: (cgrect) frame{if(self =[Super Initwithframe:frame]) {Self.opaque=NO; }    returnSelf ;}

Related functions

Cgcontextclip cut according to nonzero winding number rule rule
Cgcontexteoclip cut according to even-odd rules
Cgcontextcliptorect cutting to the specified rectangle
Cgcontextcliptorects cutting to a specified rectangular group
Cgcontextcliptomask Cut to mask

Subpath-sub-path

Very simply, after Stroke/fill or Cgcontextbeginpath/cgcontextclosepath, a new sub-path is opened.

Attention:

Cgcontextclosepath, the first point and the last point are connected

Blend Blend Mode

= (Alpha * foreground) + (1 -alpha) * background

You can use Cgcontextsetblendmode to set different color blending modes, note that setting blend is related to the context drawing state, and all state-related settings think of the state stack

Background

ForeGround

Normal Blend Mode

Multiply Blend Mode

The cross-section will appear darker, multiplying with the upper and lower layers, at least as dark as a layer.

Screen Blend Mode

Path to the IOS 2D drawing (quartz2d) (stroke,fill,clip,subpath,blend)