Foreword
Park open blog for some time, and we have no time to write something that is also a good thought. Recently just do a desktop application, the initial contact with JavaFX, really easy to use than the swing down to experience a lot. They simply study notes in mind in mind, even though there is no feeling quite like FX, people did not feel used. I have limited skills, understanding is not high, very slow to learn. However, road resistance and long, the line will be to write good notes for future unknown origin point, pulled up and thought Markdown. The system may not be so, but as detailed as possible.
Article directory
1. JavaFX form load
1.1 traditional way
1.1 FXML + CSS2. Add the shadows transparent window
in the traditional way 2.1
+ CSS under way 2.1 FXML
JavaFX form loads
The traditional way
In general, we have:
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.layout.BorderPane;
import javafx.stage.Stage;
import javafx.stage.StageStyle;
public class demo extends Application {
@Override
public void start(Stage primaryStage) throws Exception {
BorderPane root = new BorderPane();//底层面板
Scene scene = new Scene(root,400,400);//设置窗体面板和大小
primaryStage.initStyle(StageStyle.DECORATED);//设置窗体样式
primaryStage.setTitle("Demo From"); //设置窗口标题
primaryStage.getIcons().add(null);//设置窗口图标
primaryStage.setScene(scene);
primaryStage.show();
}
public static void main(String[] args) {
launch();
}
}Too basic layout will not say, for a form style, we have the following:
. 1, Decorated - white background, with a minimize / maximize / closing operating system platforms, which are decorated (by default)
2, undecorated - white background, the operating system platform without decoration
. 3, the TRANSPARENT - transparent background, no operating system decorative platform
4, UTILITY - white background, only shut down the operating system platform decorated
5, UNIFIED - decorated with an operating system platform, eliminating the border between the decorative and content, consistent content background and border background
(Icon for a form, the code represents the null an Image object, not to proceed to say)
FXML + CSS way
In addition to the traditional way, using more and more convenient way FXML + CSS, in general, we have:
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.layout.BorderPane;
import javafx.stage.Stage;
import javafx.stage.StageStyle;
public class demo extends Application {
@Override
public void start(Stage primaryStage) throws Exception {
FXMLLoader fxmlLoader = new FXMLLoader("FXML file path");
Parent root = fxmlLoader.load();
Scene scene = new Scene(root,400,400);//设置窗体面板和大小
primaryStage.initStyle(StageStyle.DECORATED);//设置窗体样式
primaryStage.setTitle("Demo From"); //设置窗口标题
primaryStage.getIcons().add(null);//设置窗口图标
primaryStage.setScene(scene);
primaryStage.getScene().getStylesheets().add("CSS file path");
primaryStage.show();
}
public static void main(String[] args) {
launch();
}
}In this way, set in FXML id for the control, you can set up different styles using id selectors in css file, use roughly the same in CSS3, the main difference and how the traditional manner at some see pattern for the control.
(Pseudo-code can not be run directly)
Transparent form to add shadow
Let's take a look at the shaded and unshaded window difference:
(Blog because white background, so the chart into a gray background. Meanwhile, in order to facilitate comparison without a shadow of extra black border 0.3, otherwise may not be visible)
It is worth noting that
1, in front of JavaFX CSS syntax must be "-fx-" they will not take effect, for the use of CSS file to load is the same
2, the form shadows when using the "operating system platforms decoration" stage style is the default automatically generated without their own settings, therefore, need to use custom forms shadow transparent style (TRANSPARENT)
3, transparent window must be used to add a shadow
StackPaneas the underlying layout
The traditional way
For the traditional way, we have:
stage.initStyle(StageStyle.TRANSPARENT);
StackPane root = new StackPane();//底层面板
Scene scene = new Scene(root);
stackPane.setStyle(
"-fx-background-color: rgba(255, 255, 255, 1);" +
"-fx-effect: dropshadow(gaussian, black, 50, 0, 0, 0);" +
"-fx-background-insets: 50;"
);
scene.setFill(Color.TRANSPARENT);
stage.setScene(scene);
stage.show();Here too easy to see the use of CSS, but not in files loaded, then for other controls, you can use the same setStyle()method to set the style.
+ FXML CSS under way
In fact, similar in two ways, on the same principle. In this way, there are:
Code section
stage.initStyle(StageStyle.TRANSPARENT);
StackPane stackPane = new FXMLLoader("FXML file path").load();
Scene scene = new Scene(stackPane);
scene.setFill(Color.TRANSPARENT);
stage.setScene(scene);
stage.getScene().getStylesheets().add("CSS file path");
stage.show();FXML part
<StackPane xmlns="http://javafx.com/javafx"
fx:id="root"
xmlns:fx="http://javafx.com/fxml"
prefHeight="680.0" prefWidth="1000.0">
</StackPane>CSS section
.root{
-fx-background-color: rgba(255, 255, 255, 1);
-fx-effect: dropshadow(gaussian, black, 50, 0, 0, 0);
-fx-background-insets: 50;
}Here it is easy to see FXML + CSS way to the traditional way, essentially split to achieve a more concise.
Note that you must set in the FXML idor styleClass, css style sheets before they can take effect, and a lot of property, both set in the code, or may be provided FXML css, such as control size.
Therefore, two ways can be mixed, such as the use FXML loaded layout, then set the style directly in the code, or set the layout and id code, css style sheet file is loaded, all this can be selected according to their needs.
Reference article: https://blog.csdn.net/qq_32571359/article/details/72957307
(This article was last updated on 2020.3.10, the original article, reproduced please specify)