Graphics drawPath errors on Flash and html5 targets

Haxe
#1

OpenFL Graphics class drawPath is not compiling for Flash or html5 targets.

For targets such as mac, this functionality compiles and renders the correct result either as literal:

    var g:Graphics = graphics;
    g.drawPath([1, 2, 2, 2, 2], [20,10, 50,10, 50,40, 20,40, 20,10]);

Or, as typed collections:

    var g:Graphics = graphics;
    var commands:Array<Int> = [1, 2, 2, 2, 2];
    var data:Array<Float> = [20,10, 50,10, 50,40, 20,40, 20,10];
    g.drawPath(commands, data);

Producing the result:

drawPath

However targeting Flash or html5 is giving compiler errors.

With literals, both targets fail to compile giving error:

Flash

Source/Main.hx:13: characters 19-34 : Array should be flash.Vector
Source/Main.hx:13: characters 19-34 : For function argument ‘commands’

html5

Source/Main.hx:13: characters 36-71 : Array should be openfl.Vector
Source/Main.hx:13: characters 36-71 : For function argument ‘data’

As typed collections, Flash target continues to give the same compiler error; however, html5 target builds but produces no visual result.

In Graphics.hx, drawPath is defined as:

public function drawPath (commands:Array<Int>, data:Array<Float>, winding:GraphicsPathWinding = null):Void

Am I not passing expected parameters? Or, am I not implementing path drawing the way OpenFL expects?

#2

Here is what I see in drawPath:

public function drawPath (commands:Vector<Int>, data:Vector<Float>, winding:GraphicsPathWinding = null):Void {
	
	openfl.Lib.notImplemented ("Graphics.drawPath");
	
}

If you use Vector instead of Array (openfl.Vector), it should work for Flash as well as native. This still must be implemented for HTML5/next, this probably would not be difficult to do, the HTML5 graphics is designed to remember a list of draw commands before it comes time to render. This made it simple to copy commands from one Graphics instance to another, and if we implemented the graphics path classes, we would just need a conversion from those classes to the draw command list to get this implemented

#3

Oh, sorry - I discovered html5 was not implemented when benchmarking drawing operations, but apparently lost track of that.

My IDE also seems to always resolve to openfl._v2.display package when I jump to declaration. That keeps getting me. In former _v2 package, it appears to accept arrays instead of vectors.

Perfect - this works:

package;

import openfl.Vector;
import openfl.display.Sprite;
import openfl.display.Graphics;

class Main extends Sprite {

    public function new() {
        super();

        var g:Graphics = graphics;
        g.lineStyle(2, 0x0);

        var commands:Vector<Int> = [1, 2, 2, 2, 2];
        var data:Vector<Float> = [20.0,10.0, 50.0,10.0, 50.0,40.0, 20.0,40.0, 20.0,10.0];
        g.drawPath(commands, data);
    }

}

Thanks, again.

#4

Great!

If anyone sees this, and would be interesting in helping, it would be awesome to get an implementation in for HTML5 / native “next” too.

It would consistent of something like this:

switch (commands[0]) {
    case LINE_TO:
        __commands.push (LineTo (commands[1], commands[2]));
    ...
}

That sort of thing, based on the command type, we’re pulling the values into standard lineTo, moveTo type calls.

#5

found this thread as i had the same problem, and looking your offer, i submitted a pull request with the implementation: https://github.com/openfl/openfl/pull/478 i know is too simple, as it doesn’t check that the path has been closed or if it’s intersects, nor winding is supported, but is gonna work in most cases and at least, could be supported partially would be enough for most of the users. i hope it helps :smiley:

#6

Thanks! I just needed to add a little fix (to update dataIndex for cubic curve) but this is a lot better than an empty implementation, we can always make tweaks and improvements later. Thank you!

1 Like