将ImageViews设置为按钮背景失败

Question

语境：我正在创建一个益智游戏作为项目的一部分，我已经完成了逻辑，只是想给我的按钮设置背景。我正在创建一个益智游戏作为项目的一部分，我已经完成了逻辑，只是想给我的按钮设置背景。

我在这里找到了创建BackgroundImages的代码，当它设置背景时，每个按钮都会接收ImageView List中的第一个元素。

下面是显示每个按钮接收ImageView List中元素0的结果，下面我显示了所有4个元素，只是为了检查我是否正确填充了ImageView List。

List<Button> pieces = new ArrayList<>();
List<ImageView> images = new ArrayList<>();
VBox layout = new VBox();
HBox original = new HBox();
Image image = new Image("jalter.png");  
HBox imagesList = new HBox();   



for(int i = 0; i < 4; i++) { 
  pieces.add(new Button(String.valueOf(i+1)));
  pieces.get(i).setPrefSize(150,150);  

  images.add(new ImageView(image));  
  images.get(i).setViewport(new Rectangle2D(
  getX(toGridXY(i)) * 150,
  getY(toGridXY(i)) * 150,
  150,
  150));    

  BackgroundImage backgroundImage = new                     
  BackgroundImage
  (images.get(i).getImage(), 
  BackgroundRepeat.NO_REPEAT, 
  BackgroundRepeat.NO_REPEAT, 
  BackgroundPosition.DEFAULT, 
  BackgroundSize.DEFAULT);  
  Background background = new 
  Background(backgroundImage);      
  pieces.get(i).setBackground(background);      
}

Answer 1

你要把每个按钮的背景设置成一个完全相同的图片的背景。ImageView.getImage() 只是要返回你传递的原始图像，它不会将该图像裁剪到图像视图的视口。

相反，你可以创建一个新的 Image 使用 pixelReader 的原始图像，并在其构造函数中提供一个裁剪区域。WritableImage:

for(int i = 0; i < 4; i++) { 
  Button button = new Button(String.valueOf(i+1));
  pieces.add(button);
  button.setPrefSize(150,150);  

  Image croppedImage = new WritableImage(image.getPixelReader(),
    getX(toGridXY(i)) * 150,
    getY(toGridXY(i)) * 150,
    150,
    150);

  BackgroundImage backgroundImage = new BackgroundImage(
    croppedImage,
    BackgroundRepeat.NO_REPEAT, 
    BackgroundRepeat.NO_REPEAT, 
    BackgroundPosition.DEFAULT, 
    BackgroundSize.DEFAULT);  
  Background background = new Background(backgroundImage);      
  button.setBackground(background);      
}