How to add action listeners to individual elements in a Tile Pane

Question

Is it possible to add action listeners to the indiviadual elements in a Tile or Flow Pane?

For example, in the example below, if a user clicked on an image, the the system would print out the location/ file path.

Thank You All.

public class FlowTileExample extends Application {

    @Override
    public void start(Stage primaryStage) {
        VBox root = new VBox(30);

        //loading images
        Image[] im = new Image[8];
        im[0] = new Image(getClass().getResourceAsStream("facebook.png"));
        im[1] = new Image(getClass().getResourceAsStream("faviicon.png"));
        im[2] = new Image(getClass().getResourceAsStream("jquery-logo.png"));
        im[3] = new Image(getClass().getResourceAsStream("linkedin_32.png"));
        im[4] = new Image(getClass().getResourceAsStream("loading1.png"));
        im[5] = new Image(getClass().getResourceAsStream("twitter.png"));
        im[6] = new Image(getClass().getResourceAsStream("twitter_32.png"));
        im[7] = new Image(getClass().getResourceAsStream("wp.png"));

        VBox up = new VBox(20);
        Text text4flow = new Text("Images in FlowPane");
        text4flow.setFont(Font.font("Calibri", FontWeight.BOLD, 30));
        text4flow.setUnderline(true);
        VBox.setMargin(text4flow, new Insets(10, 0, 0, 10));
        //creating Flow Pane
        FlowPane flowpane = new FlowPane();
        flowpane.setHgap(5);
        flowpane.setVgap(5);
        for (int i = 0; i < 8; i++) {
            flowpane.getChildren().add(new ImageView(im[i]));
        }

        up.getChildren().addAll(text4flow, flowpane);

        VBox down = new VBox(20);
        Text text4tile = new Text("Images in TilePane");
        text4tile.setFont(Font.font("Calibri", FontWeight.BOLD, 30));
        text4tile.setUnderline(true);
        VBox.setMargin(text4tile, new Insets(10, 0, 0, 10));

        //creating Tile Pane
        TilePane tilepane = new TilePane();
        tilepane.setHgap(5);
        flowpane.setVgap(5);
        for (int i = 0; i < 8; i++) {
            tilepane.getChildren().add(new ImageView(im[i]));
        }
        down.getChildren().addAll(text4tile, tilepane);
        root.getChildren().addAll(up, down);
        primaryStage.setTitle("Flow And Tile Panes Example");
        Scene scene = new Scene(root, 500, 600);
        primaryStage.setScene(scene);
        primaryStage.show();
    }

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

Answer 1

You need to add some kind of handler to the ImageView instance, for example...

ImageView imageView = new ImageView(im[i]);
imageView.setOnMouseClicked(new EventHandler<MouseEvent>() {
    @Override
    public void handle(MouseEvent t) {
        System.out.println("Oh dear lord, they clicked me!?");
    }
});

Or you could create a generic handler...

EventHandler mouseHandler = new EventHandler<MouseEvent>() {
    @Override
    public void handle(MouseEvent t) {
        ImageView imageView = (ImageView) t.getSource();
        System.out.println("You clicked " + imageView.getImage());
    }
};

for (int i = 0; i < 8; i++) {
    ImageView imageView = new ImageView(im[i]);
    imageView.setOnMouseClicked(mouseHandler);
    flowpane.getChildren().add(imageView);
}

For example...

You should take a closer look at Handling JavaFX Events for more details