Learning JavaFX GUI Development

2h 12mBeginner2024-11-18

Authors

Peggy Fisher

Programmer, Content Manager at LinkedIn Learning

Course details

JavaFX is the standard tool for GUI development (replacing Swing in Java SE), and the next step in the evolution of Java. Learn how to use JavaFX to develop your own interfaces for enterprise apps in these lessons from Peggy Fisher, our in-house programming expert. She explains how JavaFX connects to other Java APIs, how to use FXML to separate the UI design from the application logic, and how to draw lines and shapes with the 2D class objects. To make your GUIs more interactive, she shows how to apply effects and add images, charts, and animation to your JavaFX projects. Finally, learn how to integrate CSS to customize your JavaFX interface designs. Challenges issued along the way allow you to test your new JavaFX skills as you build them.

Learning objectives
What is JavaFX?
Creating a simple JavaFX program
Drawing lines, shapes, and text
Applying effects
Adding and animating images and charts
Customizing interfaces with CSS

Skills covered

JavaFXSoftware DesignJavaProgramming FoundationsOracleSoftware Development ToolsLearningSoftware Development

Concepts

Introduction

The power of JavaFX GUI development
What you should know before watching
How to use the exercise files
Challenges explained

Get Started with JavaFX

What is JavaFX
Overview of JavaFX architecture
The JavaFX scene graph

Sample Applications

Create a simple JavaFX program
Add form controls
Add CSS to style a form
Set up an interface design
Challenge - Use FXML to let a user ask a question
Solution - Use FXML to let a user ask a question

Drawing

Draw lines and shapes
Blend shapes
Draw text
Apply text effects
Challenge - Create a scene with random shapes and colors
Solution - Create a scene with random shapes and colors

User Interface Components

Lay out a user interface
Add controls to the user interface
Use UI control event handlers
Include a menu
Provide a ListView for user selections
Use a TableView to display data
Challenge - Create a customer user interface challenge
Solution - Create a customer user interface challenge

Graphics

Add an image
Animate using transformations
Add charts for better visualization
Challenge - Create a bar chart
Solution Create a bar chart

Custom UIs

Apply CSS themes
Use selectors
Create style rules
Challenge - Create a CSS file with styles
Solution - Create a CSS file with styles

Conclusion

Next steps