如何在 JavaFX 中单击时移动图像

Question

我是 JavaFX 新手，我想创建 Lloyds 15 游戏 (https://en.wikipedia.org/wiki/15_puzzle)。 我为游戏创建了控制器，但我看不到将它与某些绘图窗格连接的方法。我想在点击时移动元素。

编辑：我需要帮助选择右窗格来绘制元素（他们应该扩展一些东西吗？），那将是可点击的。

控制器： 它创建元素矩阵。它提供了洗牌和移动单个元素的基本方法（这些方法检查，如果零（=空白字段）在这个元素旁边，那么元素可以移动）。最后它有方法检查拼图是否处于最终状态（所有元素都处于最终位置）

import java.util.Random;

public class LloydsFifteen {

  Element[][] actualState;
  int[] zeroPosition;
  int countInARow;
  int numberOfDrags;

  //for Lloyds fifteen, countInARow will be 4
  public LloydsFifteen(int countInARow)
  {
      numberOfDrags = 0;

      this.countInARow = countInARow;
      actualState = new Element[countInARow][countInARow];
      zeroPosition = new int[2];

      zeroPosition[0] = countInARow-1;
      zeroPosition[1] = countInARow-1;

      for(int i = 0; i < countInARow; i++)
      {         
          for(int j = 0; j < countInARow; j++)
          {
              actualState[i][j] = new Element(i*countInARow + j);


          }

      }

      shuffleLloyd(100000);

      for(int i = 0; i < countInARow; i++)
      {         
          for(int j = 0; j < countInARow; j++)
          {
              System.out.println("prvek na pozici [" + i + ", " + j + "] ma id: " + 
                      actualState[i][j].finalPosition + " a aktualni pozici: " + actualState[i][j].actualPosition );


          }

      }

      System.out.println("a pozice nuly je [" + zeroPosition[0] + ", " + zeroPosition[1] + "]" );
      System.out.println("a pocet provedenych tahu je " + numberOfDrags);

  }

  //shuffles the board
  public void shuffleLloyd(int pocetTahu)
  {
      Random r = new Random();

      for(int i = 0; i < pocetTahu; i++)
      {

          switch(r.nextInt(4))
          {
              case 0: if(moveRight()) numberOfDrags++; break;
              case 1: if(moveLeft()) numberOfDrags++; break;
              case 2: if(moveUp()) numberOfDrags++; break;
              case 3: if(moveDown()) numberOfDrags++; break;
              default: break;

          }

          //another way to shuffle the board
          //moveAnElement(r.nextInt(4), r.nextInt(4));


      }



  }

  //checks, if element can be moved
  public void moveAnElement(int x, int y)
  {
      boolean done = false;

      if(zeroPosition[0] == x + 1 && zeroPosition[1] == y)
      {
          done = moveRight();   
      }

      if(zeroPosition[0] == x - 1 && zeroPosition[1] == y)
      {
          done = moveLeft();
      }

      if(zeroPosition[0] == x && zeroPosition[1] == y + 1)
      {
          done = moveDown();
      }

      if(zeroPosition[0] == x && zeroPosition[1] == y - 1)
      {
          done = moveUp();
      }

      if(done)
      {
          //System.out.println("Pohyb se vydaril"); 
          numberOfDrags++;
      }

  }

  public boolean moveRight()
  {
      Element tmp;
      boolean done = false;

      if(zeroPosition[0] > 0)
      {
          tmp = actualState[zeroPosition[0]][zeroPosition[1]];
          actualState[zeroPosition[0]][zeroPosition[1]] = actualState[zeroPosition[0] - 1][zeroPosition[1]];
          actualState[zeroPosition[0] - 1][zeroPosition[1]] = tmp;

          zeroPosition[0] = zeroPosition[0] - 1;
          done = true;
      }

      if(checkEndOfGame())
      {
          System.out.println("Gratuluji k nalezeni reseni");

      }

      return done;

  }


  public boolean moveLeft()
  {
      Element tmp;
      boolean done = false;

      if(zeroPosition[0] < countInARow - 1)
      {
          tmp = actualState[zeroPosition[0]][zeroPosition[1]];
          actualState[zeroPosition[0]][zeroPosition[1]] = actualState[zeroPosition[0] + 1][zeroPosition[1]];
          actualState[zeroPosition[0] + 1][zeroPosition[1]] = tmp;

          zeroPosition[0] = zeroPosition[0] + 1;
          done = true;
      }

      if(checkEndOfGame())
      {
          System.out.println("Gratuluji k nalezeni reseni");

      }

      return done;
  }


  public boolean moveDown()
  {
      Element tmp;
      boolean done = false;

      if(zeroPosition[1] > 0)
      {
          tmp = actualState[zeroPosition[0]][zeroPosition[1]];
          actualState[zeroPosition[0]][zeroPosition[1]] = actualState[zeroPosition[0]][zeroPosition[1] - 1];
          actualState[zeroPosition[0]][zeroPosition[1] - 1] = tmp;

          zeroPosition[1] = zeroPosition[1] - 1;
          done = true;
      }

      if(checkEndOfGame())
      {
          System.out.println("Gratuluji k nalezeni reseni");

      }

      return done;

  }


  public boolean moveUp()
  {
      Element tmp;
      boolean done = false;

      if(zeroPosition[1] < countInARow - 1)
      {
          tmp = actualState[zeroPosition[0]][zeroPosition[1]];
          actualState[zeroPosition[0]][zeroPosition[1]] = actualState[zeroPosition[0]][zeroPosition[1] + 1];
          actualState[zeroPosition[0]][zeroPosition[1] + 1] = tmp;

          zeroPosition[1] = zeroPosition[1] + 1;
          done = true;
      }

      if(checkEndOfGame())
      {
          System.out.println("Gratulations");

      }

      return done;

  }

  //checks if all elements are in final positions
  private Boolean checkEndOfGame()
  {

      for(int i = 0; i < countInARow; i++)
      {         
          for(int j = 0; j < countInARow; j++)
          {
              if(actualState[i][j].finalPosition != (i*countInARow + j))
              {
                  return false;                                     
              }
          }         
      }

      return true;
  }
}

和一个元素

public class Element {

    int finalPosition;
    int actualPosition;

    //position is j*numberInARow + i
    public Element(int finalPosition)
    {
        this.finalPosition = finalPosition;
        this.actualPosition = finalPosition;
    }
}

感谢任何提示，我不知道下一步。 我希望它看起来像这样：Lloyds fifteen puzzle http://www.cse.wustl.edu/~kjg/cs123/Labs/raster/15.gif 元素将成为图像的一部分（用户选择图像，我将其拆分并创建这些元素）

Answer 1

下一步是设置 UI，应用程序基本上是您将首先启动的线程。对于布局，我建议您使用 4x4 的 GridPane 并使用 Element 矩阵对其进行初始化。

查看this example 和GridPane 以获得简单的形式，当然还有JavaDoc。

接下来的步骤是添加事件处理程序，以便可以将元素重新分配到不同的位置（这将调用各种移动方法）。