Javafx using translateetransition and keyevent to move image around screen

I'm trying to create a simple tile based move system so that when a direction is clicked, a transition is made to smoothly move the character one tile. The problem I am having is that when I play the animation the image makes the transition fine, but after the transition is complete, the image jumps to a point further than intended. If I take out the onFinished part of the code, the animation plays fine, but pressing the keys afterwards causes the image to move from its previous location rather than its current location.

Here is the code

import javafx.animation.TranslateTransition;
import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.paint.Color;
import javafx.stage.Stage;
import javafx.util.Duration;


public class ControlTranslateImage extends Application
{   
    final int STEP_SIZE = 64;
    final Duration DURATION = Duration.millis(500);
    Group player;

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

    @Override
    public void start(Stage stage)
    {
        final ImageView image0 = new ImageView(new Image("http://opengameart.org/sites/default/files/styles/medium/public/slime_idle.gif"));


        player = new Group(image0);
        player.getChildren().setAll(image0);

        final Scene scene = new Scene(player, 900, 600, Color.WHITE);

        moveOnKeyPressed(scene, player);

        stage.setScene(scene);
        stage.show();
    }

    private void moveOnKeyPressed(Scene scene, Group player)
    {

        final TranslateTransition transition = new TranslateTransition(DURATION, player);

        scene.setOnKeyPressed(e -> {
            switch(e.getCode())
            {

                case UP:
                {

                    transition.setFromX(player.getLayoutX());
                    transition.setFromY(player.getLayoutY());
                    transition.setToX(player.getLayoutX());
                    transition.setToY(player.getLayoutY() - STEP_SIZE);
                    transition.playFromStart();
                    transition.setOnFinished(t -> {
                        player.setLayoutX(player.getLayoutX());
                        player.setLayoutY(player.getLayoutY() - STEP_SIZE);
                    });

                } break;
                case DOWN:
                {

                    transition.setFromX(player.getLayoutX());
                    transition.setFromY(player.getLayoutY());
                    transition.setToX(player.getLayoutX());
                    transition.setToY(player.getLayoutY() + STEP_SIZE);
                    transition.playFromStart();

                    transition.setOnFinished(t -> {
                        player.setLayoutX(player.getLayoutX());
                        player.setLayoutY(player.getLayoutY() + STEP_SIZE);
                    });

                } break;
                case LEFT:
                {

                    transition.setFromX(player.getLayoutX());
                    transition.setFromY(player.getLayoutY());
                    transition.setToX(player.getLayoutX() - STEP_SIZE);
                    transition.setToY(player.getLayoutY());
                    transition.playFromStart();

                    transition.setOnFinished(t -> {
                        player.setLayoutX(player.getLayoutX() - STEP_SIZE);
                        player.setLayoutY(player.getLayoutY());
                    });
                    player.setLayoutX(player.getLayoutX() - STEP_SIZE);
                    player.setLayoutY(player.getLayoutY());


                } break;
                case RIGHT:
                {

                    transition.setFromX(player.getLayoutX());
                    transition.setFromY(player.getLayoutY());
                    transition.setToX(player.getLayoutX() + STEP_SIZE);
                    transition.setToY(player.getLayoutY());
                    transition.playFromStart();

                    transition.setOnFinished(t -> {
                        player.setLayoutX(player.getLayoutX() + STEP_SIZE);
                        player.setLayoutY(player.getLayoutY());
                    });
                } break;

                default:break;

            }
        });
    }
}

      

+3


source to share


1 answer


Fixed code



import javafx.animation.TranslateTransition;
import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.paint.Color;
import javafx.stage.Stage;
import javafx.util.Duration;


public class ControlTranslateImage extends Application
{   
    final int STEP_SIZE = 64;
    final Duration DURATION = Duration.millis(500);
    Group player;

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

    @Override
    public void start(Stage stage)
    {
        final ImageView image0 = new ImageView(new Image("http://opengameart.org/sites/default/files/styles/medium/public/slime_idle.gif"));

        player = new Group(image0);

        final Scene scene = new Scene(player, 900, 600, Color.WHITE);

        moveOnKeyPressed(scene, player);

        stage.setScene(scene);
        stage.show();
    }

    private void moveOnKeyPressed(Scene scene, Group player)
    {

        final TranslateTransition transition = new TranslateTransition(DURATION, player);
        scene.setOnKeyPressed(e -> {
            switch(e.getCode())
            {

                case UP:
                {

                    transition.setFromX(player.getTranslateX());
                    transition.setFromY(player.getTranslateY());
                    transition.setToX(player.getTranslateX());
                    transition.setToY(player.getTranslateY() - STEP_SIZE);
                    transition.playFromStart();

                } break;
                case DOWN:
                {

                    transition.setFromX(player.getTranslateX());
                    transition.setFromY(player.getTranslateY());
                    transition.setToX(player.getTranslateX());
                    transition.setToY(player.getTranslateY() + STEP_SIZE);
                    transition.playFromStart();

                } break;
                case LEFT:
                {

                    transition.setFromX(player.getTranslateX());
                    transition.setFromY(player.getTranslateY());
                    transition.setToX(player.getTranslateX() - STEP_SIZE);
                    transition.setToY(player.getTranslateY());
                    transition.playFromStart();

                } break;
                case RIGHT:
                {

                    transition.setFromX(player.getTranslateX());
                    transition.setFromY(player.getTranslateY());
                    transition.setToX(player.getTranslateX() + STEP_SIZE);
                    transition.setToY(player.getTranslateY());
                    transition.playFromStart();

                } break;

                default:break;

            }
        });
    }
}

      

0


source







All Articles