1 1

1. 11 • JavaFX GUI Programming

2. Reference Book • This chapter is based on Chapter 34 and 35 of • Java the Complete Reference,9th Ed. (JCR-9e) • by Herbert Schildt • Oracle Press

3. Outline • JavaFX Basic Concepts

4. JavaFX Basic Concepts • JavaFX Basic Concepts

5. JavaFX Packages • packages - begin with the javafx prefix • more than 30 JavaFX packages • examples: javafx.application, javafx.stage, javafx.scene, and javafx.scene.layout.

6. Stage and Scane Classes • central metaphor stage • contains a scene • a stage defines - a space and a scene • container for scenes • a scene • container for the items - comprise the scene • all JavaFX applications • have at least one stage and one scene • Stage and Scene classes • add at least one Scene object to a Stage

7. Stage • top-level container. • automatically have access to one Stage • - primary stage. • supplied - run-time system when a JavaFX application is started. • can create other stages, • primary stage - only one - required

8. Scane • container for the items that comprise the scene. • controls, such as push buttons and check boxes, text, and graphics. • add those elements to an instance of Scene

9. Nodes and Scane Graphs • individual elements - scene – nodes • e.g.:, a push button control • also consist of groups of nodes • can have a child node. • parent node or branch node. • Nodes without children - terminal nodes called leaves • collection of all nodes in a scene - scene graph, comprises a tree.

10. The Root Node • special type of node - scene graph, - root node. • top-level node • only node in the scene graph does not have a parent. • all other nodes have parents, • all nodes directly or indirectly • descend from the root node • base class for all nodes - Node. • subclasses e.g.:Parent, Group, Region, and Control,

11. Layouts • several layout panes • manage placing elements in a scene. e.g.: • FlowPane class - a flow layout • GridPane class - a row/column grid-based layout. BorderPane • layout panes - packaged in javafx.scene.layout.

12. The Application Class and the Life-cycle Methods • A JavaFX application must be a subclass of the Application class • packaged - javafx.application • application class extends Application. • Application class defines three life-cycle methods override • init( ), start( ), stop( ), void init( ) abstract void start(Stage primaryStage) void stop( ) • The

13. The init() Method • called when the application begins execution • perform various initializations. • cannot be used to create a stage or • build a scene. • no initializations required, • need not be overridden because

14. The start() Method • called after init( ). • application begins • construct and set the scene • it is passed a reference to a Stage object • provided by the run-time system - primary stage. • abstract. - must be overridden

15. The stop() Method • called when an application terminated • handle any cleanup or shutdown chores. • in casees no such actions are needed, • an empty, default version is provided.

16. Launching a JavaFX Application • To start JavaFX application -call the launch( ) method public static void launch(String ... args) • args:possibly empty list of strings that typically specify command-line arguments. • causes the application to be constructed, • followed by calls to init( ) and start( ). • will not return until after the application has terminated. • starts the subclass of Application from which launch( ) is called. • The second form of launch( ) lets you specify a class other than the enclosing class to start.

17. A JavaFX Application Skeleton • All JavaFX applications share the same basic skeleton. • also illustrates • how to launch the application • demonstrates • when the life-cycle methods are called. • A message noting when each life-cycle method is called is displayed on the console.

18. // A JavaFX application skeleton. import javafx.application.*; import javafx.scene.*; import javafx.stage.*; import javafx.scene.layout.*; public class JavaFXSkel extends Application { public static void main(String[] args) { System.out.println("Launching JavaFX application."); // Start the JavaFX application // by calling launch(). launch(args); }

19. // Override the init() method. public void init() { System.out.println("Inside the init() method."); } // Override the stop() method. public void stop() { System.out.println("Inside the stop() method."); }

20. // Override the start() method. public void start(Stage myStage) { System.out.println("Inside the start() method."); // Give the stage a title. myStage.setTitle("JavaFX Skeleton."); // Create a root node. // In this case, a flow layout pane // is used, but several alternatives exist. FlowPane rootNode = new FlowPane();

21. // Create a scene. Scene myScene = new Scene(rootNode, 300, 200); // Set the scene on the stage. myStage.setScene(myScene); // Show the stage and its scene. myStage.show(); } }

22. The window Produced

23. Output on the Console Launching JavaFX application. Inside the init() method. Inside the start() method. • When close the window, • this message is displayed on the console: Inside the stop() method.

24. Explanations • in a real program: • would not output anything to System.out • here simply to illustrate when each method is called. • Furthermore, • override init( ) and stop( ) • perform special startup or shutdown actions.

25. The init() Method • When the application begins, the init( ) method is called first by the JavaFX run-time system. • would normally used to initialize some aspect of the application • init( ) cannot be used to create the stage or scene • these items constructed and displayed by the start( ) method.

26. The start() Method • After init( ) finishes, the start( ) method executes. • initial scene is created and set to the primary stage. • parameter of type Stage • When start( ) is called, this parameter will receive a • reference to the primary stage of the application. • this stage - set a scene

27. Root Node • a root node for a scene is created • only node in a scene graph - does not have a parent • a FlowPane used for the root node, • several other classes FlowPane rootNode = new FlowPane(); • layout manager - uses a flow layout • elements positioned line-by-line, with lines wrapping as needed. • In this case, a horizontal flow is used, • possible to specify: vertical flow. • other layout properties, such as • a vertical and horizontal gap between elements • an alignment

28. Constract a Scane • use the root node to construct a Scene: Scene myScene = new Scene(rootNode, 300, 200); • creates a scene that • has the specified root with the specified width and height. Scene(Parent rootnode, double width, double height) • type of rootnode is Parent -subclass of Node • encapsulates nodes that can have children.

29. Setting Scane • sets myScene as the scene for myStage: myStage.setScene(myScene); • In cases: don’t make further use of the scene, • combine the previous two steps: : myStage.setScene(new Scene(rootNode, 300, 200)); • displays the stage and its scene: myStage.show(); • shows the window that was created by the stage and screen.

30. Closing the Window • closeng the application, its window is removed from the screen • stop( ) method is called by the JavaFX run-time system.

31. A Simple JavaFX Control: Label • primary ingredient - user interfaces - control • enables the user to interact with the application. • simplest control - label • just displays a message - text. • JavaFX label - instance of the Label class, • packaged in javafx.scene.control. • Label defines three constructors. Label(String str) • str is the string that is displayed.

32. Once created a label (or any other control), • it must be added to the scene’s content, • adding it to the scene graph. • call getChildren( ) • on the root node of the scene graph

33. getChildren() Method • It returns a list of the child nodes in the form of an • ObservableList<Node>. • inherits java.util.List, • supports all features available to a list • Using the returned list of child nodes, • add the label to the list • calling add( ),

34. // Demonstrate a JavaFX label. import javafx.application.*; import javafx.scene.*; import javafx.stage.*; import javafx.scene.layout.*; import javafx.scene.control.*; public class JavaFXLabelDemo extends Application { public static void main(String[] args) { // Start the JavaFX application by calling launch(). launch(args); }

35. // Override the start() method. public void start(Stage myStage) { // Give the stage a title. myStage.setTitle("Demonstrate a JavaFX label."); // Use a FlowPane for the root node. FlowPane rootNode = new FlowPane(); // Create a scene. Scene myScene = new Scene(rootNode, 300, 200); // Set the scene on the stage. myStage.setScene(myScene);

36. // Create a label. Label myLabel = new Label("This is a JavaFX label"); // Add the label to the scene graph. rootNode.getChildren().add(myLabel); // Show the stage and its scene. myStage.show(); } }

37. The window Produced

38. rootNode.getChildren().add(myLabel); • adds the label to the list of children • rootNode is the parent. • ObservableList – method: addAll( ) • add two or more children to the scene graph in a single call. • To remove a control from the scene graph, call • remove( ) on the ObservableList. • e.g., rootNode.getChildren().remove(myLabel); • removes myLabel from the scene.

39. Using Buttons and Events • most GUI controls generate events • handled by programs. • e.g., buttons, check boxes, and lists all generate events when they are used

40. Event Basics • The base class - JavaFX events - Event class, • packaged - javafx.event. • Event inherits java.util.EventObject, • Several subclasses of Event: • ActionEvent. • handles action events generated by a button.

41. Handling Events • the delegation event model approach to event handling • To handle an event, • first register the handler that acts as a listener for the event. • When the event occurs, the listener is called. • It must then respond to the event • and return..

42. Events are handled by implementing the EventHandler interface, which is also in javafx.event. • generic interface with the following form: interface EventHandler<T extends Event> • Here, T specifies the type of event that the handler will handle. • defines one method, handle( ), • receives the event object as a parameter: void handle(T eventObj)

43. Here, eventObj is the event that was generated. Typically, event handlers are implemented • through anonymous inner classes or lambda expressions, • use stand-alone classes, if more appropriate (for example, if one • event handler will handle events from more than one source).

44. Source of an Event • sometimes useful to know • the source of an event • one handler to handle events from different sources. • obtain source of the event calling getSource( ), • inherited from java.util.EventObject. • Object getSource( )

45. Button Control • In JavaFX, the push button control - Button class, in javafx.scene.control. • Button inherits a fairly long list of base classes including ButtonBase, Labeled, Region, Control, Parent, and Node. • much of its functionality comes from its base classes. • in default form. • can contain text,, graphics, or both.

46. Button defines three constructors. : Button(String str) • str is the message that is displayed in the button. • When a button is pressed, - ActionEvent is generated. • packaged in javafx.event. • register a listener for this event using setOnAction( ), • general form: final void setOnAction(EventHandler<ActionEvent> handler) • handler::handler being registered.

47. use an anonymous inner class or lambda expression for the handler. • setOnAction( ) method • sets the property onAction, • stores a reference to the handler.

48. Demonstrating Event Handling and the Button // Demonstrate JavaFX events and buttons. import javafx.application.*; import javafx.scene.*; import javafx.stage.*; import javafx.scene.layout.*; import javafx.scene.control.*; import javafx.event.*; import javafx.geometry.*; public class JavaFXEventDemo extends Application { Label response; public static void main(String[] args) { // Start the JavaFX application by calling launch(). launch(args); }

49. // Override the start() method. public void start(Stage myStage) { // Give the stage a title. myStage.setTitle("Demonstrate JavaFX Buttons and Events."); // Use a FlowPane for the root node. In this case, // vertical and horizontal gaps of 10. FlowPane rootNode = new FlowPane(10, 10); // Center the controls in the scene. rootNode.setAlignment(Pos.CENTER); // Create a scene. Scene myScene = new Scene

50. // Set the scene on the stage. myStage.setScene(myScene); // Create a label. response = new Label("Push a Button"); // Create two push buttons. Button btnAlpha = new Button("Alpha"); Button btnBeta = new Button("Beta");