Scribd
Upload
60 views48 pages

JavaFX Basics

Uploaded by

Affan Mirza
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
60 views48 pages

JavaFX Basics

Uploaded by

Affan Mirza
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd

JavaFX Basics

Why?
Not everything has to be in command-line interfaces (CLIs).

Think of the suffers your grandparents face for using CLIs!

Your apps shall be user-friendly to get many users!

2
3
4
5
Intro
JavaFX is a library for creating GUIs in Java.

OOPs are heavily utilized in JavaFX.

A JavaFX application can run both on a desktop and


a Web browser.

6
Hello
import [Link];
import [Link];
import [Link];
import [Link];

// hello world
public class GUI00 extends Application {

@Override
public void start(Stage stg) throws Exception {
Label label = new Label("Hello world from JavaFX!");
Scene scene = new Scene(label);
[Link](scene);
[Link]();
}

public static void main(String[] args) {


[Link](args);
}
7
}
Hello

8
Hello
import [Link];
import [Link];
import [Link];
import [Link]; Analyze the OOP of this Hello code!
// hello world
public class GUI00 extends Application {

@Override
public void start(Stage stg) throws Exception {
Label label = new Label("Hello world from JavaFX!");
Scene scene = new Scene(label);
[Link](scene);
[Link]();
}

public static void main(String[] args) {


[Link](args);
}
9
}
Hello
import [Link];
import [Link];
import [Link];
import [Link];

// hello world
public class GUI00 extends Application {

@Override
public void start(Stage stg) throws Exception {
Label label = new Label("Hello world from JavaFX!");
Scene scene = new Scene(label);
Label is a non-editable text control. A Label is
[Link](scene);
[Link](); useful for displaying text that is required to fit
} within a specific space.
public static void main(String[] args) {
[Link](args);
}
10
}
Hello
import [Link];
import [Link];
import [Link];
import [Link];

// hello world
public class GUI00 extends Application {

@Override
public void start(Stage stg) throws Exception {
Label label = new Label("Hello world from JavaFX!");
Scene scene = new Scene(label);
[Link](scene);
[Link](); The JavaFX Scene class is the container for all
} content in a scene graph.
public static void main(String[] args) {
[Link](args);
}
11
}
Hello
import [Link];
import [Link];
import [Link];
import [Link];

// hello world
public class GUI00 extends Application {

@Override
public void start(Stage stg) throws Exception {
Label label = new Label("Hello world from JavaFX!");
A Stage in JavaFX is a top-level container that
Scene scene = new Scene(label);
[Link](scene); hosts scenes. The primary stage is created by
[Link](); the platform and passed to the start(Stage stg)
}
method of the Application class.
public static void main(String[] args) {
[Link](args);
}
12
}
13
The very basics of JavaFX
import [Link];
import [Link];
import [Link];
import [Link];

public class GUI001 extends Application {


@Override
public void start(Stage stg) throws Exception {
Button button = new Button("Readyyy!");
Scene scene = new Scene(button, 250, 100);
[Link]("GUI 001");
[Link](scene);
[Link]();
}

public static void main(String[] args) {


[Link](args);
}

} 14
The very basics of JavaFX
import [Link];
import [Link];
import [Link];
import [Link];

public class GUI001 extends Application {


@Override
public void start(Stage stg) throws Exception {
Button button = new Button("Readyyy!");
Scene scene = new Scene(button, 250, 100);
[Link]("GUI 001");
[Link](scene);
[Link]();
}

public static void main(String[] args) {


[Link](args);
}

} 15
The very basics of JavaFX
import [Link];
import [Link];
import [Link];
import [Link];

public class GUI001 extends Application {


@Override
public void start(Stage stg) throws Exception {
Button button = new Button("Readyyy!");
Scene scene = new Scene(button, 250, 100);
[Link]("GUI 001");
[Link](scene);
[Link]();
}

public static void main(String[] args) {


[Link](args);
}
Add [Link](false);
} and what would happen?
16
Multiple stages
// ... other code parts follow previous code
public void start(Stage stg1) throws Exception {
[Link]("GUI 002");
[Link](new Scene(new Button("Gooo!"), 200,100));
[Link]();

Stage stg2 = new Stage();


[Link]("GUI 002");
[Link](new Scene(new Button("Steadyyy!"), 200,100));
[Link]();

Stage stg3 = new Stage();


[Link]("GUI 002");
[Link](new Scene(new Button("Readyyy!"), 200,100));
[Link]();
}

17
Multiple stages
// ... other code parts follow previous code
public void start(Stage stg1) throws Exception {
[Link]("GUI 002");
[Link](new Scene(new Button("Gooo!"), 200,100));
[Link]();

Stage stg2 = new Stage();


[Link]("GUI 002");
[Link](new Scene(new Button("Steadyyy!"), 200,100));
[Link]();

Stage stg3 = new Stage();


[Link]("GUI 002");
[Link](new Scene(new Button("Readyyy!"), 200,100));
[Link]();
}

Close the window, you'll see the Steadyyy! stage,


close the window again, you'll see the Gooo! stage.
18
A pane is like a container
public void start(Stage stg1) throws Exception {
StackPane pn = new StackPane();
[Link]().add(new Button("Niceee!")); // because Nice! would sound rude
Scene scn = new Scene(pn, 300, 100);
[Link](scn);
[Link]();
}

19
A pane is like a container
public void start(Stage stg1) throws Exception {
StackPane pn = new StackPane();
[Link]().add(new Button("Niceee!")); // because Nice! would sound rude
Scene scn = new Scene(pn, 300, 100);
[Link](scn);
[Link]();
}

Note that the button now doesn't occupy the whole scene, thanks to Pane!
20
Stacked square and button
public void start(Stage stg1) throws Exception {
Rectangle rect = new Rectangle(100, 100, 180, 140);
[Link]([Link]);

StackPane pn = new StackPane(rect, new Button("Niceee!"));


Scene scn = new Scene(pn, 500, 200);
[Link](scn);
[Link]();
}

21
Stacked square and button
public void start(Stage stg1) throws Exception {
Rectangle rect = new Rectangle(100, 100, 180, 140);
[Link]([Link]);

StackPane pn = new StackPane(rect, new Button("Niceee!"));


Scene scn = new Scene(pn, 500, 200);
[Link](scn);
[Link]();
}

22
Quiztime: Java art

23
Quiztime: Java art
public void start(Stage stg1) throws Exception {
StackPane pn = new StackPane();
for(int i = 100; i > 0; i--) {
Rectangle rect = new Rectangle(0,0,5*i,5*i);
switch(i % 3) {
case 0:
[Link]([Link]); break;
case 1:
[Link]([Link]); break;
case 2:
[Link]([Link]); break;
}
[Link]().add(rect);
}

Scene scn = new Scene(pn, 500, 500);


[Link](scn);
[Link]();
}
24
Circle
public void start(Stage stg1) throws Exception {
Circle c = new Circle();
[Link](200);
[Link](100);
[Link](50);
[Link]([Link]);
[Link](5);
[Link]([Link]);

Pane pn = new Pane();


[Link]().add(c);
Scene scn = new Scene(pn, 400, 200);
[Link]("Life's like a circle");
[Link](scn);
[Link]();
}

25
Circle
public void start(Stage stg1) throws Exception {
Circle c = new Circle();
[Link](200);
[Link](100);
[Link](50);
[Link]([Link]);
[Link](5);
[Link]([Link]);

Pane pn = new Pane();


[Link]().add(c);
Scene scn = new Scene(pn, 400, 200);
[Link]("Life's like a circle");
[Link](scn);
[Link]();
}

26
Circle
public void start(Stage stg1) throws Exception {
Circle c = new Circle();
[Link](70);
[Link](100);
[Link](50);
[Link]([Link]);
[Link](5);
[Link]([Link]);

Pane pn = new Pane();


[Link]().add(c);
Scene scn = new Scene(pn, 400, 200);
[Link]("Life's like a circle");
[Link](scn);
[Link]();
}

27
Circle
public void start(Stage stg1) throws Exception {
Circle c = new Circle();
[Link](70);
[Link](0);
[Link](50);
[Link]([Link]);
[Link](5);
[Link]([Link]);

Pane pn = new Pane();


[Link]().add(c);
Scene scn = new Scene(pn, 400, 200);
[Link]("Life's like a circle");
[Link](scn);
[Link]();
}

28
Quiztime: Loops of circles

29
Solution
public Circle createCircle(int X, int Y) {
Random r = new Random();
Circle c = new Circle();
[Link](X);
[Link](Y);
[Link](30);
[Link]([Link]([Link](256), [Link](256), [Link](256)));
return c;
}

// ... cont

30
Solution
// ... cont

@Override
public void start(Stage stg1) throws Exception {
Pane pn = new Pane();
for(int i = 0; i < 5; i++)
for(int j = 0; j < 5; j++)
[Link]().add(createCircle(50 + i*65,50 + j*65));
Scene scn = new Scene(pn, 360, 360);
[Link]("Circles");
[Link](scn);
[Link](false);
[Link]();
}

31
JavaFX provides many other shapes

Image copyright: [Link]

32
Quiztime: We love buttons

33
Solution
@Override
public void start(Stage stg1) throws Exception {
VBox pn = new VBox();
[Link]([Link]);
[Link](20);
for(int i = 1; i <= 9; i++)
[Link]().add(new Button("Button " + i));
Scene scn = new Scene(pn, 300, 500);
[Link]("We love buttons");
[Link](scn);
[Link](false);
[Link]();
}

34
Quiztime: We love horizontal buttons

35
Solution
@Override
public void start(Stage stg1) throws Exception {
HBox pn = new HBox();
[Link]([Link]);
[Link](20);
for(int i = 1; i <= 9; i++)
[Link]().add(new Button("Button " + i));
Scene scn = new Scene(pn, 800, 200);
[Link]("We love buttons");
[Link](scn);
[Link](false);
[Link]();
}

36
Toggle Buttons

37
Solution
@Override
public void start(Stage primaryStage) throws Exception {
[Link]("HBox Experiment 1");
ToggleButton toggleButton1 = new ToggleButton("Left");
HBox hbox = new HBox(toggleButton1);
Scene scene = new Scene(hbox, 200, 100);
[Link](scene);
[Link]();
}

38
JavaFX Labels and Images

39
Solution
public void start(Stage stg1) throws Exception {
VBox pn = new VBox();
[Link]([Link]);
[Link](20);
[Link]().add(new Label("Happy Ramadhan!"));
FileInputStream fis = new FileInputStream("pics/[Link]");
Image img = new Image(fis);
ImageView iv = new ImageView(img);
[Link](400);
[Link](true);
[Link]().add(iv);
Scene scn = new Scene(pn, 500, 500);
[Link]("Happy Ramadhan!");
[Link](scn);
[Link](false);
[Link]();
}
40
Quiztime: Create your own Happy Ramadhan (or
Merry X-Mas, or any greetings!)

41
ChoiceBox

42
ChoiceBox: Code
public void start(Stage stg1) throws Exception {
VBox pn = new VBox();
[Link]([Link]);
[Link](20);
[Link]().add(new Label("Pick your fav K-pop star!"));
String[] stars = {"Joo Ko-Wee", "Park Bo-Wow"};
ChoiceBox cb = new
ChoiceBox([Link](stars));
[Link]().add(cb);
Scene scn = new Scene(pn, 180, 150);
[Link](scn);
[Link](false);
[Link]();
}
43
TextField

44
TextField: Code
public void start(Stage stg1) throws Exception {
HBox pn = new HBox();
[Link]([Link]);
[Link](20);
[Link]().add(new Label("Who's fav K-pop star?"));
TextField tf = new TextField();
[Link](150);
[Link]().add(tf);
Scene scn = new Scene(pn, 300, 100);
[Link](scn);
[Link]();
}

45
CheckBox

46
CheckBox: Code
public void start(Stage stg1) throws Exception {
VBox pn = new VBox();
[Link]([Link]);
[Link](20);
[Link]().add(new Label("Who are your fav K-pop stars?"));
CheckBox cb1 = new CheckBox("Joo Ko-Wee");
CheckBox cb2 = new CheckBox("Park Bo-Wow");
CheckBox cb3 = new CheckBox("Sandiaga Yunho");
[Link]().add(cb1);
[Link]().add(cb2);
[Link]().add(cb3);
Scene scn = new Scene(pn, 200, 200);
[Link](scn);
[Link]();
}

47
Inspired by:
Liang, Introduction to Java, 10th edition, Pearson.
[Link]
Google

Common questions

Powered by AI

Loops and arrays in JavaFX facilitate dynamic UI creation by automating the generation of multiple UI elements. For instance, using a for-loop, multiple buttons can be generated and added to an HBox, ensuring a uniform style and alignment without repetitive coding. Similarly, a grid of circles can be created in nested loops, where each circle’s position and color attributes can be independently manipulated based on loop variables, resulting in dynamic and diverse UI layouts that enhance interactivity and aesthetic appeal .

JavaFX uses pane classes to manage the layout of UI components, impacting their arrangement significantly. A StackPane, for example, centers children components and stacks them, which is ideal for overlapping UI elements. A VBox aligns components vertically, adding spacing and alignment properties. This layout structuring ensures smooth transitions and spacing in components, contributing to a clean, organized, and aesthetically pleasing UI that can handle dynamic content changes effectively .

JavaFX's integration of layout and control features significantly benefits the development of user-friendly applications by providing versatile and intuitive layout managers like Pane, VBox, and HBox, which help in arranging controls seamlessly. Components like buttons, labels, and text fields come with built-in event handling and styling capabilities, allowing for the creation of interactive and visually appealing interfaces. The synergy between flexible layout management and rich controls enables developers to design interfaces that are both efficient in form and function, catering to diverse user requirements and enhancing overall usability .

In JavaFX, object-oriented principles are applied through classes, inheritance, and encapsulation. In the 'Hello, World!' example, JavaFX extends the Application class, demonstrating inheritance. This allows customization by overriding its start method. Encapsulation is employed through creating instances like Scene and Label within methods. Polymorphism is used when the Scene instance is set to Stage, a method that accepts a superclass type as parameter .

The Scene class is crucial in JavaFX for managing the graphical content efficiently. It acts as a container for the entire UI, holding a scene graph where nodes represent the actual UI components. This structure allows for coherent management of events, rendering, and state changes. A scene can be easily swapped or updated within a Stage, facilitating dynamic interface changes while conserving performance and responsiveness. This central control is foundational in maintaining a well-organized architecture for more complex GUIs .

JavaFX allows multiple stages to contain separate sets of GUI components such as buttons. In a multi-stage setup, each stage operates independently. User interaction is managed distinctly for each stage, meaning actions like clicking buttons or closing windows are handled per stage. This can enhance user experience by allowing parallel workflows, such as displaying additional information in separate, auxiliary stages rather than replacing content in a single window .

JavaFX supports multi-platform deployment by providing a single codebase capable of running on various environments. Applications built using JavaFX can be executed on desktops and web browsers, thanks to its underlying platform-agnostic architecture. This capability ensures broad reach and consistency across platforms, enabling developers to create applications once and deploy them across different systems without needing platform-specific modifications, thereby enhancing productivity and reducing developmental overhead .

Setting a Stage's resizable property to false in JavaFX prevents the user from resizing the window. This can be useful for maintaining a fixed aspect ratio or specific layout design. It ensures that the GUI components appear consistent in size and arrangement, which is crucial for interface stability, especially when precise positioning is required for usability reasons .

The scene graph in JavaFX is a data structure that allows for a hierarchical organization of all elements in a scene. It contributes to creating a responsive UI by enabling efficient rendering and event handling. For example, a StackPane manages layout by stacking children elements, allowing responsive alignment and distribution. Scenes containing buttons or shapes are dynamically adjusted based on their parents' size properties, supporting adaptive layouts responsive to user actions or window resizes .

JavaFX makes extensive use of color and shape to enhance the visual appeal of applications. In the circle example, properties like `setFill` and `setStroke` define the interior and border, adding aesthetic value through colors like Alice Blue and Bisque. For rectangles, size and color attributes contribute to visual hierarchy and emphasis. The use of RGB color models allows dynamic coloration, supporting interactive elements or thematic variations. These graphical elements greatly influence user interaction patterns and visual structure perception in applications .

You might also like