6
votes

Piste de cercle Javafx 2 pour animation

Comment puis-je créer un cercle (ou ellipse) javafx.scene.shape.path em> dans javafx 2?

J'ai trouvé quelques exemples à l'aide de CubicCurveto: P>

Path path = new Path();
path.getElements().add(new CubicCurveTo(30, 10, 380, 120, 200, 120));

javafx-2

0 commentaires

3 Réponses :

10
votes

Vous pouvez utiliser l'élément de chemin arcto pour dessiner le cercle ou le chemin ellipse: xxx

bonne référence des fonctionnalités d'Arcto est Arcto (Javafx 8) . Bien que ce soit la version 8, les significations des caractéristiques sont similaires.
Sortie:
Entrez la description de l'image ici

4 commentaires

Réponse parfaite! Merci.

C'est une très belle démo uluk :-)

Vraiment bon exemple ... dans votre animation, il y a un léger délai après chaque cycle. Y a-t-il un moyen de supprimer ce délai et de faire en sorte que les rotations circulaires continuent?

@ Vicky96 Ceci fonctionne Stackoverflow.com/questions/37456697/...

0
votes

J'ai résolu le même problème par animation de rotateProperty du conteneur. Juste deux lignes pour créer une animation.

    animationTimeLine = new Timeline(60, new KeyFrame(Duration.seconds(5), new KeyValue(circlePane.rotateProperty(), 360.0)));

    animationTimeLine.setCycleCount(INDEFINITE);

0 commentaires

3
votes

Ceci est une version mise à jour de la réponse de @uluk BIY.

import javafx.animation.PathTransition;
import javafx.animation.PathTransition.OrientationType;
import javafx.animation.Timeline;
import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.paint.Color;
import javafx.scene.shape.ArcTo;
import javafx.scene.shape.ClosePath;
import javafx.scene.shape.MoveTo;
import javafx.scene.shape.Path;
import javafx.scene.shape.Rectangle;
import javafx.stage.Stage;
import javafx.util.Duration;

public class PathTDemo extends Application
{

    private PathTransition pathTransitionEllipse;
    private PathTransition pathTransitionCircle;

    private void init(Stage primaryStage)
    {
        Group root = new Group();
        primaryStage.setResizable(false);
        primaryStage.setScene(new Scene(root, 600, 460));

        // Ellipse path example
        Rectangle rect = new Rectangle(0, 0, 40, 40);
        rect.setArcHeight(10);
        rect.setArcWidth(10);
        rect.setFill(Color.ORANGE);
        root.getChildren().add(rect);

        Path path = createEllipsePath(200, 200, 50, 100, 45);
        root.getChildren().add(path);

        pathTransitionEllipse = new PathTransition();
        pathTransitionEllipse.setDuration(Duration.seconds(4));
        pathTransitionEllipse.setPath(path);
        pathTransitionEllipse.setNode(rect);
        pathTransitionEllipse.setOrientation(OrientationType.ORTHOGONAL_TO_TANGENT);
        pathTransitionEllipse.setCycleCount(Timeline.INDEFINITE);
        pathTransitionEllipse.setAutoReverse(false);

        // Cirle path example
        Rectangle rect2 = new Rectangle(0, 0, 20, 20);
        rect2.setArcHeight(10);
        rect2.setArcWidth(10);
        rect2.setFill(Color.GREEN);
        root.getChildren().add(rect2);

        Path path2 = createEllipsePath(400, 200, 150, 150, 0);
        root.getChildren().add(path2);

        pathTransitionCircle = new PathTransition();
        pathTransitionCircle.setDuration(Duration.seconds(2));
        pathTransitionCircle.setPath(path2);
        pathTransitionCircle.setNode(rect2);
        pathTransitionCircle.setOrientation(OrientationType.ORTHOGONAL_TO_TANGENT);
        pathTransitionCircle.setCycleCount(Timeline.INDEFINITE);
        pathTransitionCircle.setAutoReverse(false);
    }

    private Path createEllipsePath(double centerX, double centerY, double radiusX, double radiusY, double rotate)
    {
        ArcTo arcTo = new ArcTo();
        arcTo.setX(centerX - radiusX + 1); // to simulate a full 360 degree celcius circle.
        arcTo.setY(centerY - radiusY);
        arcTo.setSweepFlag(false);
        arcTo.setLargeArcFlag(true);
        arcTo.setRadiusX(radiusX);
        arcTo.setRadiusY(radiusY);
        arcTo.setXAxisRotation(rotate);

        Path path = new Path();
        path.getElements().addAll(
                new MoveTo(centerX - radiusX, centerY - radiusY),
                arcTo,
                new ClosePath()); // close 1 px gap.
        path.setStroke(Color.DODGERBLUE);
        path.getStrokeDashArray().setAll(5d, 5d);
        return path;
    }

    @Override
    public void start(Stage primaryStage) throws Exception
    {
        init(primaryStage);
        primaryStage.show();
        pathTransitionEllipse.play();
        pathTransitionCircle.play();
    }

    public static void main(String[] args)
    {
        launch(args);
    }
}

0 commentaires