Cfrgtkky

i need to draw rectangle rounded corner with progressbar in javafx.

i already did some code which draw rectangle with corner.
but how do i show progress effect.
Following are the example which I am trying to imitate.
http://jsfiddle.net/m1erickson/P2qTq/

there is any other way to do this. guide me thank you.

void drawLine(double x1,double  y1,double x2,double y2) {

    MoveTo move= new MoveTo(x1, y1);

    path.getElements().add(move);

    LineTo line= new LineTo(x2,y2);

    path.getElements().add(line);

    path.setStroke(Paint.valueOf("#000000"));

}



void drawCorner(double x0,double y0,double x1,double y1) {

    QuadCurveTo quadCurveTo=new QuadCurveTo();

    quadCurveTo.setX(x0);

    quadCurveTo.setY(y0);

    quadCurveTo.setControlX(x1);

    quadCurveTo.setControlY(y1);

    path.getElements().add(quadCurveTo);

}



    Group group=new Group();

    double angleTRX=offsetX+horizontalLength+cornerRadius;

    double angleTRY=offsetY+cornerRadius;

    double TRCornerX=offsetX+horizontalLength+cornerRadius;

    double TRCornerY=offsetY;

    double bottomRY=angleTRY+verticalLength;



    //draw top line

    drawLine(offsetX, offsetY, offsetX + horizontalLength, offsetY);

    //draw top right corner

    drawCorner(angleTRX, offsetY+cornerRadius, TRCornerX, offsetY);

    //draw right line

    drawLine(angleTRX,angleTRY, angleTRX,bottomRY);

    //draw bottom right corner

    drawCorner(offsetX+horizontalLength,offsetY+verticalLength+cornerRadius*2,

            offsetX+horizontalLength+cornerRadius,offsetY+verticalLength+cornerRadius*2);

    //draw bottom line

    drawLine(offsetX+horizontalLength,offsetY+verticalLength+cornerRadius*2,

            offsetX,offsetY+verticalLength+cornerRadius*2);

    //draw left bottom corner

    drawCorner(offsetX-cornerRadius,offsetY+verticalLength+cornerRadius,

            offsetX-cornerRadius,offsetY+verticalLength+cornerRadius*2);

    //draw left line

    drawLine(offsetX-cornerRadius,offsetY+verticalLength+cornerRadius,

            offsetX-cornerRadius,offsetY+cornerRadius);

    //draw top left corner

    drawCorner(offsetX,offsetY,offsetX-cornerRadius,offsetY);

    group.getChildren().add(path);

--> Update <--

i found another way to do it. using Rectangle with stroke-offset.
but still facing one issue stroke are starting from clockwise.

Rectangle rectangle= new Rectangle();

        rectangle.setX(offsetX);

        rectangle.setY(offsetY);

        rectangle.setArcHeight(cornerRadius);

        rectangle.setArcWidth(cornerRadius);

        rectangle.setWidth(200);

        rectangle.setHeight(200);

        rectangle.setStroke(Paint.valueOf("#000000"));

        rectangle.setFill(Paint.valueOf("#ffffff"));

        rectangle.setStrokeWidth(5);

        rectangle.setStrokeMiterLimit(5);

        rectangle.setSmooth(true);

        rectangle.setStrokeLineCap(StrokeLineCap.ROUND);

        rectangle.setStrokeLineJoin(StrokeLineJoin.ROUND);

        double length=rectangle.getWidth()*2+rectangle.getHeight()*2;

        //set stroke dash length

        rectangle.getStrokeDashArray().addAll(length);

        //display empty stroke/border

        rectangle.setStrokeDashOffset(length);

        group.getChildren().add(rectangle);

        container.add(group,0,0);



        slider.valueProperty().addListener((observable, oldValue, newValue) -> {

            rectangle.setStrokeDashOffset(length-(length*(newValue.doubleValue()/100)));

        });

if you know better solution then please let me know.

i solved it using Rectangle and stroke-dash-offset. this might help others and save its valuable time.

    Rectangle rectangle= new Rectangle();

    rectangle.setX(offsetX);

    rectangle.setY(offsetY);

    rectangle.setWidth(200);

    rectangle.setHeight(200);

    rectangle.setStroke(Paint.valueOf("#000000"));

    rectangle.setFill(Color.TRANSPARENT);

    rectangle.setStrokeWidth(5);

    rectangle.setStrokeMiterLimit(5);

    rectangle.setSmooth(true);

    rectangle.setStrokeLineCap(StrokeLineCap.ROUND);

   // rectangle.setStrokeLineJoin(StrokeLineJoin.ROUND);

    double length=rectangle.getWidth()*2+rectangle.getHeight()*2;



    //set stroke dash length

    rectangle.getStrokeDashArray().addAll(length);



   //display empty stroke/border

    rectangle.setStrokeDashOffset(length);



    group.getChildren().add(rectangle);

    container.add(group,0,0);



    slider.valueProperty().addListener((observable, oldValue, newValue) -> {

            double offset=length-((length*(newValue.doubleValue()/100)));

            rectangle.setStrokeDashOffset(-offset);

    });