Practical JavaFX: GUI Architecture for Beginners

The goal of this course is to help learners bridge the gap between basic programs and professional applications. This is achieved by building something found in the real world, a self-checkout machine, and by introducing more advanced concepts into the design. For example, real-world applications often use dependency injection (DI) for objects’ dependencies. We instead use a simpler method that achieves a similar purpose but also clarifies the usefulness of DI. We also dip our toes into component lifecycles and how subtle bugs can arise when components may be created and destroyed at any time. Therefore we crucially manage these lifecycles.

In part one of the course, we look at a basic JavaFX application and the fundamental tools at our disposal for building JavaFX UIs.

In part two, we dive into writing the self-checkout application, starting with an overview of the various classes and then building out the first two screens as well as creating a systematic way to navigate between them.

In part three, we create a virtual barcode scanner and hook it up to the main application using events. When a barcode is scanned, we look up the product and store this data in an appropriate place (the model). We make use of JavaFX properties, which are like supercharged variables. Properties enable us to bind the UI to the data so that the UI updates in real time. We also create custom UI components which are necessary to display scanned products to the customer in a clean and professional way.

In part four, we use CSS and stylesheets give the application a clean and consistent styling.

In part five, we move on to enabling payment. We create the payment screen along with the coin machine device. We calculate and display various figures such as the payment and the customer’s change using properties and bindings. We change the way money is represented to give us more control over its implementation. We introduce a lifecycle event to inform us of the destruction of our controllers to enable crucial clean-up. We create a mechanism for accepting or rejecting coins and giving the correct amount of change based on the coins available.

In part six, we create the receipt screen and receipt printer device. We pull the data from the model and format it into a suitable receipt and show it on the screen.