Java Client in Business

Java client technology is a staple in enterprise companies for internal applications. This is because it is great at building highly customized applications with complex controls like graphs, trees, tables, and Gantt charts. By building applications once and taking advantage of Java’s cross-platform capabilities, enterprises save on initial implementation cost as well as maintenance.

Common use cases for Java client technology in the industry are high-speed trading, train monitoring and scheduling, supply chain management, medical imaging, and inventory management. MINT systems make a training and resource management system (TRMS) that has been adopted by numerous commercial airlines such as Emirates Airlines, JetBlue Airways, Azul Linhas Aéreas Brasileiras, FedEx Express, Lufthansa Group, and the Avianca-Taca Group.¹

Figure 1-1 shows one of the more complex user interface screens from MINT TRMS. It makes use of trees, tables, ribbons, and Gantt charts implemented using JavaFX. This demonstrates a very complex view that would be challenging to implement in any other cross-platform technology.

To find out more about how you can easily build complex applications using pre-built JavaFX controls, check out Chapter 4, “JavaFX Controls Deep Dive.”

Target Mobile First

The utilization of smartphones has been increasing steadily since iPhone and Android came out in 2007 and 2008, respectively. As of 2018, mobile smartphones and tablets have overtaken the desktop in web traffic, accounting for 52.2% of all web requests as shown in Figure 1-4. As a result, mobile is not just an option, but a required interface for successful applications.

Smartphones have gotten to the point where they have the processing capability, memory, storage, and resolution to run full applications that were traditionally thought of as desktop-only. A tablet with a Bluetooth keyboard can easily be used as a desktop replacement for many use cases. Also, smartphones and tablets come with built-in Internet, which makes it possible to use them even where broadband is not available.

As a result, there is a rising number of “smartphone-dependent” users who only have Internet access through a phone, but do not have broadband that could be used for a desktop or laptop to connect. As shown in Figure 1-5, 28% of US millennials (18–29 years old) are smartphone dependent. This demographic will only be able to use your application if it has a mobile version available!

As discussed earlier, JavaFX has great mobile capabilities that are augmented by Gluon, who is an OpenJDK contributor. By using JavaFX mobile, you can write an application code base once and then target multiple screens including smartphones, tablets, and desktops. This gives your application a huge competitive advantage to desktop-only applications that do not allow users to take their work on the road with them. Find out more in Chapter 11, “Native Mobile Apps for iOS and Android”!

Build for the Cloud

The model for application backends has shifted from on-premise to the cloud. The reason for this is that there is an end user shift in expectations on how they interact with data. Historically, users would own and manage their data locally. With the rise of readily available high-speed connections, accessible encryption and security, and multiple screens per user, this expectation has changed. Now users expect data that is always online and available so it can be used from any device and easily shared and collaborated on.

A good example of this is eteoBoard, a digital collaborative scrum board built by Saxonia Systems AG in Germany. It is designed to solve the problem with distributed teams by creating an extended project team room across multiple locations. This is done by using teleconference equipment on large monitors and an electronic project board displayed on a large touchscreen monitor powered by JavaFX technology as shown in Figure 1-6.

The eteoBoard application uses SynchronizeFX¹² for real-time synchronization of the user interface state between multiple clients. All of the project data gets loaded to and stored from either Atlassian Jira or Microsoft Team Foundation Server, both of which are cloud-based agile lifecycle management packages with REST interfaces. From an end user standpoint, all of this is transparent, and they get an always up-to-date view of the current project data so they can focus on the progress of the team.

This demonstrates the user expectation shift that data is always online and available, which has necessitated the need for client applications to tightly integrate with cloud backends. For more information on how you can take advantage of the cloud in your client applications, check out the section “Building for the Cloud” in Chapter 9, “JavaFX, the Web, and Cloud Infrastructure.”

Package Your Platform

Desktop computers and even mobile devices have scaled to where hard disk and network transfer concerns are secondary to user experience. This is demonstrated by the steady increase in the size of the top ten mobile applications as shown in Figure 1-7, which averages over 1 GB. This means that small optimizations like having a shared Java runtime for all applications are not worth the extra steps, complexity, and failure scenarios.

Legacy technologies like Applets and Web Start are not recommended as a way to distribute your application. Since they rely on a shared Java runtime, a misconfigured system can easily result in the failure of an end user to run your application. Worse yet, these technologies introduce a security issue if not kept up-to-date. As a result, these are deprecated and should not be used.¹⁴

Instead, you should package everything your application needs as a single distribution. This includes the class files, libraries, and even the Java runtime required to run your application. While this may seem like a lot to include, it only costs an extra 20–30 MB on average and guarantees that your users will have a working Java runtime that is tested with the specific version of the application you are using.

Java 13 will reintroduce a tool called jpackager that takes care of bundling the Java runtime together with your application for distribution. You can find out more about this and other packaging solutions in Chapter 10, “Packaging Apps for the Desktop.” In addition, Chapter 11, “Native Mobile Apps for iOS and Android,” builds on this with information on packaging your mobile apps and releasing them in the app stores on iOS and Android devices.

Mac OS X JDK Installation

Again, substitute the right folder name for the version of OpenJDK you unzipped and enter your admin password since this is a protected folder.

Windows JDK Installation

Windows JDK comes as a zip file. To install it, unzip it to a suitable file location, such as C:/Program Files/Java/. If you have not previously installed a JDK, this folder may not exist, but can be created with admin privileges. The copy operation to this folder will also require admin privileges, which Windows should prompt you to confirm.

Next you need to create your JAVA_HOME environment variable that a lot of tools expect to be set. To do this, open the System Properties dialog where you can edit environment variables. This dialog is hidden fairly well on modern Windows operating systems, but can be reliably accessed via the run dialog by typing Windows-R and entering sysdm.cpl as shown in Figure 1-9.

Once the System Properties dialog is open, select the Advanced tab, and the dialog should be on the screen shown in Figure 1-10.

On this tab, click the “Environment Variables…” button. This will bring up the dialog shown in Figure 1-11 that allows you to create and edit environment variables.

In the Environment Variables dialog, we will create one new variable and modify the Path. To create a new variable, click the “New…” button under “System variables.” Call this variable “JAVA_HOME” and give it a value that is the location of your newly unzipped OpenJDK distribution. To avoid mistyping, you can use the “Browse Directory…” button to select the folder you created earlier. The exact value will vary based on your JDK version, but mine was “C:Program FilesJavajdk-12.0.1.”

Next, modify the Path environment variable to include a reference to the JDK bin folder. To do this, select the “Path” variable, which can be found under System variables and click “Edit…” You will be presented with a dialog like shown in Figure 1-12.

Click the “New” button and enter in “%JAVA_HOME%in” as the value. If you are on an earlier version of Windows, you may just have a simple text field with individual path elements separated by semicolons. If this is the case, just go to the end of the field and enter in the JDK bin value preceded by a semicolon. If you have a previous installation of Java, you may need to find the Path entry for that and delete it so it doesn’t override your new install. Once completed, click “OK” and exit the dialogs.

Linux JDK Installation

If you are on Linux, installing OpenJDK is a breeze. Most Linux distributions come with OpenJDK preinstalled, and it can be easily updated by running the appropriate command for your package managed.

If your newly installed Java distribution is not picked up as the default, you can use the update-alternatives command to modify the default Java version and add in your new OpenJDK distribution if it does not show up in the list.

JavaFX Installation

JavaFX no longer comes as a standard part of OpenJDK, so it must be downloaded and configured separately. The JavaFX SDK is built and packaged by Gluon, an official OpenJFX contributor. Their builds can be downloaded from https://gluonhq.com/products/javafx/, which is shown in Figure 1-13.

Choose the matching version of JavaFX for the OpenJDK version you installed earlier, which is JavaFX 12 as of the time of writing. You may need to scroll down past the “Long Term Support” builds section and find the “Latest Release” farther down on the page. Download the SDK for your platform of choice.

Once downloaded, unzip the JavaFX SDK to a directory of your choice. For the purpose of this book, we will assume you left it in your Downloads folder, but feel free to move it to a more permanent location.

Now your Java and JavaFX installation is all prepared, and you are ready to create a modern client application. We will walk you through the steps for your first client application in the next section.

Coding Client Apps with IntelliJ IDEA

It is possible to code JavaFX applications with any IDE of your choice, including IntelliJ, NetBeans, Eclipse, or Visual Code. However, we are going to introduce client development with IntelliJ Community Edition, which is the industry standard for coding in Java and entirely free for client development.

To download the latest version of IntelliJ, go to www.jetbrains.com/idea/ and click “Download.” This will take you to the download page shown in Figure 1-14 where you can choose to download the open source community edition for free.

After downloading, install IntelliJ and launch it. You will be given some options for configuring IntelliJ. Feel free to customize, but the defaults should be fine. Create a new project, and you will get the dialog shown in Figure 1-15.

It should automatically pick up the system JDK that you configured earlier. Here you can select Java FX in the left pane, and it will give you a JavaFX Application template. Click “Next” and choose a project name like “HelloModernWorld” and click “Finish.” This will open your project in a new window as shown in Figure 1-16.

The standard project creates a minimal JavaFX application that contains a Main class, a Controller, and an FXML file for the user interface. This project is not runnable yet since it cannot find the JavaFX libraries that we downloaded earlier, which is obvious from the red highlighting. To fix this, we need to add a module dependency on the JavaFX libraries.

In the “File” menu, choose “Project Structure…” to open the Project Settings dialog. Here, select “Modules” on the left and choose the “Dependencies” tab to get to the screen shown in Figure 1-17.

To add the JavaFX libraries, click the “+” symbol at the bottom of the pane and select “JARs or directories…” Then navigate to the OpenJFX JDK you downloaded and unzipped earlier and choose the “lib” folder. Click “OK,” and this will complete the dependency, fixing the syntax highlighting.

You can try running the application by going to the “Run” menu and choosing “Run ‘Main’,” but the configuration of JavaFX is not complete, and you will still get an error as shown in Figure 1-18.

To add in the missing runtime components, open the Configuration dialog by going to the “Run” menu and choosing “Edit Configurations…” This will open the dialog shown in Figure 1-17 where you can enter in VM options that get passed to the Java Virtual Machine.

Be sure to modify the module path to the correct location for your user (it must be fully qualified), the right version of the JavaFX SDK, and the platform-specific path separators. An easy way to make sure you get this right is to right-click the field and choose “Insert Path” so you get a standard file system picker and IntelliJ will create the right path format for your operating system.

Also note that we have only specified the javafx.controls and javafx.fxml modules. If your application requires additional modules, be sure to specify them in this comma-separated list. However, you often can exclude modules if they are automatically included by an inter-module dependency, such as javafx.base , that all the other modules depend upon.

Click “OK” to close this dialog and run your application again. This time the application should compile and execute with no errors; however, since it is just a stub, you will get an empty window as shown in Figure 1-19.

In the next section, we will show you how to modify this application to build a quick Hello Modern World application.

Rapid Application Development with Scene Builder

Scene Builder is a great tool to rapidly build modern client applications. It gives a WYSIWYG (what you see is what you get) visual representation of your application as you are building it with convenient palettes for layouts and controls and a properties editor for components you add to the scene graph. It also directly operates on FXML files as the intermediate format to declaratively specify your user interface without impacting your Java code.

The IntelliJ template already includes the boilerplate code to create a new application off of an FXML file, so we just need to edit the FXML file in Scene Builder to modify the user interface.

Scene Builder is also built, packaged, and distributed by Gluon, so we can download it from the same web site where we got JavaFX. Go to https://gluonhq.com/products/scene-builder/, and you will see a download page similar to Figure 1-20 where you can get the right version of Scene Builder for your operating system.

After installing and running Scene Builder, you will be presented with a welcome dialog where you can open an existing project. Navigate to your HelloModernWorld project folder, and choose the sample.fxml file that is in the src/sample directory.

This will open the basic Scene Builder user interface with your empty project as shown in Figure 1-21.

For this example, we are going to add in a couple components that show off the image and text capabilities of JavaFX. Start by clicking “Controls” on the left pane and dragging a new “ImageView” into the center pane to add it to the scene graph, which should add the image control as shown in Figure 1-22.

Place this file in the same folder as the FXML file and then select it in Scene Builder by updating the Image property on the right pane. To bring up the File Selection dialog, click the “…” button next to the text entry field.

To increase the size of the image, click “Layout” in the right field and delete the “Fit Width” and “Fit Height” values. This will change the layout to automatically scale to the size of the image that we imported rather than constraining it as shown in Figure 1-23.

Next, click “Containers” on the left and drag an AnchorPane as a child of the GridPane on the bottom-left “Hierarchy” pane. This will allow us to add additional controls that we can drag around Scene Builder and position freely.

Under the AnchorPane, you can add in a few different controls to write the text for your sample application. I recommend the Label control, which can be found under the Controls category in the top-left pane. To create the layout as shown in Figure 1-24, I added in three labels and modified the Font, Size, and Color as follows:

• Hello World: Font, Courier; Size, 96 px; Color, WHITE

• Java: Font, System; Size, 77 px; Color, #FFA518

• FX: Font, System; Size, 77 px; Color, #5382A1

And finally, to make the text pop out a bit, you can add a visual effect. Select the AnchorPane element in the “Hierarchy” pane and go to the “Modify” menu and choose the “Set Effect” submenu. In there are a selection of different effects you can apply to any element in the scene graph. Choose the “Bloom” effect, and you will get a distinct visual style.

Save your changes to the FXML file by going to the “File” menu and choosing “Save.” This will automatically update the file in your project and should allow you to immediately run your application and see the changes.

Now try running your project again. With the updates you made to the FXML file and Main.java class, you should be greeted with a modern Hello World example as shown in Figure 1-25.