NSBezierPath Curves and Graphs

NSBezierPath Curves and Graphs

In this sample code we will create the below output using NSBezierPath. Here we primarily using moveToPointlineToPoint & curveToPoint methods of NSBezierPath

Generating a Sine Curve using sin method

Generating a Sine Curve using sin method

NSBezierPath-Curve & Lines

NSBezierPath-Curve & Lines

//
//  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

Generating a Sine Curve using sin method

Generating a Sine Curve using sin method

#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

Posted in Cocoa, Objective C, Swift Tagged with: , , ,
0 comments on “NSBezierPath Curves and Graphs
2 Pings/Trackbacks for "NSBezierPath Curves and Graphs"
  1. Timothy says:

    .

    tnx for info.

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

Recent Posts


Hit Counter provided by technology news