图像＆amp; ListView JavaFX中备用行的左侧和右侧文本

Question

    ListView<ChatModel> listView;
ObservableList<ChatModel> items = FXCollections.observableArrayList();

private final Image IMAGE_MEN = new Image("men.png");
private final Image IMAGE_WOMEN = new Image("women.png");

private Image[] listOfImages = {IMAGE_MEN, IMAGE_WOMEN};

listView = new ListView<ChatModel>();
        listView.setPrefHeight(550);
        listView.setItems(items);

        listView.setCellFactory(param -> new ListCell<ChatModel>() {
            private ImageView imageView = new ImageView();

            @Override
            public void updateItem(ChatModel name, boolean empty) {
                super.updateItem(name, empty);
                if (empty) {
                    setText(null);
                    setGraphic(null);
                } else {
                    if (name.getClientName().equals("testing"))
                        imageView.setImage(listOfImages[0]);
                    else if (name.getClientName().equals("testing1"))
                        imageView.setImage(listOfImages[1]);
                    setText(name.getClientMessage());
                    setGraphic(imageView);
                }
            }
        });

我使用上面的代码使用图像和文本在列表视图中添加项目它工作正常，但列表视图中的设计在所有行的左侧。我要求备用行应该有不同的设计。下一行应该有右侧元素。

这是我到目前为止所做的设计

我想要左侧和右侧的替代行。

请有人告诉我如何实现这一目标。

Answer 1

你可以用CSS实现它：

.list-view .list-cell:odd {
    -fx-content-display:left;
}

.list-view .list-cell:even {
   -fx-content-display:right;
}

选择器根据-fx-content-display的伪状态设置ListCell属性：

• odd：文字左侧 - 右图

• even：grahic left - text right