1. UNIT 1
JAVAFX 2.0

2. JavaFX Fundamentals
 The JavaFX 2.0 API is Java’s next generation GUI toolkit for
developers to build rich cross-platform applications.
 JavaFX 2.0 is based on a scene graph paradigm as opposed to the
traditional inmediate mode style rendering.
 Before the creation of JavaFX, the development of rich Internet
applications involved the gathering of many separate libraries and
APIs to achieve highly functional applications.
 These separate libraries include Media, UI controls, Web, 3D, and 2D
APIs.
 Because integrating these APIs together can be rather difficult, the
talented engineers at Sun Microsystems (now Oracle) created a new
set of JavaFX libraries that rool up all the same capabilities under
one roof.
 JavaFX 2.0 is a pure Java (language) API that allows developers to
leverage existing Java libraries and tools.

3. Installing Required Sotware
 You’ll need to install the following software in
order to get started with JavaFX:
– Java 7 JDK or greater
– JavaFX 2.0 SDK
– Neteans IDE 7.1 or greater
(http://download.oracle.com/javafx/2.0/system_requi
rements/jfxpub-system_requirements.htm)ñ

4. Creating a new Application

5. First Steps
 JavaFX applications extend the javafx.application..Application class. The Application
class provides application life cycle functions such as launching and stopping during
runtime.
 In our main() method’s entry point we launch the JavaFX application by simply passing in
the command line arguments to the Application.launch() method.
 Once the application is in a ready state, the framework internals will invoke the start()
method to begin.
 When the start() method is invoked, a JavaFX javafx.stage.Stage object is available for
the developer to use and manipulate.
public void start(Stage primaryStage) {
primaryStage.setTitle("Conceptos JavaFX 2.0");
Group root = new Group();
Scene scene = new Scene(root, 300, 250, Color.WHITE);
primaryStage.setScene(scene);
primaryStage.show();
}

6. First Steps
 Analogy with a theatre:
– Scene and Stage: There are one or many scenes, and all scenes are performed on a
stage.
 Stage is equivalent to an application window.
 Scene is a content pane capable of holding zero-to-many Node objects.
 A Node is a fundamental base class for all scene graph nodes to be rendered.
 Similar to a tree data structure, a scene graph will contain children nodes by using a
container class Group.
public void start(Stage primaryStage) {
primaryStage.setTitle("Conceptos JavaFX 2.0");
Group root = new Group();
Scene scene = new Scene(root, 300, 250, Color.WHITE);
primaryStage.setScene(scene);
primaryStage.show();
}

7. First Steps
 Once the child nodes have been added, we set the primaryStage’s (Stage)
scene and call the show() method on the Stage object to show the JavaFX
window.
public void start(Stage primaryStage) {
primaryStage.setTitle("Conceptos JavaFX 2.0");
Group root = new Group();
Scene scene = new Scene(root, 300, 250, Color.WHITE);
primaryStage.setScene(scene);
primaryStage.show();
}

8. Drawing Text
 To draw text in JavaFX you will be creating a javafx.scene.text.Text
node to be placed on the scene graph (javafx.scene.Scene).
Text text = new Text(100,100,"JavaFX 2.0");//Create a Text node.
//new Text(posX,posY,text to write)
root.getChildren().add(text); //Add a node in the tree.

9. Text Properties (I)
Rotation
 In the method setRotate(), we have
to specify the rotation angle (in degrees)
Text text = new Text(100,100,"JavaFX 2.0");//Create a Text node.
text.setRotate(45);
root.getChildren().add(text); //Add a node in the tree.

10. Text Properties (II)
Font. In each Text node you can create and set the font to be rendered onto the
scene grah.
Text text = new Text(105,50, "JavaFX 2.0");
Font f1 = Font.font("Serif", 30);
text.setFont(f1);

11. Creating Menus (I)
 Menus are standard ways on windowed platform applications to allow users to select
options.
 First, we create an instance of a MenuBar that will contain one to many menu (MenuItem)
objects.
 Secondly, we create menu (Menu) objects that contain one-to-many menu item
(MenuItem) objects and other Menu objects making submenus.
 Third, we create menu items to be added to Menu objects, such as menu (MenuItem).
MenuBar menuBar = new MenuBar(); //Creating a menubar
Menu menu = new Menu(“File”); //Creating first menu
MenuItem menuitem=new MenuItem(“New”); //Creating first item
menu.getItems().add(menuitem); //adding item to menu
menuBar.getMenus().add(menu); //adding menu to menubar
root.getChildren().add(menuBar); //adding menubar to the
//stage

12. Creating Menus (II)
 For adding an action when you select a menu Item:
menuitem.setOnAction(new EventHandler<ActionEvent>() {
public void handle(ActionEvent t) {
//action
}
});

13. Creating Menus (III). Example
MenuBar menuBar = new MenuBar();
Menu menu = new Menu("Opcion de Menú");
MenuItem menuitem1=new MenuItem("Opcion 1");
MenuItem menuitem2=new MenuItem("Opcion 2");
menuitem1.setOnAction(new EventHandler<ActionEvent>() {
public void handle(ActionEvent t) {
System.out.println("Opcion 1");
}
});
menuitem2.setOnAction(new EventHandler<ActionEvent>() {
public void handle(ActionEvent t) {
System.out.println("Opcion 2");
}
});
menu.getItems().add(menuitem1);
menu.getItems().add(menuitem2);
menuBar.getMenus().add(menu);
root.getChildren().add(menuBar);

14. Creating Menus (III). Example

15. Button (I)
 For adding a button:
 For adding a button with a description text:
 For adding an action for the button:
Button button1 = new Button();
Button button1 = new Button(“Description”);
button1.setOnAction(new EventHandler<ActionEvent>() {
@Override
public void handle(ActionEvent t) {
//action
}
});

16. Button (II)
 For setting the position of the button in the scene layout:
button1.setLayoutX(90);
button1.setLayoutY(150);

17. Button with images
 We can create a button with a description and a image:
 The ImageView class is a graph node (Node) used to display an already loaded
javafx.scene.image.Image object.
 Using the ImageView node will enable you to crete
special effects on the image to be displayed without
manipulating the physical Image.
Image img = new Image(getClass().getResourceAsStream("fuego.jpg"));
ImageView imgv= new ImageView(img);
imgv.setFitWidth(40); //We set a width for the image
imgv.setFitHeight(40); //We set a height for the image
Button boton1 = new Button("Generar Incendio",imgv);

18. Label (I)
 For adding a label:
Label l1 = new Label(“Label Description”);
l1.setLayoutX(90); //Setting the X position
l1.setLayoutY(60); //Setting the Y position
root.getChildren().add(l1);