Запустите анимацию, нажав на элемент в списке - PullRequest
Новая
       29

Запустите анимацию, нажав на элемент в списке

1 голос
/ 18 июня 2019

Как запустить анимацию из списка, а также как сделать так, чтобы пользователь мог воспроизводить более одной анимации одновременно.

Я создал 3 анимации для круга и списка, моя проблема в том, как расположитьпредставление списка, чтобы пользователь мог ясно видеть его и как сделать так, чтобы пользователь мог выбрать один или более чем один одновременно и воспроизводить анимации из представления списка.Вот мой код на данный момент: 

    Circle circle2 = new Circle(250, 120, 80);

    circle2.setFill(Color.RED);
    circle2.setStroke(Color.BLACK);
    FadeTransition fade = new FadeTransition();
    fade.setDuration(Duration.millis(5000));
    fade.setFromValue(10);
    fade.setToValue(0.1);
    fade.setCycleCount(1000);
    fade.setAutoReverse(true);
    fade.setNode(circle2);
    fade.play();

    Circle circle1 = new Circle(250, 120, 80);

    circle1.setFill(Color.RED);
    circle1.setStroke(Color.BLACK);
    TranslateTransition translate = new TranslateTransition();
    translate.setByX(400);
    translate.setDuration(Duration.millis(1000));
    translate.setCycleCount(500);
    translate.setAutoReverse(true);
    translate.setNode(circle1);
    translate.play();

    Circle circle3 = new Circle(250, 120, 80);

    circle3.setFill(Color.RED);
    circle3.setStroke(Color.BLACK);
    ScaleTransition scale = new ScaleTransition();
    scale.setByX(25);
    scale.setDuration(Duration.millis(1000));
    scale.setCycleCount(500);
    scale.setAutoReverse(true);
    scale.setNode(circle3);
    scale.play();

    ListView listView = new ListView();

    listView.getItems().add("Fade Transition");
    listView.getItems().add("Translate Transition");
    listView.getItems().add("Scale Transition");

    HBox hbox = new HBox();
    hbox.setAlignment(Pos.CENTER);
    hbox.getChildren().addAll(circle1, circle2, circle3, listView);

    Scene scene = new Scene(hbox, 500, 600, Color.WHEAT);
    primaryStage.setScene(scene);
    primaryStage.setTitle("Hello World!");
    primaryStage.show();
}

Итак, как расположить представление списка, чтобы пользователь мог видеть его ясно, и как сделать представление списка, чтобы пользователь мог выбрать более одной анимации и воспроизводить их в одной и той жевремя.Спасибо!

1 Ответ

0 голосов
/ 18 июня 2019

Вам необходимо установить SelectionMode на несколько. 

listView.getSelectionModel().setSelectionMode(SelectionMode.MULTIPLE);

Вам нужен слушатель для свойства Item, выбранного для выбранной модели. Если что-то выбрано, воспроизведите его анимацию. Если он не выбран, остановите его анимацию. 

listView.getSelectionModel().selectedItemProperty().addListener((obs, oldValue, newValue) ->{
    ObservableList<String> selectedItems = listView.getSelectionModel().getSelectedItems();
    if(selectedItems.contains("Fade Transition"))
    {
        fade.play();
    }
    else
    {
        fade.jumpTo(Duration.ZERO);
        fade.stop();                
    }

    if(selectedItems.contains("Translate Transition"))
    {
        translate.play();
    }
    else
    {
        translate.jumpTo(Duration.ZERO);
        translate.stop();
    }

    if(selectedItems.contains("Scale Transition"))
    {
        scale.play();
    }
    else
    {
        scale.jumpTo(Duration.ZERO);
        scale.stop();
    }            
});

Вы можете использовать SubScene для хранения узлов, которые будут анимированы. 

hbox.getChildren().addAll(listView, new SubScene(new VBox(circle1, circle2, circle3), 800, 500));

Полный код 

import javafx.animation.FadeTransition;
import javafx.animation.ScaleTransition;
import javafx.animation.TranslateTransition;
import javafx.application.Application;
import javafx.collections.ObservableList;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.SubScene;
import javafx.scene.control.ListView;
import javafx.scene.control.SelectionMode;
import javafx.scene.layout.HBox;
import javafx.scene.layout.VBox;
import javafx.scene.paint.Color;
import javafx.scene.shape.Circle;
import javafx.stage.Stage;
import javafx.util.Duration;

/**
 *
 * @author blj0011
 */
public class JavaFXApplication124 extends Application
{
    @Override
    public void start(Stage primaryStage)
    {        
        Circle circle2 = new Circle(250, 120, 80);
        circle2.setFill(Color.RED);
        circle2.setStroke(Color.BLACK);
        FadeTransition fade = new FadeTransition();
        fade.setDuration(Duration.millis(5000));
        fade.setFromValue(10);
        fade.setToValue(0.1);
        fade.setCycleCount(1000);
        fade.setAutoReverse(true);
        fade.setNode(circle2);

        Circle circle1 = new Circle(250, 120, 80);
        circle1.setFill(Color.RED);
        circle1.setStroke(Color.BLACK);
        TranslateTransition translate = new TranslateTransition();
        translate.setByX(400);
        translate.setDuration(Duration.millis(1000));
        translate.setCycleCount(500);
        translate.setAutoReverse(true);
        translate.setNode(circle1);

        Circle circle3 = new Circle(250, 120, 80);
        circle3.setFill(Color.RED);
        circle3.setStroke(Color.BLACK);
        ScaleTransition scale = new ScaleTransition();
        scale.setByX(25);
        scale.setDuration(Duration.millis(1000));
        scale.setCycleCount(500);
        scale.setAutoReverse(true);
        scale.setNode(circle3);

        ListView listView = new ListView();
        listView.getSelectionModel().setSelectionMode(SelectionMode.MULTIPLE);
        listView.getSelectionModel().selectedItemProperty().addListener((obs, oldValue, newValue) ->{
            ObservableList<String> selectedItems = listView.getSelectionModel().getSelectedItems();
            if(selectedItems.contains("Fade Transition"))
            {
                fade.play();
            }
            else
            {
                fade.jumpTo(Duration.ZERO);
                fade.stop();                
            }

            if(selectedItems.contains("Translate Transition"))
            {
                translate.play();
            }
            else
            {
                translate.jumpTo(Duration.ZERO);
                translate.stop();
            }

            if(selectedItems.contains("Scale Transition"))
            {
                scale.play();
            }
            else
            {
                scale.jumpTo(Duration.ZERO);
                scale.stop();
            }            
        });

        listView.getItems().add("Fade Transition");
        listView.getItems().add("Translate Transition");
        listView.getItems().add("Scale Transition");

        HBox hbox = new HBox();
        hbox.setAlignment(Pos.CENTER);
        hbox.getChildren().addAll(listView, new SubScene(new VBox(circle1, circle2, circle3), 800, 500));

        Scene scene = new Scene(hbox, 1080, 720, Color.WHEAT);
        primaryStage.setScene(scene);
        primaryStage.setTitle("Hello World!");
        primaryStage.show();

    }

    /**
     * @param args the command line arguments
     */
    public static void main(String[] args)
    {
        launch(args);
    }
}
...