带有图像 JavaFX 的 ListView

Question

ListView 中是否有可能在文本旁边放置图像？图像具有相同的名称，例如“oddelenyObsah[]”。这应该像库存一样工作，在列表视图中是您库存中的项目，我需要它旁边的项目图片。

private HerniPlan plan;
private Batoh batoh;
ListView<String> list;
ObservableList<String> data;

private final Image boty  = new Image("../zdroje/boty.png");
private final Image odpadky  = new Image("https://upload.wikimedia.org/wikipedia/commons/f/f1/Ruby_logo_64x64.png");
private final Image varecka  = new Image("https://upload.wikimedia.org/wikipedia/commons/f/f1/Ruby_logo_64x64.png");
private final Image panev  = new Image("https://upload.wikimedia.org/wikipedia/commons/f/f1/Ruby_logo_64x64.png");
private final Image desky  = new Image("https://upload.wikimedia.org/wikipedia/commons/f/f1/Ruby_logo_64x64.png");
private final Image nuzky  = new Image("https://upload.wikimedia.org/wikipedia/commons/f/f1/Ruby_logo_64x64.png");
private final Image pacidlo  = new Image("https://upload.wikimedia.org/wikipedia/commons/f/f1/Ruby_logo_64x64.png");
private final Image rezavy_klic  = new Image("https://upload.wikimedia.org/wikipedia/commons/f/f1/Ruby_logo_64x64.png");
private final Image klic_od_domu  = new Image("https://upload.wikimedia.org/wikipedia/commons/f/f1/Ruby_logo_64x64.png");

private Image[] listOfImages = {boty, odpadky, varecka, panev, desky, nuzky, pacidlo, rezavy_klic, klic_od_domu};

public PanelBatohu(Batoh batoh) {
    this.batoh = batoh;
    batoh.zaregistrujPozorovateleBatohu(this);
    init();
}

private void init() {
    list = new ListView<>();
    data = FXCollections.observableArrayList();
    list.setItems(data);
    list.setPrefWidth(200);
    aktualizujBatoh();
}

public ListView<String> getList() {
    return list;
}

@Override
public void aktualizujBatoh() {
    String veci = batoh.seznamVBatohu();
    data.clear();
    String[] oddelenyObsah = veci.split(" ");
    for (int i = 1; i < oddelenyObsah.length; i++) {          
        if(veci.equals(boty)){

        }
        data.add(oddelenyObsah[i]);           
    }
}

 /**
 * Metoda zaregistruje pozorovatele k hernímu plánu při spuštění nové hry.
 *
 * @param batoh
 */
public void nastaveniHernihoPlanu(Batoh batoh) {
    this.batoh = batoh;
    batoh.zaregistrujPozorovateleBatohu(this);
    this.aktualizujBatoh();
}

}

Answer 1

这可以使用单元工厂（自定义渲染）来完成。这是代码sn-p。

列表项

class Item {
    final String text;
    final ImageView image;

    public Item(final String text, final String imageURL) {
        this.text = text;
        this.image = new ImageView(imageURL);
    }
}

列表视图

final ListView<Item> list = new ListView<>(FXCollections.observableArrayList(
        new Item("Straight", "https://d30y9cdsu7xlg0.cloudfront.net/png/17383-200.png"),
        new Item("Turned", "https://d30y9cdsu7xlg0.cloudfront.net/png/18030-200.png"),
        new Item("Inversed", "https://d30y9cdsu7xlg0.cloudfront.net/png/19850-200.png")
));

// Custom cell factory
list.setCellFactory(l -> new ListCell<Item>() {
    @Override
    public void updateItem(final Item item, final boolean empty) {
        if (empty) {
            setText("");
            setGraphic(null);
        } else {
            setText(item.text);
            setGraphic(item.image);
        }
    }
});