JavaFX Getting Started Guide: Layouts, CSS, FXML, Animation & Deployment

JavaFX
Getting Started with JavaFX
Release 2.2.40
E20473-09
September 2013
Get started with JavaFX 2 by creating simple applications
that introduce you to layouts, CSS, FXML, visual effects,
animation, and deployment.

JavaFX Getting Started with JavaFX, Release 2.2.40
E20473-09
Copyright © 2008, 2013, Oracle and/or its affiliates. All rights reserved.
Primary Author: Gail Chappell
Contributing Author: Jasper Potts, Nancy Hildebrandt
This software and related documentation are provided under a license agreement containing restrictions on
use and disclosure and are protected by intellectual property laws. Except as expressly permitted in your
license agreement or allowed by law, you may not use, copy, reproduce, translate, broadcast, modify, license,
transmit, distribute, exhibit, perform, publish, or display any part, in any form, or by any means. Reverse
engineering, disassembly, or decompilation of this software, unless required by law for interoperability, is
prohibited.
The information contained herein is subject to change without notice and is not warranted to be error-free. If
you find any errors, please report them to us in writing.
If this is software or related documentation that is delivered to the U.S. Government or anyone licensing it
on behalf of the U.S. Government, the following notice is applicable:
U.S. GOVERNMENT END USERS: Oracle programs, including any operating system, integrated software,
any programs installed on the hardware, and/or documentation, delivered to U.S. Government end users
are “commercial computer software” pursuant to the applicable Federal Acquisition Regulation and
agency-specific supplemental regulations. As such, use, duplication, disclosure, modification, and
adaptation of the programs, including any operating system, integrated software, any programs installed on
the hardware, and/or documentation, shall be subject to license terms and license restrictions applicable to
the programs. No other rights are granted to the U.S. Government.
This software or hardware is developed for general use in a variety of information management
applications. It is not developed or intended for use in any inherently dangerous applications, including
applications that may create a risk of personal injury. If you use this software or hardware in dangerous
applications, then you shall be responsible to take all appropriate fail-safe, backup, redundancy, and other
measures to ensure its safe use. Oracle Corporation and its affiliates disclaim any liability for any damages
caused by use of this software or hardware in dangerous applications.
Oracle and Java are registered trademarks of Oracle and/or its affiliates. Other names may be trademarks of
their respective owners.
Intel and Intel Xeon are trademarks or registered trademarks of Intel Corporation. All SPARC trademarks
are used under license and are trademarks or registered trademarks of SPARC International, Inc. AMD,
Opteron, the AMD logo, and the AMD Opteron logo are trademarks or registered trademarks of Advanced
Micro Devices. UNIX is a registered trademark of The Open Group.
This software or hardware and documentation may provide access to or information on content, products,
and services from third parties. Oracle Corporation and its affiliates are not responsible for and expressly
disclaim all warranties of any kind with respect to third-party content, products, and services. Oracle
Corporation and its affiliates will not be responsible for any loss, costs, or damages incurred due to your
access to or use of third-party content, products, or services.

iii
Contents
1 Hello World, JavaFX Style
Construct the Application......................................................................................................................... 1-1
Run the Application................................................................................................................................... 1-3
Where to Go Next ....................................................................................................................................... 1-3
2 Creating a Form in JavaFX
Create the Project........................................................................................................................................ 2-1
Create a GridPane Layout......................................................................................................................... 2-2
Add Text, Labels, and Text Fields............................................................................................................ 2-2
Add a Button and Text ............................................................................................................................... 2-4
Add Code to Handle an Event ................................................................................................................. 2-5
Run the Application................................................................................................................................... 2-5
Where to Go from Here............................................................................................................................. 2-6
3 Fancy Forms with JavaFX CSS
Create the Project........................................................................................................................................ 3-1
Create the CSS File..................................................................................................................................... 3-2
Add a Background Image ......................................................................................................................... 3-2
Style the Labels........................................................................................................................................... 3-3
Style Text ...................................................................................................................................................... 3-4
Style the Button .......................................................................................................................................... 3-5
Where to Go from Here............................................................................................................................. 3-6
4 Using FXML to Create a User Interface
Set Up the Project ....................................................................................................................................... 4-1
Load the FXML Source File ...................................................................................................................... 4-2
Modify the Import Statements ................................................................................................................ 4-2
Create a GridPane Layout......................................................................................................................... 4-3
Add Text and Password Fields................................................................................................................. 4-3
Add a Button and Text ............................................................................................................................... 4-4
Add Code to Handle an Event ................................................................................................................. 4-5
Use a Scripting Language to Handle Events......................................................................................... 4-6
Style the Application with CSS............................................................................................................... 4-7
Where to Go from Here............................................................................................................................. 4-8

iv
5 Animation and Visual Effects in JavaFX
Set Up the Application .............................................................................................................................. 5-2
Set Up the Project ....................................................................................................................................... 5-2
Add Graphics .............................................................................................................................................. 5-3
Add a Visual Effect..................................................................................................................................... 5-4
Create a Background Gradient ................................................................................................................ 5-5
Apply a Blend Mode.................................................................................................................................. 5-6
Add Animation ........................................................................................................................................... 5-7
Where to Go from Here............................................................................................................................. 5-8
6 Deploying Your First JavaFX Application
Deployment Modes.................................................................................................................................... 6-1
Packaging the Application in NetBeans IDE........................................................................................ 6-1
Sizing the Application Window .........................................................................................................6-3
Running the Application Outside NetBeans IDE................................................................................ 6-3
Deploying the Packaged Files.................................................................................................................. 6-4
Other Ways to Package JavaFX Applications........................................................................................ 6-4

Part I
Part I About This Tutorial
This collection of tutorials is designed to get you started with common JavaFX tasks,
including working with layouts, controls, style sheets, and visual effects.
Hello World, JavaFX Style Form Design in JavaFX Fancy Design with CSS
User Interface Design with
FXML Animated Shapes and Visual Effects Deployment Quickstart