如何在javafx中实现GridView样式

Question

我真的不知道如何获得这个实现，即获取一个数据，它将是动态的，并用上面的样式表示。

我衷心感谢你抽出时间。

public class Home_pageController extends Application {

    @FXML
    private GridPane myGrid;
    @FXML
    private JFXButton yes_button;

    /**
     * Initializes the controller class.
     */
    /**
     * Initializes the controller class.
     */
    @Override
    public void start(Stage stage) throws Exception {
        //    Parent root = FXMLLoader.load(getClass().getResource("Student.fxml"));
        getGrid();

        Parent root = FXMLLoader.load(getClass().getResource("home_page.fxml"));
        //GridPane root = new GridPane();

        Scene scene = new Scene(root);
        stage.setTitle("Some scene");
        stage.setScene(scene);

        stage.show();
    }

    /**
     * @param args the command line arguments
     */
    public void getGrid() {
        List<ImageDataObjs> imageURLs ; //you'll use something like this, but I've not for this little helper
        //here you'll want to make a database setup and a call: This is a really bad program, but it will demonstrate
        conn = javaconnect.ConnectDb();
        imageURLs = makeDBCall();
         GridPane gridPane = new GridPane();
//        myGrid.setGridLinesVisible(true);

        for (int i = 0; i < 5; i++) {
            for (int j = 0; j < 5; j++) {
                System.out.print("Just me here again "+imageURLs.get(i).the_image);

                Label label = new Label("Label " + i + "/" + j);
//                label.setMouseTransparent(true);
                GridPane.setRowIndex(label, i);
                GridPane.setColumnIndex(label, j);
                myGrid.getChildren().add(imageURLs.get(10).the_image);
            }
        }
    }

    public static void main(String[] args) {
        launch(args);
    }

    class ImageDataObjs {

        // final ImageView imageView;
        //  String imgURL, price;
        @FXML
        final ImageView the_image;
        String imgURL;
        byte[] price;

        public ImageDataObjs(String imgURL, byte[] price) throws IOException {
            this.imgURL = imgURL;
            this.price = price;
            InputStream in = new ByteArrayInputStream(price);

            WritableImage images = new WritableImage(50, 50);

            ByteArrayInputStream bis = new ByteArrayInputStream(price);
            BufferedImage read = ImageIO.read(bis);
            images = SwingFXUtils.toFXImage(read, null);
            this.the_image = new ImageView(images);
        }
    }

    Connection conn = null;
    ResultSet rs = null;
    PreparedStatement pst = null;
    static byte[] staff_image;
//there a million examples of theis on the web

    private List<ImageDataObjs> makeDBCall() {
        List<ImageDataObjs> imageDataObjList = new ArrayList<>();
        // String myPrice, myURL;
        byte[] myPrice;
        String myURL;
        try {
            String sql = "select * from phone_types";
            pst = conn.prepareStatement(sql);
            rs = pst.executeQuery();
            while (rs.next()) {
                myPrice = rs.getBytes("phone_image");
                myURL = rs.getString("phone_name");
                System.out.println("I am just here "+ myPrice);
                imageDataObjList.add(new ImageDataObjs(myURL, myPrice));
            }
            conn.close();

        } catch (Exception e) {
            e.printStackTrace();
        }
        return imageDataObjList;
    }

}

我得到了

原因：controllers.home_pageController处的java.lang.nullPointerException。controlers.home_pageController处的getGrid(home_pageController.java:85)。start(home_pageController.java:54)处的com.sun.javafx.application.launchimpl.lambda$launchapplication1$162(launchimpl.java:863)处的

Answer 1

我想您确实喜欢JavaFX FXML，但我会将您引向JDBC和一些手工编写的JavaFX。

步骤是安装MYSQL、安装ConnectorJ（这是一种从代码连接到MYSQL（驱动程序）的方法）、记录密码、创建一个新的数据库、添加一个表和所需的列。

警告：这是一个很大的问题，在很多地方都有，但是您已经问过了，所以我提供了一些代码。GUI部分将运行，数据库部分将需要调整。

我还在下面为您演示了一个GridPane。但我认为您需要的是绑定变量，以便视图自动更新--作为开始，正如我在代码中所评论的，请查看TableView和Cell工厂。此外，还可以查看数据绑定和类：https://docs.oracle.com/javase/8/javafx/api/javafx/beans/property/simpleStringProperty.html

这段代码有很多错误：您永远不应该从您的GUI线程进行DB调用，等等。但你得从某处开始。如果这有帮助，请相应地标记。

import com.techtalix.util.Const;
import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.GridPane;
import javafx.stage.Stage;
import javafx.stage.StageStyle;
import java.io.File;
import java.nio.file.Path;
import java.nio.file.Paths;
import java.sql.*;
import java.util.ArrayList;
import java.util.List;


public class Test extends Application {

Connection connect = null;

public static void main(String[] args) {
    launch(args);
}

@Override
public void start(Stage stage) {

    List<ImageDataObjs> imageURLs = null; //you'll use something like this, but I've not for this little helper
    //here you'll want to make a database setup and a call: This is a really bad program, but it will demonstrate
    connectToDB();
    imageURLs = makeDBCall();

    GridPane root = new GridPane();
    Scene theScene = new Scene(root);
    stage.setTitle("Some scene");
    stage.setScene(theScene);

    root.setPadding(new Insets(10,10,10,10));
    root.setHgap(10);
    root.setVgap(10);

    int cols=2, colCnt = 0, rowCnt = 0;
    for (int i=0; i<imageURLs.size(); i++) {
        root.add(imageURLs.get(i).imageView, colCnt, rowCnt);
        colCnt++;
        if (colCnt>cols) {
            rowCnt++;
            colCnt=0;
        }
    }


    // in terms of auto update, instead of gridpane, I suggest you look into TableView, and cell factories.
    // once you have bound your cell factories, you can make calls to your DB, and the values bound will update automatically
    //http://www.java2s.com/Tutorials/Java/JavaFX/0650__JavaFX_TableView.htm

    stage.initStyle(StageStyle.UNDECORATED); //remove this is you want to see the title bar etc.
    stage.show();
}

class ImageDataObjs {
    final ImageView imageView;
    String imgURL, price;

    public ImageDataObjs(String imgURL, String price) {
        this.imgURL = imgURL;
        this.price = price;
        Path imagePath = Paths.get(imgURL);
        File imageFile = imagePath.toFile();
        Image image = new Image(imageFile.toURI().toString());
        this.imageView = new ImageView(image);
    }
}

//there a million examples of theis on the web
private List<ImageDataObjs> makeDBCall() {
    List<ImageDataObjs> imageDataObjList = new ArrayList<>();
    String myPrice, myURL;
    try {

        Statement statement = connect.createStatement();
        ResultSet resultSet = statement
                .executeQuery("select * from myProductList"); //you need to have a table called myProductList in your database

        while (resultSet.next()) {
            myPrice = resultSet.getString("myImageURL"); //these are the SQL cols that you should have already created in your database
            myURL = resultSet.getString("somePriceData");
            imageDataObjList.add(new ImageDataObjs(myURL, myPrice));
        }
        connect.close();

    } catch (Exception e) {
        e.printStackTrace();
    }

    /*
    JUST FOR EXAMPLE - this would come from your database query
     */

    imageDataObjList.add(new ImageDataObjs(Const.BASE_DIRECTORY + "png/bridge.png", "1.99"));
    imageDataObjList.add(new ImageDataObjs(Const.BASE_DIRECTORY + "png/bridge.png", "2.99"));
    imageDataObjList.add(new ImageDataObjs(Const.BASE_DIRECTORY + "png/bridge.png", "3.99"));
    imageDataObjList.add(new ImageDataObjs(Const.BASE_DIRECTORY + "png/bridge.png", "4.99"));
    imageDataObjList.add(new ImageDataObjs(Const.BASE_DIRECTORY + "png/bridge.png", "5.99"));
    imageDataObjList.add(new ImageDataObjs(Const.BASE_DIRECTORY + "png/bridge.png", "6.99"));
    imageDataObjList.add(new ImageDataObjs(Const.BASE_DIRECTORY + "png/bridge.png", "6.99"));

    return imageDataObjList;
}

private void connectToDB() {
    //Note: you'll still it in tutorials, but Class.forName() is not needed since JDBC 4.0.
    //make sure but this point that MYSQL is installed, and that ConnectorJ is also installed.
    //create a database called "someDatabase" - make sure user and password are are you installed them.
    try {
        connect =
                DriverManager.getConnection("jdbc:mysql://localhost/someDatabase" +
                        "?user=root&password=root");
    } catch (SQLException e) {
        e.printStackTrace();
    }
}

}