JavaFx : Tutorial Series - part 3

Creating UI using FXML and Scene Builder

You can use FXML to create any user interface, FXML is particularly useful for user interfaces that have large, complex scene graphs, forms, data entry, or complex animation. FXML is also well-suited for defining static layouts such as forms, controls, and tables. In addition, you can use FXML to construct dynamic layouts by including scripts.

We use the scene builder tool to create FXML. Scene Builder is a GUI tool which generates FXML.

Open Sample.fxml

1.) In your project double click on Sample.fxml

2.) The file is automatically opened in Scene Builder.

3.) Drag and drop the elements from library to workspace to create GUI.

4.) FXML is not a compiled language so you can preview it by pressing ctrl+p.

Next :- JavaFx : Tutorial Series - part 3 ( Controls )

JavaFx : Tutorial Series - part 2

Structure of JavaFX application 

     Every JavaFX application's main Class extends the Application Class and Override the start(Stage stage) Method. Start Method is entry point of Application. Stage is the the top most container which contains UI components, whether it is deployed on desktop,within a browser, or other Devices.

    Stage class has set of properties and methods.

 1.) A Scene - It contains the graphical nodes in the user interface.
 2.) A title - appears in the title bar of the window(when deployed on the desktop).
 3.)Width, Hight, X, Y, Opacity, fullScreen etc.

Using Stage Class

Add following method calls in your application ....

 public void start(Stage stage) throws Exception {
        Parent root = FXMLLoader.load(getClass().getResource("Sample.fxml")); //load the ui from fxml file
        
        Scene scene = new Scene(root); //A scene container
        
        stage.setScene(scene); //add the scene to stage
        stage.setTitle("My First JavaFX App"); //set the title of stage
        stage.setWidth(500); //width of stage
        stage.setHeight(500); //height of stage
        stage.setOpacity(.8); //Transparency of stage 0 for fully transparent 1 for no transparency.
        stage.show();
    }

Next:- JavaFx : Tutorial Series - part 3

JavaFx : Tutorial Series - part 1

JavaFx is API of java which is designed to develop Rich Internet Application. It is used to create very dynamic and attractive java applications. JavaFx uses CSS for styling GUI of java application. If one want to separate presentation of ui and back-end logic it can be done via a scripting language called FXML.

Actually it is very similar to web Programing in the sense that it uses CSS for styling like web Programming, FXML for presentation like HTML and JAVA for back-end logic like JAVASCRIPT do in web Programming.

Tools 

To develop JavaFX application following tools are needed..

1. Latest JDK 7
2. JRE 7
3. IDE NetBeans 7.2 or above or Eclips
4. JavaFx Scene Builder

First Java Application 

1 . Open NetBeans and click on New Project.

2. Select JavaFX --> JavaFX FXML Application & click Next.

3. Enter name of Project And click Finish.

4. Run your project to see sample application Hello world example.

JavaFX Sample

JavaFx : Tutorial Series - part 2