Placing an image into a JavaFX 2 table

Question

I'm trying to do something pretty simple. I want to place an icon in a column for a particular row in a table. If it's a folder, display a folder icon. If it's a file, display a file icon.

Does anyone know how to do this in JavaFX 2?

I've tried so many things and this seems like it should be pretty simple or at least an example somewhere.

Answer 1

Okay so I had a huge dummy moment. Turns out that I had my image url path wrong.

I did find a site that provides a great example for adding elements for table. This helped me understand everything.

Now if the 4 different ways I tried before would've worked, I don't know because my image url path was wrong. But anyway here is the link and a code snippet.

Bottom line was that you need to have the CellValueFactory and the CellFactory. I was attempting to use either or. The updateItem template method in TableCell relies on the value dervied from CellValueFactory.

http://blog.ngopal.com.np/2011/10/01/tableview-cell-modifiy-in-javafx/

       TableColumn albumArt = new TableColumn("Album Art");
    albumArt.setCellValueFactory(new PropertyValueFactory("album"));
    albumArt.setPrefWidth(200); 


    // SETTING THE CELL FACTORY FOR THE ALBUM ART                 
albumArt.setCellFactory(new Callback<TableColumn<Music,Album>,TableCell<Music,Album>>(){        
    @Override
    public TableCell<Music, Album> call(TableColumn<Music, Album> param) {                
        TableCell<Music, Album> cell = new TableCell<Music, Album>(){
            @Override
            public void updateItem(Album item, boolean empty) {                        
                if(item!=null){                            
                    HBox box= new HBox();
                    box.setSpacing(10) ;
                    VBox vbox = new VBox();
                    vbox.getChildren().add(new Label(item.getArtist()));
                    vbox.getChildren().add(new Label(item.getAlbum())); 

                    ImageView imageview = new ImageView();
                    imageview.setFitHeight(50);
                    imageview.setFitWidth(50);
                    imageview.setImage(new Image(MusicTable.class.getResource("img").toString()+"/"+item.getFilename())); 

                    box.getChildren().addAll(imageview,vbox); 
                    //SETTING ALL THE GRAPHICS COMPONENT FOR CELL
                    setGraphic(box);
                }
            }
        };
        System.out.println(cell.getIndex());               
        return cell;
    }

});

Answer 2

In case the provided answers did not work for you (like it didn't for me), this was the solution I found (Of course you still needs to create the tableView and add the columns to it):

//Create your column that will hold the image    
private final TreeTableColumn<YourObjectClass,ImageView> columnImage= new TreeTableColumn<YourObjectClass,ImageView>("Image");

public void start() {
    //Set your cellValueFactory to a SimpleObjectProperty
    //Provided that your class has a method "getImage()" this will work beautifully!            
    columnImage.setCellValueFactory(c-> new SimpleObjectProperty<ImageView>(new ImageView(c.getValue().getValue().getImage())));
}