ObjectiveCeeds › Cocoa: Zeichnen mit NSBezierPath

Cocoa: Zeichnen mit NSBezierPath

Von Manfred Kreß
Und jetzt die Kurve nehmen
Seite 4 von 4



Nun kommt ein neuer Bezierpfad ins Spiel, der eine Kurve zeichnet:
	NSBezierPath *curve = [NSBezierPath bezierPath];
	[curve moveToPoint: NSMakePoint( 50, 150)];
	[curve curveToPoint: NSMakePoint(250, 150) 
		  controlPoint1: NSMakePoint(100, 200) 
		  controlPoint2: NSMakePoint(200, 100)];
	[[NSColor greenColor] set];
	[curve stroke];
Ein Bezierpfad besteht aus einem Anfangs- und Endpunkt und einem (quadratische Bezierkurve) oder zwei (kubische Bezierkurve) Stützpunkten. Die Linie, die zwischen Anfangs- und Endpunkt gezeichnet wird, krümmt sich weich in Richtung des oder der Stützpunkte. Die beiden folgenden Grafiken verdeutlichen gut die Konstruktion der Kurven. Quadratische Bezierkurve Kubische Bezierkurve Zumindest die quadratische Bezierkurve hat wohl jeder von uns schon einmal in einer langweiligen Mathestunde konstruiert. Um sich die Langeweile zu vertreiben, waren Karopapier und Geodreieck die unauffälligsten Mittel. Eine Ausführlichere mathematische Erklärung findet sich natürlich auf Wikipedia, wo auch die obigen Grafiken her sind. NSBezierPath arbeitet mit kubischen Bezierkurven. Kontrollpunkt1 bezieht sich auf den Anfangspunkt, Kontrollpunkt2 auf den Endpunkt der Kurve. Das dicke Ei Und jetzt zeichnen Sie ein Ei:
	NSBezierPath *egg = [NSBezierPath bezierPath];
	[egg moveToPoint: NSMakePoint( 100, 200)];
	[egg curveToPoint: NSMakePoint(100, 300) 
		controlPoint1: NSMakePoint(20, 200) 
		controlPoint2: NSMakePoint(20, 300)];
	
	[egg curveToPoint: NSMakePoint(100, 200) 
		controlPoint1: NSMakePoint(300, 300) 
		controlPoint2: NSMakePoint(300, 200)];
	
	[egg closePath];
	
	[[NSColor blueColor] set];
	[egg fill];
Zuerst wird eine Linie von (100/200) nach (100/300) gezeichnet. Also 100 Pixel lang, nach oben. Die Stützpunkte ziehen die Linie jeweils nach links. Dann wird eine zweite Kurve angehängt, dieses mal von (100/300) nach (100/200). Also die gleiche Linie, nur in entgegengesetzter Richtung. Dieses mal wird die Linie nach rechts gezogen. Die Stützpunkte liegen jetzt etwas weiter entfernt in der X-Richtung als bei der ersten Linie. Dadurch wird Linie zwei auch weiter nach rechts gezogen. So entsteht ein Bezierpfad, der in etwas die Form eines Ei's hat - in etwa... Mit closePath wird der Pfad geschlossen. Eigentlich kann man sich das sparen. Denn Cocoa schließt einen offnen Pfad automatisch, wenn der Anwender das nicht tut und den Pfad füllen möchte. Liegen Anfangs- und Endpunkt nicht übereinander, wird der Pfad mit einer geraden Linie zwischen diesen Punkten geschlossen. Der Pfad wird mit Blau gefüllt und erhält mit stroke noch eine schwarze Umrandung. Vollendete Kunst... Ausblick NSBezierPath hält noch eine Fülle weiterer Methoden bereit. Die Stärke von Linien kann zum Beispiel geändert werden oder der Stil, wie Linien abschließen. Mit diesem Artikel sollten Sie das Handwerkszeug haben, NSBezierPath weiter zu erkunden. Download des Projekts Download über Bitbucket Oder direkt mit Mercurial auschecken: hg clone https://bitbucket.org/ObjectiveCeeds/bezierpathexample

« vorige Seite