UIView-繪製相關
阿新 • • 發佈：2019-01-07
一、獲取當前繪製上下文
//獲取繪圖上下文只有在drawRect:方法中獲取有效
CGContextRef ctx = UIGraphicsGetCurrentContext();
//設定每次清空上一次繪製的內容（initWithFrame方法中做）
self.clearsContextBeforeDrawing = YES;二、相關屬性設定
//設定線寬 CGContextSetLineWidth(ctx, 16); //設定線條顏色 CGContextSetRGBStrokeColor(ctx, 0, 1, 0, 1); //設定線條顏色 CGContextSetStrokeColorWithColor(ctx, [UIColor blueColor].CGColor); //設定填充顏色 CGContextSetFillColorWithColor(ctx, [UIColor redColor].CGColor); //設定線段的端點形狀：方形端點 CGContextSetLineCap(ctx, kCGLineCapSquare); //設定點線模式：實現寬6，間距10 CGContextSetLineDash(ctx, 0, patterns1, 2); //取消設定點線模式 CGContextSetLineDash(ctx, 0, 0, 0); //設定線條連線點的形狀 CGContextSetLineJoin(ctx, kCGLineJoinRound); //設定字元間距 CGContextSetCharacterSpacing(ctx, 4); //設定文字繪製模式-填充模式 CGContextSetTextDrawingMode(ctx, kCGTextFill); //設定繪製文字的字型和大小 CGContextSelectFont(ctx, "Courier New", 40, kCGEncodingMacRoman); //使用預設的陰影顏色，陰影向左上投影，模糊度為5 CGContextSetShadow(ctx, CGSizeMake(8, -6), 5); //使用指定的陰影顏色，陰影向右下角投影，模糊度為20 CGContextSetShadowWithColor(ctx, CGSizeMake(10, 8), 20, [UIColor redColor].CGColor);
三、繪製操作
//繪製線段（預設不繪製端點） CGContextStrokeLineSegments(ctx, points1, 3); //繪製一個矩形邊框 CGContextStrokeRect(ctx, CGRectMake(30, 230, 120, 60)); //繪製一個橢圓 CGContextStrokeEllipseInRect(ctx, CGRectMake(30, 380, 120, 60)); //填充一個矩形 CGContextFillRect(ctx, CGRectMake(30, 120, 120, 60)); //對CGContextRef 繪製文字時應用變換 //void CGContextSetTextMatrix(CGContextRef cg_nullable c, CGAffineTransform t) CGContextSetTextMatrix(ctx, rotate); //繪製文字 CGContextShowTextAtPoint(ctx, 50, 300, "crazyit.org", 11);
四、路徑
-(void)drawRect:(CGRect)rect{ #if 1 CGContextRef ctx = UIGraphicsGetCurrentContext(); for (int i = 0; i<10; i++) { CGContextBeginPath(ctx);//開始定義路徑 //新增一段圓弧，最後一個引數1代表逆時針，0代表順時針 /** 畫弧度 @param ctx 繪圖上下文 @param 引數2 圓心引數 @param 引數3 圓心引數 @param 引數4 開始角度 @param 引數5 結束角度 @param 引數6 0代表順時針，1代表逆時針 */ CGContextAddArc(ctx, i*25, i*25, (i+1)*8, M_PI*1.5, M_PI, 0); CGContextClosePath(ctx);//關閉路徑 CGContextSetRGBFillColor(ctx, 1, 0, 1, (10-1)*0.1);//設定填充顏色 CGContextFillPath(ctx);//填充當前路徑 } #elif 0 CGContextRef ctx = UIGraphicsGetCurrentContext(); //開始新增路徑 CGContextBeginPath(ctx); //新增一個五角星的路徑 CGContextAddStar(ctx, 5, 80, 150, 40); //新增一個圓角矩形的路徑 CGContextAddRoundRect(ctx, 10, 30, 150, 70, 14); //關閉路徑 CGContextClosePath(ctx); //設定線條顏色 CGContextSetRGBStrokeColor(ctx, 1, 1, 0, 1); //設定線寬 CGContextSetLineWidth(ctx, 4); //繪製路徑 CGContextStrokePath(ctx); //開始新增路徑 CGContextBeginPath(ctx); //新增一個五角星的路徑 CGContextAddStar(ctx, 5, 240, 150, 40); //新增一個圓角矩形的路徑 CGContextAddRoundRect(ctx, 170, 30, 130, 70, 14); //關閉路徑 CGContextClosePath(ctx); //設定填充顏色 CGContextSetRGBFillColor(ctx, 1, 0, 1, 1); //採用填充並繪製路徑的方式來繪製路徑 CGContextDrawPath(ctx, kCGPathFillStroke); //開始新增路徑 CGContextBeginPath(ctx); //新增一個三角星的路徑 CGContextAddStar(ctx, 3, 60, 220, 40); //關閉路徑 CGContextClosePath(ctx); //設定填充顏色 CGContextSetRGBFillColor(ctx, 1, 0, 0, 1); //填充路徑 CGContextFillPath(ctx); //開始新增路徑 CGContextBeginPath(ctx); //新增一個七角星的路徑 CGContextAddStar(ctx, 7, 160, 220, 40); //關閉路徑 CGContextClosePath(ctx); //設定填充顏色 CGContextSetRGBFillColor(ctx, 0, 1, 0, 1); //填充路徑 CGContextFillPath(ctx); //開始新增路徑 CGContextBeginPath(ctx); //新增一個九角星的路徑 CGContextAddStar(ctx, 9, 260, 220, 40); //關閉路徑 CGContextClosePath(ctx); //設定填充顏色 CGContextSetRGBFillColor(ctx, 0, 0, 1, 1); //填充路徑 CGContextFillPath(ctx); #elif 0 //獲取繪圖上下文 CGContextRef ctx = UIGraphicsGetCurrentContext(); //開始新增路徑 CGContextBeginPath(ctx); //新增5花瓣路徑 CGContextAddFlower(ctx, 5, 50, 100, 30, 80); //設定填充顏色 CGContextSetRGBFillColor(ctx, 1, 0, 0, 1); //填充路徑 CGContextFillPath(ctx); //新增6花瓣路徑 CGContextAddFlower(ctx, 6, 160, 100, 30, 80); //設定填充顏色 CGContextSetRGBFillColor(ctx, 1, 1, 0, 1); //填充路徑 CGContextFillPath(ctx); //新增7花瓣路徑 CGContextAddFlower(ctx, 7, 270, 100, 30, 80); //設定填充顏色 CGContextSetRGBFillColor(ctx, 1, 0, 1, 1); //填充路徑 CGContextFillPath(ctx); //關閉路徑 CGContextClosePath(ctx); /***************************************************************************\ * PS：重要說明 * 注意到上面的程式並未在每次新增花朵路徑後立即關閉 * 這也是被允許的，而且每次填充路徑時並不會再次填充前一次已經填充過的路徑。 * 這是因為只用程式繪製了CGContexRef當前所包含的路徑 * 系統會自動清除已經繪製的路徑 * \************************************************************************/ #endif }
/**
該方法負責繪製圓角矩形。
@param c 繪圖上下文
@param x1 左上角x
@param y1 左上角y
@param width 圓角矩形的寬
@param height 圓角矩形的高
@param radius 圓角半徑
*/
void CGContextAddRoundRect(CGContextRef c,CGFloat x1,CGFloat y1,CGFloat width,CGFloat height,CGFloat radius){
//移動到左上角
CGContextMoveToPoint(c, x1+radius, y1);
//新增一條連線到右上角的線段
CGContextAddLineToPoint(c, x1+width-radius, y1);
//新增一段圓弧
CGContextAddArcToPoint(c, x1+width, y1, x1+width, y1+radius, radius);
//新增一條連線到右下角的線段
CGContextAddLineToPoint(c, x1+width, y1+height-radius);
//新增一段圓弧
CGContextAddArcToPoint(c, x1+width, y1+height, x1+width-radius, y1+height, radius);
//新增一條連線到左下角的線段
CGContextAddLineToPoint(c, x1+radius, y1+height);
//新增一段圓弧
CGContextAddArcToPoint(c, x1, y1+height, x1, y1+height-radius, radius);
//新增一條連線到左上角的線段
CGContextAddLineToPoint(c, x1, y1+radius);
//新增一段圓弧
CGContextAddArcToPoint(c, x1, y1, x1+radius, y1, radius);
}
/**
該方法負責繪製多角星
@param c 繪製上下文
@param n 該引數通常應為奇數，控制繪製N角星
@param dx 中心x
@param dy 中心y
@param size 控制N角星的大小
*/
void CGContextAddStar(CGContextRef c,NSInteger n,CGFloat dx,CGFloat dy,NSInteger size){
CGFloat dig = 4*M_PI/n;
CGContextMoveToPoint(c, dx, dy+size);//移動到指定地點
for (int i = 1; i<=n; i++) {
CGFloat x = sin(i*dig);
CGFloat y = cos(i*dig);
//繪製當前點連線到指定點的線條
CGContextAddLineToPoint(c, x*size + dx, y*size+dy);
}
}
/**
該方法負責繪製花朵
@param c 繪圖上下文
@param n 花瓣數
@param dx 花朵位置x
@param dy 花朵位置y
@param size 控制花朵大小
@param length 控制花瓣長度
*/
void CGContextAddFlower(CGContextRef c,NSInteger n,CGFloat dx,CGFloat dy,CGFloat size,CGFloat length){
//移動到指定地點（二次曲線的起始點）
CGContextMoveToPoint(c, dx, dy+size);
CGFloat dig = 2*M_PI/n;
//採用迴圈新增n段二次曲線路徑
for (int i = 1; i<n+1; i++) {
//計算控制點的座標
CGFloat ctrlX = sin((i-0.5)*dig)*length+dx;
CGFloat ctrly = cos((i-0.5)*dig)*length+dy;
//計算結束點的座標
CGFloat x = sin(i*dig)*size+dx;
CGFloat y = cos(i*dig)*size+dy;
//新增二次曲線（二次曲線由 起始點 控制點 結束點 ）
CGContextAddQuadCurveToPoint(c, ctrlX, ctrly, x, y);
}
}五、將繪圖轉為UIImage並存儲到本地
-(UIImage*)drawImage:(CGSize)size{
//建立記憶體中的圖片(繪製環境)
UIGraphicsBeginImageContext(size);
//獲取繪圖上下文
CGContextRef ctx = UIGraphicsGetCurrentContext();
//設定線寬
CGContextSetLineWidth(ctx, 8);
//----------下面開始向記憶體中繪製圖形----------
//設定線條顏色
CGContextSetRGBStrokeColor(ctx, 0, 1, 0, 1);
//繪製一個矩形邊框
CGContextStrokeRect(ctx, CGRectMake(30, 30, 120, 60));
//設定線條顏色
CGContextSetRGBFillColor(ctx, 1, 1, 0, 1);
//繪製一個矩形邊框
CGContextStrokeRect(ctx, CGRectMake(180, 30, 120, 60));
//設定線條顏色
CGContextSetRGBFillColor(ctx, 0, 1, 1, 1);
//繪製一個橢圓
CGContextStrokeEllipseInRect(ctx, CGRectMake(30, 120, 120, 60));
//設定填充顏色
CGContextSetRGBFillColor(ctx, 1, 0, 1, 1);
CGContextFillEllipseInRect(ctx, CGRectMake(180, 120, 120, 60));
//獲取該繪圖Context中的圖片
UIImage * newImage = UIGraphicsGetImageFromCurrentImageContext();
//----------結束繪圖----------
UIGraphicsEndImageContext();
//獲取當前應用路徑中Documents 目錄下的指定檔名對應的檔案路徑
NSString * path = [[NSHomeDirectory()
stringByAppendingPathComponent:@"Documents"]
stringByAppendingPathComponent:@"newPng.png"];
//儲存png圖片
[UIImagePNGRepresentation(newImage) writeToFile:path atomically:YES];
return newImage;
}