Въведение в оформлението на JavaFX

Оформлението на потребителския интерфейс е центърът на дизайна на интерфейса. Много от рамките на графичния потребителски интерфейс предлагат поддръжка за оформления под формата на API (интерфейси за програмиране на приложения). В JavaFX също е осигурен богат брой оформления, които помагат за изпълнение на много от ограниченията, за да се отговори на последователния вид и усещане. В този случай трябва да се зададе само минималният брой параметри. Оформленията могат да бъдат от различни видове и това е обяснено в следващите раздели подробно.

Топ 5 оформления на JavaFX

Както вече беше обсъдено, оформленията на JavaFX могат да бъдат от различни типове като VBox, HBox, BorderPane, FlowPane, StackPane, AnchorPane, TilePane, GridPane и др. В този раздел ще обсъдим пет от тях.

1. VBox

VBox помага при организирането на възела във вертикална колона. По този начин височината по подразбиране на съдържанието може да показва децата в предпочитаната им височина, а ширината по подразбиране е най-голямата от ширината на децата. Въпреки че местоположението не може да бъде зададено за децата, тъй като то автоматично се изчислява, то може да бъде контролирано до степен чрез персонализиране на VBox свойствата.

Код:

// Java Program to create a VBox
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.*;
import javafx.scene.layout.*;
import javafx.stage.Stage;
public class JFXLayouts extends Application (
// start method helps in launching the application
public void start(Stage stage)
(
// Title set
stage.setTitle("Example for VBox");
// VBox creation
VBox vb = new VBox(10);
// Label creation
Label lb = new Label("this is VBox example");
// Add the created label to vbox
vb.getChildren().add(lb);
// add the buttons to VBox
vb.getChildren().add(new Button("Click A"));
vb.getChildren().add(new Button("Click B"));
vb.getChildren().add(new Button("Click C"));
// Scene creation
Scene scene = new Scene(vb, 300, 300);
// Scene setting
stage.setScene(scene);
stage.show();
)
// Main Method
public static void main(String args())
(
//method to launch the JavaFX application
launch(args);
)
)

изход:

Тук 3 бутона A, B и C са подредени хоризонтално.

2. HBox

HBox работи в противоположната концепция на VBox. Тоест възлите ще бъдат организирани хоризонтално. Следва програма, която помага за разбирането на HBox.

Код:

// Java Program to create an HBox
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.*;
import javafx.scene.layout.*;
import javafx.stage.Stage;
public class JFXLayouts extends Application (
// start method helps in launching the application
public void start(Stage stage)
(
// Title set
stage.setTitle("Example for HBox");
// HBox creation
HBox hb = new HBox(10);
// Label creation
Label lb = new Label("this is HBox example");
// Add the created label to Hbox
hb.getChildren().add(lb);
// add the buttons to Hbox
hb.getChildren().add(new Button("Click A"));
hb.getChildren().add(new Button("Click B"));
hb.getChildren().add(new Button("Click C"));// Scene creation
Scene scene = new Scene(hb, 300, 300);
// Scene setting
stage.setScene(scene);
stage.show();
)
// Main Method
public static void main(String args())
(
//method to launch the JavaFX application
launch(args);
)
)

изход:

В този случай 3 бутона A, B и C са разположени хоризонтално.

3. BorderPane

В това, структурата на оформлението има пет региона като TOP, BOTTOM, CENTER, LEFT и RIGHT.

Код:

// Java Program to create an BorderPane
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.*;
import javafx.scene.layout.*;
import javafx.stage.Stage;
public class JFXLayouts extends Application (
// start method helps in launching the application
public void start(Stage stage)
(
BorderPane bp = new BorderPane();
bp.setTop(new TextField("A-Top"));
bp.setBottom(new TextField("B-Bottom"));
bp.setLeft(new TextField("C-Left"));
bp.setRight(new TextField("D-Right"));
bp.setCenter(new TextField("E-Center"));// Scene creation
Scene scene = new Scene(bp);// Title set
stage.setTitle("Example for BorderPane");
// Scene setting
stage.setScene(scene);
stage.show();
)
// Main Method
public static void main(String args())
(
//method to launch the JavaFX application
launch(args);
)
)

изход:

Тук 5 текстови полета са повторно изпратени в петте направления на прозореца.

4. FlowPane

FlowPane позволява на потребителя да подреди възлите последователно и увива възлите на границата. Тук възлите могат да бъдат във вертикална посока (колони) или хоризонтална посока (редове).

Код:

// Java Program to create a flowpane
import javafx.application.Application;
import javafx.collections.ObservableList;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.FlowPane;
import javafx.scene.shape.Sphere;
import javafx.stage.Stage;
public class JFXLayouts extends Application (
// start method helps in launching the application
public void start(Stage stage)
(
//create buttons
Button b1 = new Button("Button A");
Button b2 = new Button("Button B");
Button b3 = new Button("Button C");
Button b4 = new Button("Button D");
//Flow Pane creation
FlowPane fp = new FlowPane();
//Set horizontal gap
fp.setHgap(25);
//Set margin
fp.setMargin(b1, new Insets(20, 0, 20, 20));
ObservableList list = fp.getChildren();
//Add nodes to the flow pane
list.addAll(b1, b2, b3, b4);
// Scene creation
Scene scene = new Scene(fp);
// Title set
stage.setTitle("Example for BorderPane");
// Scene setting
stage.setScene(scene);
stage.show();
)
// Main Method
public static void main(String args())
(
//method to launch the JavaFX application
launch(args);
)
)

изход:

5. StackPane

В това оформление всички възли са поставени в един стек. Тоест възлите са подредени точно като в стека, отгоре на друга.

Код:

// Java Program to create a flowpane
import javafx.application.Application;
import javafx.scene.shape.Sphere;
import javafx.collections.ObservableList;
import javafx.scene.text.Font;
import javafx.geometry.Insets;
import javafx.scene.text.FontWeight;
import javafx.scene.Scene;
import javafx.scene.layout.StackPane;
import javafx.scene.shape.Circle;
import javafx.scene.text.Text;
import javafx.stage.Stage;
import javafx.scene.paint.Color;
public class JFXLayouts extends Application (
@Override
public void start(Stage stage) (
//draw a sphere
Sphere sph = new Sphere(50);
//text creation
Text t = new Text("DEMO");
//Set font of the text
t.setFont(Font.font(null, FontWeight.BOLD, 13));
//Set color of the text
t.setFill(Color.RED);
//set position of the text
t.setX(20);
t.setY(50);
//Create a Stackpane
StackPane sp = new StackPane();
ObservableList list = sp.getChildren();
//Add nodes to the pane
list.addAll( sph, t);
// Scene creation
Scene scene = new Scene(sp);
// Title set
stage.setTitle("Example for BorderPane");
// Scene setting
stage.setScene(scene);
stage.show();
)
// Main Method
public static void main(String args())
(
//method to launch the JavaFX application
launch(args);
)
)

изход:

заключение

JavaFX Layouts помага да се създаде дизайн на интерфейса в последователен вид и усещане. Оформленията могат да бъдат от различни видове и те могат да бъдат избрани въз основа на изискванията на потребителя. В този документ са разгледани подробно пет от оформлението на JavaFX.

Препоръчителни статии

Това е ръководство за оформления на JavaFX. Тук обсъждаме топ 5 оформления на JavaFX като VBox, HBox, BorderPane, FlowPane и StackPane, заедно с примери и реализация на код. Можете също да разгледате следните статии, за да научите повече -

  1. Декларация за прекъсване в Java
  2. JList на Java
  3. JPanel в Java
  4. За контур в Java
  5. Пълно ръководство за етикета на JavaFX
  6. Декларация за прекъсване в JavaScript
  7. HTML оформление
  8. Видове и как да създадете JavaFx графики?
  9. Как да въвеждате текст в JavaFX TextField?
  10. Конструктори и методи на JavaFx бутон
  11. Топ 15 методи на HBox в JavaFX
  12. Как да създадете отметка в JavaFX с примери?
  13. JavaFX VBox | Методи на JavaFX VBox
  14. Различни методи на JavaFX StackPane