CODEWITHSUNDEEP
androidvectorandroid-canvas
Michal
Michal

Reputation: 3642

Android - Draw bezier curve on Canvas

How can I draw bezier curve on canvas. If I know coordinates of all points and their pivots.

class BezierPoint {
    float pivot_one_x, pivot_one_y;
    float pivot_two_x, pivot_two_y;
    float point_x, point_y;
}

now I have array of this class:

BezierPoint [] points = {...};

and now I want to draw whole line: from points[0] to points[1], points[1] to points[2], ...

Yes android have Path.cubicTo().lineTo().quadTo()... but I do not know how to convert bezier points to work with Path correctly?

Upvotes: 0

Views: 3174

Answers (1)

schwertfisch
schwertfisch

Reputation: 4579

        private Paint paintBezBase;

            //control variables
                int xControl1 = 0;
                int yControl1 = 0;

                int xControl2 = 0;
                int yControl2 = 0;

                //
                int x1 = 0;
                int y1 = 0;
                int x2 = 0;
                int y2 = 0;
                Path pathProgress = new Path();




        private void init(AttributeSet attrs, int defStyle) {
                 paintBezBase = new Paint() {
                            {
                                setStyle(Style.STROKE);
                                setStrokeCap(Cap.SQUARE);
                                setStrokeWidth(1);
                                setAntiAlias(true);
                            }
                        };

                 paintBezBase.setColor(Color.BLACK);
                 paintBezBase.setStrokeWidth(1);
        }

     @Override
        protected void onDraw(Canvas canvas) {
            super.onDraw(canvas);

        int paddingLeft = getPaddingLeft();
        int paddingTop = getPaddingTop();
        int paddingRight = getPaddingRight();
        int paddingBottom = getPaddingBottom();

        contentWidth = getWidth() - paddingLeft - paddingRight;
        contentHeight = getHeight() - paddingTop - paddingBottom;

        x1 = 0;
        y1 = contentHeight / 2;
        x2 = contentWidth;
        y2 = contentHeight / 2;

        yControl1 = 0 - 40;
        yControl2 = contentHeight + 40;

        pathProgress.moveTo(x1, y1);
        pathProgress.cubicTo(xControl1, yControl1, xControl2, yControl2, x2, y2);
                 canvas.drawPath(pathProgress, paintBezBase);



    }

Adjust Curve with yControl1 & yControl2.

Upvotes: 1

Related Questions