Forum Libraries, Components, and Plugins

Self Drawing Paths (Anti-Aliased)

I have a list of cubic beziers that i need to draw over time, since i'm completely new to CocosSharp i tought that it could accomplish that out of the box but apparently there isn't a method for that, so I ended up creating a custom CCFiniteTimeAction where i draw a small segment of the bezier with each Update:

public override void Update(float time)
{
    if (Target != null)
    {
        float xa = BezierConfig.StartPosition.X;
        float xb = BezierConfig.ControlPoint1.X;
        float xc = BezierConfig.ControlPoint2.X;
        float xd = BezierConfig.EndPosition.X;

        float ya = BezierConfig.StartPosition.Y;
        float yb = BezierConfig.ControlPoint1.Y;
        float yc = BezierConfig.ControlPoint2.Y;
        float yd = BezierConfig.EndPosition.Y;

        float x = BezierMath.CubicBezier(xa, xb, xc, xd, time);
        float y = BezierMath.CubicBezier(ya, yb, yc, yd, time);

        CCPoint newPos = new CCPoint(x, y);

        (Target as CCDrawNode).DrawLine(PreviousPosition, newPos, 1, CCColor4B.Orange, CCLineCap.Square);

        PreviousPosition = newPos;
     }
}

And on a CCScene class:

var layer = new CCLayer();
this.AddLayer(layer);
CCDrawNode node = new CCDrawNode();
layer.AddChild(node);

foreach (List<CCFiniteTimeAction> listActions in listListActions)
{
    node.RepeatForever(listActions.ToArray());
}
node.Schedule((f) => node.Clear(), 10);

Each object inside listListActions represents a list of actions required to draw a path composed of bezier curves, and each object inside listActions represents an action to draw a bezier curve. This way:

  • All paths start drawing at same time
  • For each path only one bezier curve is drawn at a time
  • Each bezier curve is drawn over time instead of being drawn instantly.

The solution above works well, and currently i'm drawing 100 paths at same time (each path has in average 45 bezier curves), but as we can see in the gif(nevermind the framerate, it's the gif configuration, the app runs smoothly) the paths seem a bit jagged.

My questions are:

  • Did i miss the methods to draw over time? (Or there are none?)
  • Is there a better way to accomplish the same as above?
  • Is it possible to antialiase the paths?
Sign In or Register to comment.