交换 ArrayList 中的元素

Question

我正在尝试制作一种有点像滑块拼图的游戏，您可以点击一张图片，然后点击另一张图片，它们会交换位置。出于某种原因，这在您第一次执行时工作正常，但是当您第二次交换图像时，每次之后它都会选择与您单击的元素不同的元素。如有任何帮助，将不胜感激。

public class test extends Application {
int click1 = -1, click2 = -1;

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

@Override
public void start(Stage primaryStage) throws Exception {
    //Create a GridPane
    GridPane pane = new GridPane();
    pane.setAlignment(Pos.CENTER);
    pane.setHgap(5);
    pane.setVgap(5);

    //create ArrayList and add imageList to ArrayList
    ArrayList<ImageView>imageList = new ArrayList<ImageView>();
    for (int i = 0; i < 9; i++) {
        imageList.add(new ImageView ((i) +".jpg"));
    }       

    addImages(imageList, pane);

    //add onClick listeners to each image
    imageList.get(0).setOnMouseClicked(e->{
        swap(0, imageList, pane);
    });
    imageList.get(1).setOnMouseClicked(e->{
        swap(1, imageList, pane);
    });
    imageList.get(2).setOnMouseClicked(e->{
        swap(2, imageList, pane);
    });
    imageList.get(3).setOnMouseClicked(e->{
        swap(3, imageList, pane);
    });
    imageList.get(4).setOnMouseClicked(e->{
        swap(4, imageList, pane);
    });
    imageList.get(5).setOnMouseClicked(e->{
        swap(5, imageList, pane);
    });
    imageList.get(6).setOnMouseClicked(e->{
        swap(6, imageList, pane);
    });
    imageList.get(7).setOnMouseClicked(e->{
        swap(7, imageList, pane);
    });
    imageList.get(8).setOnMouseClicked(e->{
        swap(8, imageList, pane);
    });

    //display the scene
    Scene scene = new Scene(pane, 650, 650);
    primaryStage.setScene(scene);
    primaryStage.setTitle("Test");
    primaryStage.show();
}

private void swap(int lastClick, ArrayList<ImageView> imageList, GridPane pane) {
    if (click1 == -1) {
        click1 = lastClick;
        System.out.println(imageList.get(click1).getImage().impl_getUrl()+ " ");

        imageList.get(click1).setScaleX(1.02);
        imageList.get(click1).setScaleY(1.02);
    } else {
        click2 = lastClick;
        System.out.println(imageList.get(click2).getImage().impl_getUrl()+ " ");

        //swap indexes in ArrayList
        Collections.swap(imageList, click2, click1);
        pane.getChildren().removeAll(imageList);
        addImages(imageList, pane);

        //reset everything for next swap
        imageList.get(click1).setScaleX(1.0);
        imageList.get(click1).setScaleY(1.0);
        imageList.get(click2).setScaleX(1.0);
        imageList.get(click2).setScaleY(1.0);           
        click1 = -1;
        click2 = -1;
    }
}

private void addImages(ArrayList<ImageView> imageList, GridPane pane) {
    //add imageList to the GridPane
    int i = 0;
    while (i < 9) {
        for (int j = 0; j <= 2; j++) {
            for (int k = 0; k <= 2; k++) {
                pane.add(imageList.get(i), k, j);
                i++;
            }
        }
    }   
}

}

Answer 1

更新新元素后，您需要更新鼠标点击侦听器。最终发生的是陈旧的状态。已移动的项目报告其初始位置而不是实际位置，导致您的项目移动到它们不应该的位置。

基本状态。

0, 1, 2, 3, 4, 5, 6, 7, 8

假设我们点击 3，然后点击 5。请求是将图像 5 交换到图像 3 的插槽，并将图像 3 交换到图像 5 的插槽。

0, 1, 2, 5, 4, 3, 6, 7, 8

目前看起来不错，但让我们尝试另一个交换。让我们将图像 1 与 5 交换。

0, 3, 2, 5, 4, 1, 6, 7, 8

发生什么事了？！单击了 1 和 5，但 3 和 1 交换了位置！

后端的移动实际上完全按照设计工作。单击图像 5 和图像 1，导致操作“将 slot 5 与 slot 1 交换，而不是预期的 slot 3 与 插槽 1。问题是插槽 5 中的图像实际上是图像 3。

对此的纠正是更新鼠标点击侦听器以了解他们之后的位置，以便他们可以报告他们新的、更新的位置。

修正为：

imageList.get(click1).setOnMouseClicked(e->{
    swap(click1, imageList, pane);
});
imageList.get(click2).setOnMouseClicked(e->{
    swap(click2, imageList, pane);
});

这告诉交换的项目 "This is where you are moved, and from now on you should report that this is your new moved position."

交换 ArrayList 中的元素

Swapping elements in an ArrayList

java

swap

javafx

arraylist