Transcript ppt - Dr. Wissam Fawaz

Java FX
Introduction

Java FX

New framework for developing GUI-based apps

Replaces AWT and Swing

Enables the development of

RIA (Rich Internet Applications)

Web apps with features similar to those of desktop apps

Provides a multi-touch support

Has built-in

Animation, video and audio playback support
Anatomy of a JavaFX
Application

Main building blocks

Stage


Scene


equivalent to “JFrame”
equivalent of “JPanel”
Nodes

equivalent to “GUI components of Swing and AWT”

Event handlers

Timelines and transitions for animation purposes
Panes, UI controls, and Shapes
Layout Panes
Flow Pane

Example:
Grid Pane

Example:
Border Pane

Example:
HBox

Example:
VBox

Example:
Property binding

A new concept introduced in JAVAFX, whereby

A target object is bound to a source object

Target object is called “binding property” and


The source object is called “Observable object” and


Implements “Property” interface
Implements “ObservableValue” interface
Binding properties are defined

for primitive data types and String

double/…/boolean => DoubleProperty/…/BooleanProperty

String => StringProperty
Common Properties and
Methods for Nodes

Nodes share


Style and rotate properties
The style properties are similar to CSS

The style is defined with a prefix –fx-

Multiple style properties can be set together


Example: : circle.setStyle(“-fx-stroke:black;
-fx-fill: red;”);
The rotate property

Specifies an angle in degrees for rotating the node

Example: button.setRotate(80);
Drawing Text

Text is created using the Text class


The latter is derived from the Shape super-class
In the “DrawingTextDemo” Eclipse project

Text objects with

random colors and positions are scattered about a Scene area
Color

Opacity

Defines the transparency of a color

With the range 0.0 (completely transparent) to 1.0 (opaque)
Font

Font is defined by

Name, weight (bold), posture (italic/regular), and size
Image and ImageView


The Image class

Represents a graphical image and

Use to load an image from a specified URL
The ImageView is a node


For displaying an image
Example:
Event handlers in Java FX

A handler in JavaFX

Must satisfy the following requirements

It must implement the


EventHandler<T extends Event> interface
It must be registered with the event source
Events and Event sources
Events Details
Case Study2: Control Circle

Application

Uses two buttons to

Control the size of a circle