NSBezierPath Curves and Graphs
In this sample code we will create the below output using NSBezierPath. Here we primarily using moveToPoint , lineToPoint & curveToPoint methods of NSBezierPath
//
// GraphView.h
// KSSineCurve
//
// Created by Debasis Das on 5/13/14.
// Copyright (c) 2014 Debasis Das. All rights reserved.
//
#import <Cocoa/Cocoa.h>
@interface GraphView : NSView
@end
//
// GraphView.m
// KSSineCurve
//
// Created by Debasis Das on 5/13/14.
// Copyright (c) 2014 Debasis Das. All rights reserved.
//
#import "GraphView.h"
@implementation GraphView
- (void)drawRect:(NSRect)dirtyRect
{
[super drawRect:dirtyRect];
[NSGraphicsContext saveGraphicsState];
[[NSColor blackColor] setFill];
[[NSBezierPath bezierPathWithRoundedRect:[self bounds] xRadius:0.0 yRadius:0.0] fill];
[NSGraphicsContext restoreGraphicsState];
int width = (int)dirtyRect.size.width;
int height = (int)dirtyRect.size.height/2;
[NSGraphicsContext saveGraphicsState];
[[NSColor redColor] set];
NSBezierPath *axisPath = [NSBezierPath bezierPath];
[axisPath setLineWidth:2.0];
[axisPath moveToPoint:NSMakePoint(10, height)];
[axisPath lineToPoint:NSMakePoint(width-10, height)];
[axisPath stroke];
[NSGraphicsContext restoreGraphicsState];
//Sine Curves
[[NSColor blueColor] set];
NSBezierPath *sinePath = [NSBezierPath bezierPath];
[sinePath setLineWidth:0.5];
NSLog(@"height %d",height);
for (int j=300; j<1200;)
{
for (int i=0; i<width;)
{
[sinePath moveToPoint:NSMakePoint(i, height)];
i = i + 180;
[sinePath curveToPoint:NSMakePoint(i, height) controlPoint1:NSMakePoint(i-120, height+j) controlPoint2:NSMakePoint(i-60, height-j)];
[sinePath stroke];
}
j=j+25;
}
//Line Graphs
[[NSColor whiteColor] set];
NSBezierPath *bPath = [NSBezierPath bezierPath];
[bPath setLineWidth:0.5];
for (int i=0; i<width; )
{
[bPath moveToPoint:NSMakePoint(i, height)];
[bPath lineToPoint:NSMakePoint(i, height+arc4random()%(height/2))];
[bPath stroke];
[bPath moveToPoint:NSMakePoint(i, height)];
[bPath lineToPoint:NSMakePoint(i, height-arc4random()%(height/2))];
[bPath stroke];
i=i+3;
}
}
@end
Generating a Sin Curve using sin method in NSBezierPath lineToPoint
#import "SineCurveView.h" @implementation SineCurveView - (void)drawRect:(NSRect)dirtyRect { [super drawRect:dirtyRect]; [NSGraphicsContext saveGraphicsState]; [[NSColor blackColor] setFill]; [[NSBezierPath bezierPathWithRoundedRect:[self bounds] xRadius:0.0 yRadius:0.0] fill]; [NSGraphicsContext restoreGraphicsState]; int width = dirtyRect.size.width; int height = dirtyRect.size.height; int numberOfSineCurves = 30; float cWidth = 20.0; float cHeight = height/3.5; for (int i=0; i<numberOfSineCurves; i++) { NSBezierPath *sinePath = [NSBezierPath bezierPath]; [[NSColor redColor] set]; [sinePath setLineWidth:1.0]; [sinePath moveToPoint:NSMakePoint(i*5+10, height/2)]; for (int j=0; j<width;j++) { [sinePath lineToPoint:CGPointMake((i*6+15)+j*cWidth+10, height/2 - (sin(2*3.14*j/20)*cHeight))]; } [sinePath stroke]; } }
Swift Cocoa Implementation of Sin Curve
class SineCurveView: NSView{ override func drawRect(dirtyRect: NSRect) { NSGraphicsContext.saveGraphicsState() var bPath: NSBezierPath = NSBezierPath(rect: dirtyRect) let blackColor = NSColor(red: 0.0, green: 0.0, blue: 0.0, alpha: 1.0) blackColor.set() blackColor.setFill() bPath.fill() NSGraphicsContext.restoreGraphicsState() var width = dirtyRect.size.width var height = dirtyRect.size.height var numberOfSineCurves = 30 var cWidth = 20.0 var cHeight = height / 3.5 let redColor = NSColor(red: 1.0, green: 0.0, blue: 0.0, alpha: 1.0) for (var i = 0; i < numberOfSineCurves; i++) { var sinePath: NSBezierPath = NSBezierPath() redColor.set() sinePath.lineWidth = 1.0 var xVal = (CGFloat(i) * 5) + 10 sinePath.moveToPoint(NSMakePoint(xVal, height/2)) for (var j = 0; j < Int(width); j++ ) { var xPart1: CGFloat = (CGFloat(i) * 6) + 15 var xPart2 : CGFloat = (CGFloat(j) * CGFloat(cWidth)) + 10 var x1Val: CGFloat = xPart1 + xPart2 var yVal10 : CGFloat = (6.28 * CGFloat(j))/20 var yVal11 = sin(yVal10) * cHeight var yVal12 = height/2 - yVal11 sinePath.lineToPoint(NSMakePoint(x1Val, yVal12)) } sinePath.stroke() } } }
For further reading on Drawing using NSBezierPath also refer to Drawing in Cocoa, Objective C using NSBezierPath
[…] NSBezierPath Curves and Graphs […]