如何在 javafx 中实现 GridView 样式
How to implement a GridView style in javafx
我非常理解 GridView 的实现以实现下图的表示，我很想获得同样在 javafx 中完成的实现，从而从 [=21 获取数据=] 数据库.
我真的不知道如何实现这个实现，即获取一个动态数据并用上面的样式表示。
非常感谢您的宝贵时间。
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;
}
}
我得到
Caused by: java.lang.NullPointerException at
controllers.Home_pageController.getGrid(Home_pageController.java:85)
at controllers.Home_pageController.start(Home_pageController.java:54)
at
com.sun.javafx.application.LauncherImpl.lambda$launchApplication12(LauncherImpl.java:863)
at
com.sun.javafx.application.PlatformImpl.lambda$runAndWait5(PlatformImpl.java:326)
at
com.sun.javafx.application.PlatformImpl.lambda$null3(PlatformImpl.java:295)
at java.security.AccessController.doPrivileged(Native Method) at
com.sun.javafx.application.PlatformImpl.lambda$runLater4(PlatformImpl.java:294)
at
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$null8(WinApplication.java:191)
我认为您真的很喜欢 JavaFX FXML，但我会向您指出 JDBC 和一些手工编码的 JavaFX。
步骤是安装 MYSQL、安装 ConnectorJ（这是一种从您的代码连接到 MySQL（驱动程序）的方法）记录密码，并创建一个新数据库，添加一个 table，以及您需要的列。
警告：这是个大问题，在很多地方都可以使用，但你已经问过了，所以我提供了一些代码。 GUI 部分 运行，数据库部分需要调整。
我还在下面为您演示了一个 GridPane。但我认为您想要的是绑定变量，以便您的视图自动更新——作为开始，正如我在代码中评论的那样，请查看 TableView 和 Cell Factories。还要检查数据绑定，类 喜欢：
https://docs.oracle.com/javase/8/javafx/api/javafx/beans/property/SimpleStringProperty.html
这段代码有一百万处错误：你永远不应该从你的 GUI 线程进行数据库调用，etc.etc。但你必须从某个地方开始。如果对您有帮助，请打上相应的标记。
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();
}
}
}
我真的不知道如何实现这个实现，即获取一个动态数据并用上面的样式表示。
非常感谢您的宝贵时间。
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;
}
}
我得到
Caused by: java.lang.NullPointerException at controllers.Home_pageController.getGrid(Home_pageController.java:85) at controllers.Home_pageController.start(Home_pageController.java:54) at com.sun.javafx.application.LauncherImpl.lambda$launchApplication12(LauncherImpl.java:863) at com.sun.javafx.application.PlatformImpl.lambda$runAndWait5(PlatformImpl.java:326) at com.sun.javafx.application.PlatformImpl.lambda$null3(PlatformImpl.java:295) at java.security.AccessController.doPrivileged(Native Method) at com.sun.javafx.application.PlatformImpl.lambda$runLater4(PlatformImpl.java:294) at 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$null8(WinApplication.java:191)
我认为您真的很喜欢 JavaFX FXML，但我会向您指出 JDBC 和一些手工编码的 JavaFX。
步骤是安装 MYSQL、安装 ConnectorJ（这是一种从您的代码连接到 MySQL（驱动程序）的方法）记录密码，并创建一个新数据库，添加一个 table，以及您需要的列。
警告：这是个大问题，在很多地方都可以使用，但你已经问过了，所以我提供了一些代码。 GUI 部分 运行，数据库部分需要调整。
我还在下面为您演示了一个 GridPane。但我认为您想要的是绑定变量，以便您的视图自动更新——作为开始，正如我在代码中评论的那样，请查看 TableView 和 Cell Factories。还要检查数据绑定，类 喜欢： https://docs.oracle.com/javase/8/javafx/api/javafx/beans/property/SimpleStringProperty.html
这段代码有一百万处错误：你永远不应该从你的 GUI 线程进行数据库调用，etc.etc。但你必须从某个地方开始。如果对您有帮助，请打上相应的标记。
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();
}
}
}