在javafx中为imageview设置效果

时间:2015-03-13 06:16:51

标签: javafx fxml

我创建了一个框架,里面有一些图片,我想添加一个效果,当鼠标进入图片区域时,它变得有点暗或亮,就像当鼠标进入按钮区域时,这里是从fxml生成的代码文件:

public class FrameController implements Initializable {
@FXML
private GridPane album;
ImageView im;

/**
 * Initializes the controller class.
 */
@Override
public void initialize(URL url, ResourceBundle rb) {
    // TODO
}    

@FXML
private void mouseEntered(MouseEvent event) {
    System.out.println(event.getSource());
    im = (ImageView) event.getSource();
    Glow selectGlow = new Glow(1.7f);
    im.setOnMouseEntered(new EventHandler<MouseEvent>() {

    @Override
    public void handle(MouseEvent event) {
    im.setEffect(selectGlow);
    }
    });
}

}

但我有两个问题:

1)它非常慢,有时似乎当我在图片上时没有调用鼠标处理程序,因为效果不会改变

2)我不知道当鼠标进入图片区域时,为了使图像更暗,我应该使用哪种效果

1 个答案:

答案 0 :(得分:1)

表现取决于效果。如果你真的只想改变亮度,你可以。 G。像这样使用ColorAdjust

public class ImageTest extends Application {

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

    @Override
    public void start(Stage primaryStage) {

        primaryStage.setTitle("Hello World!");

        Group root = new Group();

        Image image = new Image("http://upload.wikimedia.org/wikipedia/commons/thumb/4/41/Siberischer_tiger_de_edit02.jpg/320px-Siberischer_tiger_de_edit02.jpg");


        GridPane gridPane = new GridPane();

        gridPane.add(createImageView( image), 0,0);
        gridPane.add(createImageView( image), 1,0);
        gridPane.add(createImageView( image), 0,1);
        gridPane.add(createImageView( image), 1,1);


        root.getChildren().add( gridPane);

        primaryStage.setScene(new Scene(root, 800, 600));
        primaryStage.show();
    }

    private ImageView createImageView( Image image) {

        ImageView imageView = new ImageView(image);

        ColorAdjust colorAdjust = new ColorAdjust();
        colorAdjust.setBrightness(-0.5);

        imageView.addEventFilter(MouseEvent.MOUSE_ENTERED, e -> {

            imageView.setEffect(colorAdjust);

        });
        imageView.addEventFilter(MouseEvent.MOUSE_EXITED, e -> {
            imageView.setEffect(null);
        });

        return imageView;
    }
}

enter image description here