Quartz2d effect: Draw patterns, draw text, draw pictures, custom controls, in fact, most of the UI control content is drawn through the qurtz2d
Quartz2d is from the core graphics is a two-dimensional drawing engine that supports both iOS and Mac systems
To use quartz2d to draw things to view the steps:
1. Custom class, Inherit from UIView
2. Implementing the DrawRect Method
2.1 Gets the associated image context for the current view: Cgcontextref CTX = Uigraphicsgetcurrentcontext ();
2.2 Drawing the appropriate graphic content
2.3 Render all the content drawn to view with a graphical context: Cgcontextfillpath (CTX) or Cgcontextstrokepath (CTX);
Common quartz2d methods:
Cgcontextref CTX = Uigraphicsgetcurrentcontext ();//Get context, return the same
Cgcontextmovetopoint (CTX, 0, 0);//Setting the starting point can also be the starting point to reset
Cgcontextaddlinetopoint (CTX, 100, 100);//Add a day segment
Cgcontextaddlinetopoint (CTX, 200, 300);//Don't set the starting point again
Cgcontextclosepath (CTX);//Close the path, that is, the connection start and end point
Cgcontextaddrect (CTX, cgrectmake (0, 0, 100, 100));//Draw Rectangle
Cgcontextaddrect (CTX, cgrectmake (0, 0, 100, 100));//Draw Rectangle
Cgcontextaddellipseinrect (CTX, cgrectmake (0, 0, 100, 50));//Draw Ellipse
Cgcontextaddarc (CTX, 0, M_PI, 1),//radius: Radius startangle Start Angle clockwise:0 is clockwise 1 is counterclockwise
Cgcontextsetlinewidth (CTX, 5);//Set line width
Cgcontextsetrgbfillcolor (CTX, 0, 0, 0, 1);//Set RGB solid color
Cgcontextsetrgbstrokecolor (CTX, 0, 0, 0, 1);//Set RGB hollow Color
Cgcontextsetlinecap (CTX, kcglinecapround);//Set Head is round
Cgcontextsetlinejoin (CTX, kcglinejoinround);//Set a turning point
[[Uicolor Whitecolor] set];//can set the color, both solid and hollow can be
[Str drawatpoint:cgpointzero withattributes:nil];//Drawing text
[Image drawinrect:cgrectmake (0, 0, 150, 150)];//picture
[Image drawaspatterninrect:cgrectmake (0, 0, 150, 150)];//tile effect
Cgcontextfillpath (CTX);//rendering, SOLID
Cgcontextstrokepath (CTX);//rendering, hollow
Graphics context stack (using this can):
Cgcontextsavegstate (CTX);//Put CTX copy on the stack at once
Cgcontextrestoregstate (CTX);//stack top context out of the stack, replacing the current context
QUARTZ2D Application Scenario:
1. Water seal (two sheets of synthetic one) example:
UIImage *backgroundimage = [UIImage imagenamed:@ "backgroundimage"];//load picture, in order to set the width of the context after
Uigraphicsbeginimagecontextwithoptions (Backgroundimage.size, NO, 0.0);//Create a bitmap-based context based on the background image
[Oldimage drawinrect:cgrectmake (0, 0, backgroundImage.size.width, backgroundImage.size.height)];//Picture It Up
UIImage *logo = [UIImage imagenamed:@ "logo"];//add watermark Image
CGRect logorect;//Setting the location of the logo
[Logo drawinrect:logorect];//The watermark to the context
UIImage *newimage = Uigraphicsgetimagefromcurrentimagecontext ();//Create a picture of the composition
Uigraphicsendimagecontext ();//End context
2. Picture clipping
UIImage *image = [UIImage imagenamed:@ "image"];
CGFloat BORDERW = 2;//Sets the size of the outer ring
CGFloat CONTEXTW = image.size.width + borderw * 2;
CGFloat contexth = image.size.height + borderw * 2;
Uigraphicsbeginimagecontextwithoptions (Cgsizemake (CONTEXTW, Contexth), NO, 0.0);//
Cgcontextref CTX = Uigraphicsgetcurrentcontext ();//Gets the current context,
CGFloat CenterX = Imagew * 0.5;
CGFloat centery = Imageh * 0.5;
Cgcontextaddarc (CTX, CenterX, CenterY, CenterX, 0, M_PI * 2, 0);//Draw a circle
[[Uicolor Whitecolor] set];
Cgcontextfillpath (CTX);
CGFloat radius = oldImage.size.width * 0.5;
Cgcontextaddarc (CTX, CenterX, centery, radius, 0, M_PI * 2, 0);
Cgcontextclip (CTX);//cropping, clipping is only affecting the back
[Image Drawinrect:cgrectmake (Borderw, Borderw, Image.size.width, Image.size.height)];
UIImage *newimage = Uigraphicsgetimagefromcurrentimagecontext ();
Uigraphicsendimagecontext ();
3. Screen Cutting
Uigraphicsbeginimagecontextwithoptions (Self.view.frame.size, NO, 0.0);//Open context based on view size
[Self.view.layer Renderincontext:uigraphicsgetcurrentcontext ()];//draw the view's layer into context
UIImage *newimage = Uigraphicsgetimagefromcurrentimagecontext ();//Generate pictures based on context
Uigraphicsendimagecontext ();//End context
To summarize:
(1) To create a graphical context and are all based on the bitmap uigraphicsbeginimagecontextwithoptions
(2) Obtain the current context in the above implementation drawing Cgcontextref CTX = Uigraphicsgetcurrentcontext ();
(2) Close Uigraphicsendimagecontext () after using the graphics context;
* Save the image to the sandbox code:
NSString * Path = [[Nssearchpathfordirectoriesindomains (NSDocumentDirectory, Nsuserdomainmask, YES) LastObject] stringbyappendingstring:@ "Name.png"];
NSData *data = uiimagepngrepresentation (newimage);
[Data Writetofile:path Atomically:yes];
Related knowledge points and points of attention:
(1) Do not use context when drawing text and pictures (using OC to draw is not necessary for context)
(2) If you want to draw a variety of colors, you need to render once, you can also use the graphics context stack
(3) The DrawRect method cannot be called manually, but can be manually called Setneedsdisplay, which will clear the last time
(4) Awakeformnib when a control is created from the Xib, it is called
(5) When customizing a control, be sure to override the setter method if there is a property inside the control
(6) layer is not DrawRect method, but can be used Renderincontext
(7) When the button is clicked, the screenshot should be delayed (the delay function is introduced in the GCD note), because the button will turn gray when clicked.
(8) If you want to draw to the view, it can only be drawn in DrawRect, because the graphics context of the view can be taken in the DrawRect method
(9) View is able to show things because the layer inside it
iOS Learning _quartz2d Learning notes