JavaFX中如何关闭ImageView抗锯齿 实现像素画清晰放大

核心原因 #

仅给ImageView设置setSmooth(false)不足以关闭全部抗锯齿逻辑：JavaFX加载Image资源时默认开启了平滑插值，场景级的抗锯齿配置也会对像素画放大效果产生影响，所以才会出现设置不生效的情况。

解决步骤 #

要实现像素边界清晰的显示效果，需要同时修改3处配置：

1. 加载Image资源时，使用全参数构造函数，将插值平滑参数设为false
2. 保留ImageView的setSmooth(false)配置
3. 构造Scene时关闭场景级抗锯齿

修改后完整代码 #

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.SceneAntialiasing;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.AnchorPane;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;

public class Main extends Application {
    @Override public void start(Stage primaryStage) {
        AnchorPane root = new AnchorPane();
        StackPane hb = new StackPane();
        // 关键1：加载Image时关闭平滑插值，使用最近邻采样保留像素颗粒
        Image image = new Image("pixelart.png", 0, 0, true, false);
        ImageView img = new ImageView(image);
        img.setFitWidth(500);
        img.setFitHeight(500);
        // 关键2：ImageView层面关闭平滑渲染
        img.setSmooth(false);
        hb.getChildren().add(img);
        root.getChildren().addAll(hb);
        // 关键3：构造Scene时关闭场景级抗锯齿
        Scene scene = new Scene(root,800,400, false, SceneAntialiasing.DISABLED);
        primaryStage.setScene(scene);
        primaryStage.show();    
    }
    public static void main(String[] args) {launch(args);}
}

上述Image构造函数的参数说明：

• 第1个参数：像素画资源路径
• 第2、3个参数：请求渲染宽高，设为0代表默认使用原图尺寸
• 第4个参数：是否保持原图宽高比
• 第5个参数：是否使用平滑插值，设为false时会用最近邻采样算法，完全保留像素边界

效果参考 #

• JavaFX原实现效果（模糊带抗锯齿）：
  
• 预期像素清晰效果：
  
  //Piskel中生成的预览效果
• 测试用像素画原图：
  

内容的提问来源于stack exchange，提问作者tommY