Javafx scene builder usage Summary

Continuously update the problems and solutions I encountered when using javafx scene builder!

My general development steps: first, design the interface layout in javafx scene builder and finish the work to be done on the interface, including defining the Controller class and defining a simple style, define the event method, and then copy the entire fxml file and the used resource file (image, etc.) together to eclipse (the javafx development plug-in version is installed, for more information, see the software I need in javafx. Finally, use fxmlloader in the program to load the software and display it.

1. Do not add styles in javafx scene builder! It will add a styleclass attribute to the corresponding element, but an error will always be reported when running the program. If you want to use CSS to set the style of each element, it is recommended to manually operate! Add a child node to the element of the style in the fxml file, as shown below!

 

However, it is hard to understand that if the interface is re-designed in javafx scene builder after the program is modified, javafx scene builder will delete the styleclass you added, most of the time

Synchronization is very difficult, so it is best to synchronize well!

 

2. When javafx scene builder is used, the attribute panel on the right is often suspended. You can resize the Panel. This is a known bug found on the official website.

 

3. During localization, we usually use % bundletext in the fxml file to bind a key-Value Pair in a specific properties file, but some problems may occur here. For example, set the text of a label

% Message, the code generated in the fxml file is text = "\ % message". Because % is a special character, it must be escaped by a backslash. However, it will be very troublesome! Because eclipse reports an error when copying data to eclipse! The reason is that it is used to escape "\", and it will find that this diagonal line is redundant, So I thought of a way: % is required to be transferred, but * is not required, in addition, the interface is usually not displayed in the text. Therefore, if you want to read the corresponding text from the property file during the development interface, then I will define the text in the form of * message, copy the file to eclipse and use the replacement function of eclipse. Note that you cannot replace all * With % directly because the import element in the fxml File Header also exists *, therefore, it is best to replace text = "* with text =" * "with text =" % "to ensure that nothing is lost! Similarly, if you only modify the fxml file in eclipse, if you want to copy the file content and synchronize it to javafx scene builder, replace %! It's very convenient! However, we still hope that javafx scenebuilder can be more intelligent!

Another issue to note is that if you want a label or text to start with an empty string (for example, this label displays the error message, but it certainly does not exist at the beginning ), generally, text is set to "", but it is best to use "* message", and then set its initial value to a null string in the properties file to avoid errors!

 

4. Use the image in javafx scene builder: Click file, select import, and select an image. The tool automatically generates an imageview! Note: It is recommended that there be no spaces in the image file name. Otherwise, this display will be normal and an error may occur next time! If the image is located in the directory or subdirectory of the current fxml file, the corresponding URL uses the relative path, which is generally like this: url = "@background-shadow.png ", however, if it is in the parent directory of the current fxml file or another directory, the generated URL uses an absolute path! Example: url = "file:/D:/yinger/My % 20 dbank/workspace_fxml/apple.png"

Similarly, the same method is used to use video or audio in javafx scene builder! More effectively, you can import other fxml files to the current fxml file, which facilitates Component Reuse! The tool automatically generates the corresponding import Code, for example, <FX: include source = "pageview. fxml "/>. In addition, the content in the imported fxml file will be updated to this file!

 

5. generally, the root node of the newly created fxml file is anchorpane by default, but sometimes we do not want the root node to be it. For example, we want the root node to be stackpane, but what if the root node cannot be deleted in javafx scene builder? It's easy to modify the fxml source file! Change the anchorpane of the root node in the source file to stackpane, And then you can see the effect!

 

6. javafx scene builder has a good function. Click View and select Show outlines to view the layout grid lines!

 

7. Click the small downward arrow on the right of the hierarchy panel to quickly display the FX: ID/info function. info generally displays the table size of gridpane (column * row)