我有一个 ListView ,我添加了 BorderPane元素和一些内容。
当我选择一个项目时,它会隐藏。
我该如何解决这个问题?
The white item is the selected item. Is hidden.
我在listView
中没有任何CSS更新:
BorderPane内容
public BorderPane getUserBox()
{
BorderPane borderPane = new BorderPane();
HBox mainPane = new HBox();
mainPane.prefWidthProperty().bind(borderPane.prefWidthProperty());
mainPane.minWidthProperty().bind(borderPane.minWidthProperty());
mainPane.maxWidthProperty().bind(borderPane.maxWidthProperty());
ImageView image = new ImageView(Images.CLOSE_ICON);
Label nick = new Label(" Name");
Label text = new Label(" Text ");
VBox vBox = new VBox();
vBox.getChildren().addAll(nick, text);
Label time = new Label(" 4.06.2016");
mainPane.getChildren().addAll(image, vBox, time);
borderPane.getStyleClass().add("userBox");
borderPane.setCenter(mainPane);
return borderPane;
}
添加borderPane
UserBox userBox = new UserBox();
ObservableList<BorderPane> items =FXCollections.observableArrayList (
userBox.getUserBox(), userBox.getUserBox(), userBox.getUserBox(), userBox.getUserBox());
listUsersBox.setItems(items);
我在borderPane
中只有这个css.userBox {
-fx-background-color: green;
}
答案 0 :(得分:1)
好吧,因此在使用ListView
时,您不应将图形元素直接放入ListView
,而应使用setCellFactory告诉ListView
如何显示元件。
自定义ListView Visuals
可以通过替换完全自定义ListView的视觉效果 默认的单元工厂。单元工厂用于生成ListCell 实例,用于表示ListView中的项目。看到 Cell类文档,以获得更完整的描述 编写自定义单元格。
作为数据源,您应该拥有一个数据模型,用一些真实信息填充图形表示。
在下面的示例中,我创建了一个User
类,它是列表视图中单个元素的模型(listview显示用户)。然后我使用上面提到的方法为每个用户创建一个GUI布局(请注意,您甚至不需要BorderPane
,因为您只填充了中心)。
示例强>
User.java
public class User {
private StringProperty nick = new SimpleStringProperty();
private StringProperty text = new SimpleStringProperty();
private ObjectProperty<Date> time = new SimpleObjectProperty<Date>();
public StringProperty nickProperty(){ return nick;}
public StringProperty textProperty(){ return text;}
public ObjectProperty<Date> timeProperty(){ return time;}
public User(String nick, String text, Date time){
this.nick.set(nick);
this.text.set(text);
this.time.set(time);
}
}
Main.java
public class Main extends Application {
@Override
public void start(Stage primaryStage) {
try {
BorderPane root = new BorderPane();
Scene scene = new Scene(root,400,400);
scene.getStylesheets().add(getClass().getResource("application.css").toExternalForm());
ListView<User> listView = new ListView<User>();
SimpleDateFormat sdf = new SimpleDateFormat("dd/MM/yyyy");
ObservableList<User> users = FXCollections.observableArrayList();
users.addAll(new User("Bruce", "Is strong", sdf.parse("24/12/1975")),
new User("Claire", "Is clever", sdf.parse("02/01/1986")),
new User("Bale", "Is funny", sdf.parse("03/01/1989")));
listView.setCellFactory(new Callback<ListView<User>, ListCell<User>>() {
@Override
public ListCell<User> call(ListView<User> param) {
return new ListCell<User>(){
@Override
protected void updateItem(User item, boolean empty) {
super.updateItem(item, empty);
if(item != null){
HBox mainPane = new HBox();
ImageView image = new ImageView(new Image(getClass().getResource("close_icon.png").toExternalForm(),
20, 20, true, true));
Label nick = new Label(item.nickProperty().get());
Label text = new Label(item.textProperty().get());
VBox vBox = new VBox();
vBox.getChildren().addAll(nick, text);
SimpleDateFormat dateFormat = new SimpleDateFormat("dd/MM/yyyy");
Label time = new Label(dateFormat.format(item.timeProperty().get()));
mainPane.getChildren().addAll(image, vBox, time);
setGraphic(mainPane);
}
}
};
}
});
listView.setItems(users);
root.setCenter(listView);
primaryStage.setScene(scene);
primaryStage.show();
} catch(Exception e) {
e.printStackTrace();
}
}
public static void main(String[] args) {
launch(args);
}
}
此代码生成以下内容:
我强烈建议您自己了解如何使用具有ListView,TableView等数据模型的JavaFX控件。
开始学习的好地方:Using JavaFX UI Controls: ListVew