Damian Brunold

PaintCode Applikation

2014-11-20 19:41 OSX, ObjC, Programmieren

Ich habe eine spannende, neue Applikation für OS X entdeckt: PaintCode. Damit kann man Vektorgrafiken zeichnen und erhält dann den entsprechenden Objective-C Code, der die Grafik erstellt. Damit kann man auflösungsunabhängige und sogar dynamische Bilder und Icons in Programme integrieren.

Ich kenne das Programm erst seit kurzem und kenne sicher noch nicht alle Feinheiten. Aber was ich bisher gesehen habe überzeugt mich.

Der erste Einsatz ist das Zeichnen der Motive für meine geplante Memory-App.

Dieses Bild

wird von diesem (abgekürzten) Code erzeugt:

//// Color Declarations
UIColor* brownFill = [UIColor colorWithRed: 0.388 green: 0.224 
  blue: 0.224 alpha: 1];
UIColor* greenFill = [UIColor colorWithRed: 0.256 green: 0.75 
  blue: 0.309 alpha: 1];
CGFloat greenFillHSBA[4];
[greenFill getHue: &greenFillHSBA[0] saturation: &greenFillHSBA[1] 
    brightness: &greenFillHSBA[2] alpha: &greenFillHSBA[3]];

...

//// Leaf
{
    //// Bezier 2 Drawing
    UIBezierPath* bezier2Path = UIBezierPath.bezierPath;
    [bezier2Path moveToPoint: CGPointMake(64.5, 17.5)];
    [bezier2Path addLineToPoint: CGPointMake(53.5, 18.5)];
    [bezier2Path addLineToPoint: CGPointMake(44.5, 18.5)];
    [bezier2Path addLineToPoint: CGPointMake(36.5, 21.5)];
...
    [bezier2Path addLineToPoint: CGPointMake(66.5, 18.5)];
    [bezier2Path addLineToPoint: CGPointMake(64.5, 17.5)];
    [bezier2Path closePath];
    [greenFill setFill];
    [bezier2Path fill];
    [greenBorder setStroke];
    bezier2Path.lineWidth = 1;
    [bezier2Path stroke];

    //// Bezier 3 Drawing
    UIBezierPath* bezier3Path = UIBezierPath.bezierPath;
    [bezier3Path moveToPoint: CGPointMake(28.5, 38.5)];
    [bezier3Path addLineToPoint: CGPointMake(38.5, 31.5)];
    [bezier3Path addLineToPoint: CGPointMake(49.5, 25.5)];
    [bezier3Path addLineToPoint: CGPointMake(58.5, 21.5)];
    [greenFill setFill];
    [bezier3Path fill];
    [greenBorder setStroke];
    bezier3Path.lineWidth = 1;
    [bezier3Path stroke];
}

//// Cherry1 Drawing
...

//// Cherry2 Drawing
...

//// Branch Drawing
...