Question

我的问题是如何根据用户在javafx中选择的复选框和/或单选按钮生成带有车载图片的按钮？

我正在用汽车图片模拟汽车经销网站。用户应该能够通过单击复选框和/或单选按钮选择来过滤显示的图片。

我首先为每个循环创建一个带有所有图片的按钮。我可以使用if和if / else语句来筛选图片，但是会有重复。我听说过observablelist，但是我还没有学到。

有人可以帮我解决这个问题吗？谢谢！

ArrayList<Car> cars;

for (Car r : cars)
{
    for (int i = 0; i < SIZE; i++)
    {
       // create buttons and set car pictures
       carButton[i] = new Button();
       carButton[i].setId(String.format("%d", i));
       carButton[i].setGraphic(cars.get(i).getCarPicture());
    }
}

Answer 1

建议不要使用ArrayList：

ObservableList

ObservableList<Car> carsList = FXCollections.observableArrayList<>();允许您侦听更改并做出相应的响应。例如，将新的ObservableList添加到列表中时，您可以触发一个事件，该事件会自动将新的Car添加到场景中。

这里是一个简短的演示应用程序，显示了它如何工作。我也确实在下面注释了代码，并且正在使用的许多概念可能超出了您的水平，但这至少是一种方法。

Button

结果：（几次单击“添加汽车”按钮后）

Answer 2

这是一个糟糕的实现，但是它将为您提供一些有关如何做事的想法。您需要研究FilteredList，ListView和Predicate。此实现一次不能处理多个CheckBox。它只会显示最后的CheckBox动作。

CarList

import java.util.ArrayList;
import java.util.List;
import javafx.application.Application;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;
import javafx.collections.transformation.FilteredList;
import javafx.scene.Scene;
import javafx.scene.control.CheckBox;
import javafx.scene.control.ListCell;
import javafx.scene.control.ListView;
import javafx.scene.layout.HBox;
import javafx.scene.layout.Priority;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;

/**
 *
 * @author Sedrick
 */
public class CarList extends Application {

    @Override
    public void start(Stage primaryStage) {
        List<Car> cars = new ArrayList();
        cars.add(new Car("Honda", "2004"));
        cars.add(new Car("Ford", "2005"));
        cars.add(new Car("Ford", "2004"));
        cars.add(new Car("Honda", "2005"));
        cars.add(new Car("Toyota", "2004"));
        cars.add(new Car("Cadillac", "2005"));

        ListView<Car> view = new ListView();
        view.setCellFactory((ListView<Car> param) -> {
            ListCell<Car> cell = new ListCell<Car>() {
                CarView carView = new CarView();

                @Override
                protected void updateItem(Car item, boolean empty) {
                    super.updateItem(item, empty);
                    if (item != null) {
                        setText("");
                        carView.setMake(item.getMake());
                        carView.setModel(item.getModel());
                        carView.setImageView(item.getUrl());
                        setGraphic(carView);
                    } else {
                        setText("");
                        setGraphic(null);
                    }
                }
            };
            return cell;
        });
        ObservableList<Car> data = FXCollections.observableArrayList(cars);
        FilteredList<Car> filteredList = new FilteredList(data);
        view.setItems(filteredList);
        HBox.setHgrow(view, Priority.ALWAYS);

        CheckBox checkBox = new CheckBox("Honda");
        checkBox.selectedProperty().addListener((observable, oldValue, newValue) -> {     
            if(newValue)
            {
            filteredList.setPredicate((item) -> {
                return item.getMake().equals("Honda");
            });
            }
            else{
                filteredList.setPredicate((item) -> {
                    return true;
                });
            }
        });
        CheckBox checkBox2 = new CheckBox("Ford");
        checkBox2.selectedProperty().addListener((observable, oldValue, newValue) -> {
            if(newValue)
            {
            filteredList.setPredicate((item) -> {
                return item.getMake().equals("Ford");
            });
            }
            else{
                filteredList.setPredicate((item) -> {
                    return true;
                });
            }
        });
        CheckBox checkBox3 = new CheckBox("2004");
        checkBox3.selectedProperty().addListener((observable, oldValue, newValue) -> {
            if(newValue)
            {
            filteredList.setPredicate((item) -> {
                return item.getModel().equals("2004");
            });
            }
            else{
                filteredList.setPredicate((item) -> {
                    return true;
                });
            }
        });
        CheckBox checkBox4 = new CheckBox("2005");
        checkBox4.selectedProperty().addListener((observable, oldValue, newValue) -> {
            if(newValue)
            {
            filteredList.setPredicate((item) -> {
                return item.getModel().equals("2005");
            });
            }
            else{
                filteredList.setPredicate((item) -> {
                    return true;
                });
            }
        });


        VBox leftPanel = new VBox(checkBox, checkBox2, checkBox3, checkBox4);

        HBox root = new HBox(leftPanel, view);

        Scene scene = new Scene(root, 625, 500);

        primaryStage.setTitle("Hello World!");
        primaryStage.setScene(scene);
        primaryStage.show();
    }

    /**
     * @param args the command line arguments
     */
    public static void main(String[] args) {
        launch(args);
    }

}

CarView

import javafx.scene.control.Label;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.HBox;
import javafx.scene.layout.Priority;
import javafx.scene.layout.StackPane;
import javafx.scene.layout.VBox;

/**
 *
 * @author Sedrick
 */
final public class CarView extends HBox{
    Label make = new Label();
    Label model = new Label();
    ImageView imageView = new ImageView();

    public CarView(String make, String model, String url) {
        this.make.setText(make);
        this.model.setText(model);

        HBox row1 = new HBox(new Label("Make: "), this.make);
        HBox row2 = new HBox(new Label("Model: "), this.model);
        VBox vbox = new VBox(row1, row2);
        vbox.setMaxSize(USE_PREF_SIZE, USE_PREF_SIZE);






        StackPane stackPane1 = new StackPane(vbox);
        HBox.setHgrow(stackPane1, Priority.ALWAYS);


        Image image = new Image(url);
        this.imageView.setImage(image);
        this.imageView.setFitHeight(100);
        this.imageView.setFitWidth(200);
        StackPane stackPane2 = new StackPane(this.imageView);
        stackPane2.setStyle("-fx-background-color: yellow");
        getChildren().addAll(stackPane1, stackPane2);

        setPrefSize(500, 125);

    }

    public CarView()
    {        
        HBox row1 = new HBox(new Label("Make: "), this.make);
        HBox row2 = new HBox(new Label("Model: "), this.model);
        VBox vbox = new VBox(row1, row2);
        vbox.setMaxSize(USE_PREF_SIZE, USE_PREF_SIZE);






        StackPane stackPane1 = new StackPane(vbox);
        HBox.setHgrow(stackPane1, Priority.ALWAYS);


        this.imageView.setFitHeight(100);
        this.imageView.setFitWidth(200);
        StackPane stackPane2 = new StackPane(this.imageView);
        stackPane2.setStyle("-fx-background-color: yellow");
        getChildren().addAll(stackPane1, stackPane2);

        setPrefSize(500, 125);
    }

    public void setImageView(String url) {
        Image image = new Image(url);

        this.imageView.setImage(image);
    }

    public void setMake(String make) {
        this.make.setText(make);
    }

    public void setModel(String model)
    {
        this.model.setText(model);
    }

}

汽车

/**
 *
 * @author Sedrick
 */
public class Car {
    private String make;
    private String model;
    private String url = "https://cdn.pixabay.com/photo/2012/05/29/00/43/car-49278_960_720.jpg";


    public Car(String make, String model) {
        this.make = make;
        this.model = model;
    }

    public String getMake() {
        return make;
    }

    public String getModel() {
        return model;
    }

    public String getUrl()
    {
        return url;
    }

    public void setMake(String make) {
        this.make = make;
    }

    public void setModel(String model) {
        this.model = model;
    }   
}

如何基于javafx中的复选框选择生成按钮（图片）

2 个答案: