Can we create GUI for standalone application using html and javascript?

Question

I have a Java program which until now used to get the input from command line and then proceed accordingly.

Now, I want to have a basic GUI for this. It will need a few buttons which will trigger the events. I am experienced in HTML and JavaScript. Is it possible to write in HTML (or similar syntax) to generate the GUI?

I don't want to go in Swing and awt solution, because I would rather concentrate on the main program than on the GUI.

Solution 1

Here's another alternative. See also How to Use HTML in Swing Components.

import java.awt.EventQueue;
import java.awt.FlowLayout;
import java.awt.GridLayout;
import java.awt.event.ActionEvent;
import java.io.File;
import javax.swing.AbstractAction;
import javax.swing.JButton;
import javax.swing.JFileChooser;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JPanel;
import javax.swing.JTextField;

/**
 * @see http://stackoverflow.com/a/10067256/230513
 * @see http://stackoverflow.com/a/7454691/230513
 */
public class Pathfinder extends JPanel {

    private static final int TEXT_SIZE = 32;
    private JTextField srcField = new JTextField(TEXT_SIZE);
    private JTextField dstField = new JTextField(TEXT_SIZE);
    private JTextField valueField1 = new JTextField(TEXT_SIZE);
    private JTextField valueField2 = new JTextField(TEXT_SIZE);
    private String srcPath, dstPath, value1, value2;

    public Pathfinder() {
        super(new GridLayout(0, 1));
        this.add(createPathPanel("Source Directory", srcField));
        this.add(createPathPanel("Target Directory", dstField));
        this.add(createFieldPanel("Some Value:", valueField1));
        this.add(createFieldPanel("Another Value:", valueField2));
        JPanel submitPanel = new JPanel();
        submitPanel.add(new JButton(new AbstractAction("Submit") {

            @Override
            public void actionPerformed(ActionEvent e) {
                srcPath = srcField.getText();
                dstPath = dstField.getText();
                value1 = valueField1.getText();
                value2 = valueField2.getText();
                process();
            }
        }));
        this.add(submitPanel);
    }

    private void process() {
        // see ProcessBuilder http://stackoverflow.com/questions/5740390
        System.out.println(srcPath);
        System.out.println(dstPath);
        System.out.println(value1);
        System.out.println(value2);
    }

    private JPanel createPathPanel(String name, final JTextField jtf) {
        JPanel panel = new JPanel(new FlowLayout(FlowLayout.TRAILING));
        panel.add(new JButton(new AbstractAction(name) {

            @Override
            public void actionPerformed(ActionEvent e) {
                JFileChooser jfc = new JFileChooser(
                    new File(System.getProperty("user.dir")));
                jfc.setFileSelectionMode(JFileChooser.DIRECTORIES_ONLY);
                int result = jfc.showOpenDialog(Pathfinder.this);
                if (result == JFileChooser.APPROVE_OPTION) {
                    jtf.setText(jfc.getSelectedFile().getPath());
                }
            }
        }));
        panel.add(jtf);
        return panel;
    }

    private JPanel createFieldPanel(String name, JTextField jtf) {
        JPanel panel = new JPanel(new FlowLayout(FlowLayout.TRAILING));
        panel.add(new JLabel(name));
        panel.add(jtf);
        return panel;
    }

    private void display() {
        JFrame f = new JFrame("Pathfinder");
        f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        f.add(this);
        f.pack();
        f.setLocationRelativeTo(null);
        f.setVisible(true);
    }

    public static void main(final String[] args) {

        EventQueue.invokeLater(new Runnable() {

            @Override
            public void run() {
                Pathfinder pf = new Pathfinder();
                if (args.length > 0) {
                    pf.srcPath = args[0];
                    pf.dstPath = args[1];
                    pf.process();
                } else {
                    pf.display();
                }
            }
        });
    }
}

Solution 2

I want to have a basic GUI for this. It will need a few buttons which will trigger the events.

This 'basic GUI' goes slightly beyond the spec. to add an output area.

import java.awt.*;
import javax.swing.*;

class SimpleEventGUI {

    SimpleEventGUI() {
        JPanel gui = new JPanel(new BorderLayout());
        JToolBar toolBar = new JToolBar();
        for (int ii=1; ii<6; ii++) {
            toolBar.add(new JButton("Event " + ii));
            if (ii%2==0) {
                toolBar.addSeparator();
            }
        }
        gui.add(toolBar, BorderLayout.NORTH);
        gui.add( new JScrollPane(new JTextArea(5,30)), BorderLayout.CENTER );

        JOptionPane.showMessageDialog(null, gui);
    }

    public static void main(String[] args) {

        EventQueue.invokeLater(new Runnable() {
            @Override
            public void run() {
                new SimpleEventGUI();
            }
        });
    }
}

Solution 3

You may consider Google Web Toolkit with Window Builder which allow you to build a rich internet interface using Java and interact with the existing logic.

If you want something quick, you can build a Swing GUI using Window Builder

Comments

[Rakesh Juyal]

Great, I think this is what I was expecting. Would you please tell me If I create the GUI using GWT + Window Builder, then what will be the prerequisite of my code to run on user system.

[Momo]

It's like any Java web application, you need to host your application on a web server with a Servlet container as Tomcat and the application should run on any Browser.

[Andrew Thompson]

@trashgod +1 for the screenshot. Thanks. :)

[Rakesh Juyal]

That was, I must say, dead simple. :) +1