如何在javafx中实现GridView样式

时间:2017-08-02 02:26:07

标签: java javafx javafx-2 javafx-8

enter image description here我完全理解GridView的实现来实现下面图像的表示,我喜欢得到一个也在javafx中完成的实现,其中数据将从MYSQL数据库中获取。

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

我真的很感谢你的时间。

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;
    }

}

我正在

  

引起:java.lang.NullPointerException at   controllers.Home_pageController.getGrid(Home_pageController.java:85)     在controllers.Home_pageController.start(Home_pageController.java:54)     在   com.sun.javafx.application.LauncherImpl.lambda $ launchApplication1 $ 162(LauncherImpl.java:863)     在   com.sun.javafx.application.PlatformImpl.lambda $ runAndWait $ 175(PlatformImpl.java:326)     在   com.sun.javafx.application.PlatformImpl.lambda为$ null $ 173(PlatformImpl.java:295)     在java.security.AccessController.doPrivileged(Native Method)at   com.sun.javafx.application.PlatformImpl.lambda $ runLater $ 174(PlatformImpl.java:294)     在   com.sun.glass.ui.InvokeLaterDispatcher $ Future.run(InvokeLaterDispatcher.java:95)     at com.sun.glass.ui.win.WinApplication._runLoop(Native Method)at   com.sun.glass.ui.win.WinApplication.lambda $ $空148(WinApplication.java:191)

1 个答案:

答案 0 :(得分:1)

我认为你真的是在JavaFX FXML之后,但是我会指向JDBC和一些手工编写的JavaFX。

步骤是安装MYSQL,安装ConnectorJ(这是一种从代码连接到MySQL(驱动程序)的方法)记录密码,创建一个新的数据库,添加一个表,以及你需要的列。

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

我还为您演示了一个GridPane。但我认为你想要的是什么,以便你的视图自动更新,是绑定变量 - 作为一个开始,正如我在代码中评论的那样,请查看TableView和Cell Factories。还要检查数据绑定,以及类: https://docs.oracle.com/javase/8/javafx/api/javafx/beans/property/SimpleStringProperty.html

这段代码有一百万个问题:你永远不应该从你的GUI线程等进行数据库调用。但是你必须从某个地方开始。如果这有帮助,请相应标记。

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();
    }
}

}