macOS-NSBezierPath画直线矩形三角形文字等
总结Cocoa下画直线、矩形、文字的方法,在界面开发种经常会遇到。要掌握Cocoa画图,首先要知道,NSPoint和NSRect,一个保存坐标点,一个保存一个矩形坐标和长宽,还要明白Cocoa的画布是NSView类,画笔是NSBezierPath类,画图都是通过NSBezierPath这个类对象来实现绘图。
第二种方法:
一个Graphics Context表示一个绘制目标。它包含绘制系统用于完成绘制指令的绘制参数和设备相关信息。Graphics Context定义了基本的绘制属性,如颜色、裁减区域、线条宽度和样式信息、字体信息、混合模式等。
我们可以通过几种方式来获取Graphics Context:Quartz提供的创建函数、Mac OS X框架或IOS的UIKit框架提供的函数。Quartz提供了多种Graphics Context的创建函数,包括bitmap和PDF,我们可以使用这些Graphics Context创建自定义的内容。
1.画直线,有四种方法。
//(1)直线的本质是一个高度较小的矩形 NSRect rect5 = NSMakeRect(50, 70, 1, 250); NSBezierPath *path1 = [NSBezierPath bezierPathWithRect:rect5]; [[NSColor redColor] set]; [path1 fill]; //(2)通过两个点画直线 NSBezierPath *path = [NSBezierPath bezierPath]; NSPoint pt1 = NSMakePoint(50, 70); NSPoint pt2 = NSMakePoint(350, 0); [path moveToPoint:pt1]; [path relativeLineToPoint:pt2]; [path setLineWidth:1]; [[NSColor blueColor] set]; [path stroke]; //(3)无需画笔,直接填充 [[NSColor yellowColor] set]; NSRect lineRect = NSMakeRect(50, 320, 350, 1); NSRectFill(lineRect); //(4)CGContentext CGContextRef myContext = [[NSGraphicsContext currentContext] graphicsPort]; CGContextSetRGBFillColor (myContext, 0, 255, 0, 1); CGContextFillRect (myContext, CGRectMake (400, 70, 1, 250 ));
画表格示例:
for (int i =20; i < 240; i += 20) { NSRect lineRect1 = NSMakeRect(20, i, 200, 1); NSRectFill(lineRect1); NSRect lineRect2 = NSMakeRect(i, 20, 1, 200); NSRectFill(lineRect2); }
2.画虚线
//(1) NSBezierPath *path = [NSBezierPath bezierPath]; CGFloat array[2]; array[0] = 3.0; array[1] = 1.0; [path setLineDash:array count:2 phase:0]; NSPoint pt1 = NSMakePoint(50, 200); NSPoint pt2 = NSMakePoint(300, 0); [path moveToPoint:pt1]; [path relativeLineToPoint:pt2]; [path setLineWidth:1]; [[NSColor redColor] set]; [path stroke]; //(2) CGContextRef context = [[NSGraphicsContext currentContext] graphicsPort]; CGContextSetLineWidth(context, 1); CGFloat dashArray[] = {3,1}; CGContextSetLineDash(context, 1, dashArray, 1);//跳过3个再画虚线,所以刚开始有6-(3-2)=5个虚点 CGContextMoveToPoint(context, 50, 100); CGContextAddLineToPoint(context, 350, 100); CGContextStrokePath(context);
3.画矩形
//2.画矩形 //(1)NSBezierPath NSRect rect1 = NSMakeRect(200, 200, 50, 50); NSBezierPath *thePath1 = [NSBezierPath bezierPathWithRect:rect1]; NSColor *theColor1 = [NSColor redColor]; [theColor1 set]; [thePath1 fill]; //(2)无需画笔,直接填充 [[NSColor blackColor] set]; NSRect rect2 = NSMakeRect(250, 100, 150, 45); NSRectFill(rect2); //(3)CGContent CGContextRef myContext2 = [[NSGraphicsContext currentContext] graphicsPort]; CGContextSetRGBFillColor (myContext2, 255, 0, 255, 1); CGContextFillRect (myContext2, CGRectMake (100, 100, 150, 45 ));
4.画椭圆
//3.画椭圆 //(1) NSBezierPath *path3 = [NSBezierPath bezierPathWithOvalInRect:NSMakeRect(150, 150, 100, 50)]; [[NSColor whiteColor] set]; [path3 fill]; //(2) //可通过两个参数来控制边角的弧度 NSBezierPath *path2 = [NSBezierPath bezierPathWithRoundedRect:NSMakeRect(150, 200, 100, 50) xRadius:90 yRadius:90]; [[NSColor lightGrayColor] set]; [path2 fill]; //(3) CGContextRef ctx = [[NSGraphicsContext currentContext] graphicsPort]; CGContextAddEllipseInRect(ctx, NSMakeRect(150, 250, 100, 50)); CGContextSetRGBFillColor(ctx, 255, 255, 0, 1); CGContextFillPath(ctx);
5.画圆
//(1) NSBezierPath *path3 = [NSBezierPath bezierPathWithOvalInRect:NSMakeRect(150, 50, 100, 100)]; [[NSColor whiteColor] set]; [path3 fill]; //(2) //可通过两个参数来控制边角的弧度 NSBezierPath *path2 = [NSBezierPath bezierPathWithRoundedRect:NSMakeRect(150, 150, 100, 100) xRadius:90 yRadius:90]; [[NSColor lightGrayColor] set]; [path2 fill]; //(3) CGContextRef ctx = [[NSGraphicsContext currentContext] graphicsPort]; CGContextAddEllipseInRect(ctx, NSMakeRect(150, 250, 100, 100)); CGContextSetRGBFillColor(ctx, 255, 255, 0, 1); CGContextFillPath(ctx);
6.画三角形
NSBezierPath *path = [NSBezierPath bezierPath]; NSPoint pt1 = NSMakePoint(50, 50); NSPoint pt2 = NSMakePoint(50, 50); NSPoint pt3 = NSMakePoint(50, -50); NSPoint pt4 = NSMakePoint(-100, 0); [path moveToPoint:pt1]; [path relativeLineToPoint:pt2]; [path relativeLineToPoint:pt3]; [path relativeLineToPoint:pt4]; [path stroke]; [[NSColor redColor] set]; [path fill];
7画文字
//4.画字体 //(1)NSString绘制字符串 NSString * s1 = @"hello wrold"; NSMutableDictionary *md = [NSMutableDictionary dictionary]; //字体类型和大小 [md setObject:[NSFont fontWithName:@"Arial" size:20] forKey:NSFontAttributeName]; //字体颜色 [md setObject:[NSColor yellowColor] forKey:NSForegroundColorAttributeName]; [s1 drawAtPoint:NSMakePoint(200, 300) withAttributes:md]; //(2)NSMutableAttributedString绘制带属性字符串 NSMutableAttributedString *s = [[NSMutableAttributedString alloc] initWithString:@"Big Nerd Ranch"]; //字体类型和大小 [s addAttribute:NSFontAttributeName value:[NSFont fontWithName:@"Arial Black" size:22] range:NSMakeRange(0,14)]; //给字体加下划线 [s addAttribute:NSUnderlineStyleAttributeName value:[NSNumber numberWithInt:1] range:NSMakeRange(0,3)]; //字体颜色 [s addAttribute:NSForegroundColorAttributeName value:[NSColor greenColor] range:NSMakeRange(0,8)]; //上下移动 [s addAttribute:NSSuperscriptAttributeName value:[NSNumber numberWithInt:1] range:NSMakeRange(0, 5)]; [s drawInRect:[self bounds]]; //(3)CGContext NSPoint point = NSMakePoint(80, 80); CGContextRef myContext = [[NSGraphicsContext currentContext] graphicsPort]; CGContextSelectFont (myContext, "Helvetica-Bold",1,kCGEncodingMacRoman); CGContextSetCharacterSpacing (myContext, 0.5); CGContextSetTextDrawingMode (myContext, kCGTextFill); CGContextSetRGBFillColor (myContext, 0, 1, 0, 0.5); CGContextShowTextAtPoint (myContext,point.x , point.y, "www.google.com", 14);
也可以直接画在控件上,像如下:
NSMutableAttributedString *s = [[NSMutableAttributedString alloc] initWithString:@“Big Nerd Ranch”];
//字体大小
[s addAttribute:NSFontAttributeName value:[NSFont fontWithName:@“Arial Black” size:22] range:NSMakeRange(0,14)];
//给字体加下划线
[s addAttribute:NSUnderlineStyleAttributeName value:[NSNumber numberWithInt:1] range:NSMakeRange(0,3)];
//字体颜色
[s addAttribute:NSForegroundColorAttributeName value:[NSColor greenColor] range:NSMakeRange(0,8)];
//上下移动
[s addAttribute:NSSuperscriptAttributeName value:[NSNumber numberWithInt:1] range:NSMakeRange(0, 5)];
[button setAttributedTitle:s];
[label setAttributedStringValue:s];