ListView中的选定项目隐藏JavaFX

时间:2016-06-04 12:33:03

标签: java listview javafx hide

我有一个 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;

}

1 个答案:

答案 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);
    }
}

此代码生成以下内容:

enter image description here

我强烈建议您自己了解如何使用具有ListView,TableView等数据模型的JavaFX控件。

开始学习的好地方:Using JavaFX UI Controls: ListVew