Java Class

Time actually goes flying when you enjoy what you’re doing. I just had my second test on Java a few days ago and now I’m in charge of creating a final project(HTML editor) in order to pass the class with a good grade – at least that’s what I tell myself -. The class itself was easy but not as easy if you compare it with any of my previous C++ classes; I actually felt a bit challenged with Java but it seems I have finally understood some of its syntax.

I wanted to create something simple but complex at the same time, thankfully when I was thinking about it, I had my Net Beans IDE opened as well and it was what gave me the final answer, I was going to create a HTML Editor.

What’s Next?

So what do I need to create it? Well, the first thing was creating a simple layout with the help of BorderPane, this would allow me to create a fourth divs layout; one div in the top, two on the left and right and a last one in the bottom:
html editor

import javafx.application.Application;
import static javafx.application.Application.launch;
import javafx.scene.Scene;
import javafx.stage.Stage;
import javafx.scene.layout.BorderPane;

public class FinalProject extends Application {
    
    @Override
    public void start(Stage primaryStage) {
        // Border Pane
        BorderPane borderPane = new BorderPane();
        borderPane.setTop();
        borderPane.setLeft();
        borderPane.setCenter(splitPane);
        borderPane.setRight();
        borderPane.setBottom();
        
        Scene scene = new Scene(borderPane);

        primaryStage.setScene(scene);
        primaryStage.setFullScreen(false);
        primaryStage.setTitle("HTML Editor");

        primaryStage.show();
    }

    public static void main(String[] args) {
        launch(args);
    }
}

Once I had this done the next step was to fill it up with the rest of tools I needed; I did that and end up with this:

/**
 *
 * Final Project: HTML Editor
 * @author kevin.azuarafonseca
 */
import javafx.application.Application;
import static javafx.application.Application.launch;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.stage.Stage;
import javafx.scene.control.SplitPane;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.VBox;
import javafx.scene.web.WebEngine;
import javafx.scene.web.WebView;
import javafx.scene.control.TextArea;
import javafx.scene.control.ToolBar;
import javafx.scene.layout.Priority;

public class FinalProject extends Application {
    
    @Override
    public void start(Stage primaryStage) {
        // Border Pane
        BorderPane borderPane = new BorderPane();
        // Toolbar
        ToolBar toolBar = new ToolBar();
        // Button
        Button button = new Button("Preview HTML");
        // SplitPane && Text Area
        SplitPane splitPane = new SplitPane();
        final TextArea htmlCode = new TextArea();
        htmlCode.setWrapText(false);
        htmlCode.setText("This is a basic html editor");
        // Web Engine
        WebView webView = new WebView();
        WebEngine webEngine = webView.getEngine();
        // VBOX
        VBox leftView  = new VBox(htmlCode);
        VBox rightView = new VBox(webView);
        leftView.setVgrow(htmlCode, Priority.ALWAYS); // Make full height
        rightView.setVgrow(webView, Priority.ALWAYS); // Make it full height
        
        // Load HTML into webEngine after onClick has been successful
        button.setOnAction(action -> {
            webEngine.loadContent(htmlCode.getText(), "text/html");
        });
        
        splitPane.getItems().addAll(leftView, rightView);
        
        toolBar.getItems().add(button);
        borderPane.setTop(toolBar);
        borderPane.setCenter(splitPane);
        
        Scene scene = new Scene(borderPane);

        primaryStage.setScene(scene);
        primaryStage.setFullScreen(false);
        primaryStage.setTitle("HTML Editor");

        primaryStage.show();
    }

    public static void main(String[] args) {
        launch(args);
    }
}

This would be the final program:

html editor

This is an example of how complex you can make it work. Right now it is still a beta-version but I will continue working on it and hopefully can work as a base for any JavaFX developer looking into creating a IDE software:

html editor

Leave a Reply

Back to Top