Java - Doing large scale GUI projects

Question

To get right directly to my question.

How do you do large scale GUI projects. I have not done any larger GUI projects in java so far but what i am working on now grew pretty fast and pretty big and now i am stuck whit a huge pile of code that is really annoying and messy.

Since i come from field of web development i am used to MVC frameworks so i have 3 packages in my projects Model where i keep classes that interact whit files or db, Views where i keep my classes for Forms or GUI and Controller package where i keep the majority of my logic.

I have been told to separate my logic as well keep actions in one class and listeners in another class but i have no idea how to link all that up.

So far i only have 1 Controller class where i execute all the methods regarding whats happening on the GUI once its invoked.

package pft.controller;


import java.io.IOException;
import java.util.logging.Level;
import java.util.logging.Logger;
import javax.swing.JLabel;
import javax.swing.JComboBox;
import javax.swing.JTree;
import java.awt.event.*;
import javax.swing.JProgressBar;
import pft.view.Invoke_GUI;
import pft.model.Events;
import pft.model.Parse;

public class Tower_Controller {

    public Tower_Controller() {
    }
    //Global variables
    String isSelected = null;
    int hasModules = 0;
    int cap = 0;
    int cpu = 0;
    int shield = 0;
    int armor = 0;

    public void setName(String name){
        this.isSelected = name;
    }

    public String getName(){
        return this.isSelected;
    }

    public void setCap(int cap){
        this.cap = cap;
    }

    public int getCap(){
        return this.cap;
    }

    public void setCpu(int cpu){
        this.cpu = cpu;
    }

    public int getCpu(){
        return this.cpu;
    }

    public void setShield(int shield){
        this.shield = shield;
    }

    public int getShield(){
        return this.shield;
    }

    public void setArmor(int armor){
        this.armor = armor;
    }

    public int getArmor(){
        return this.armor;
    }


    public void invoke() throws IOException {
        Invoke_GUI runnable = new Invoke_GUI();
        final JLabel tower_name = runnable.tower_name;
        final JComboBox tower_select = runnable.tower_select;
        final JTree module_browser = runnable.module_browser;
        final JTree selected_modules = runnable.selected_modules;

        final JProgressBar cap_bar = runnable.cap_bar;
        final JProgressBar cpu_bar = runnable.cpu_bar;

        final JLabel em_res = runnable.em;
        final JLabel th_res = runnable.thermic;
        final JLabel ki_res = runnable.kinetic;
        final JLabel ex_res = runnable.explosive;

        setTowerName(tower_name, tower_select);
        removeTower(tower_name);
        runnable.setVisible(true);       

    }

    public void removeTower(final JLabel tower_name) {
        tower_name.addMouseListener(new MouseListener() {

            @Override
            public void mouseClicked(MouseEvent e) {
                if (hasModules == 1 & isSelected != null) {
                    Events evt = new Events();
                    evt.towerHasModules();
                } else if (isSelected == null) {
                } else {
                    tower_name.setText("No Control Tower selected");
                    isSelected = null;
                }
            }

            @Override
            public void mousePressed(MouseEvent e) {
            }

            @Override
            public void mouseReleased(MouseEvent e) {
            }

            @Override
            public void mouseEntered(MouseEvent e) {
            }

            @Override
            public void mouseExited(MouseEvent e) {
            }
        });
    }

    public void updateVariables(String name) throws IOException{
        Parse tower = new Parse();
        String data[] = tower.towerData(name);
        Integer x = Integer.valueOf(data[1]).intValue();
        setCap(x);
    }

    public void setTowerName(final JLabel tower_name, final JComboBox tower_select) {
        tower_select.addActionListener(new ActionListener() {

            @Override
            public void actionPerformed(ActionEvent e) {
                if (isSelected != null) {
                    Events evt = new Events();
                    evt.towerSelected(isSelected);
                } else {
                    tower_name.setText(tower_select.getSelectedItem().toString());
                    setName(tower_name.toString());
                    try {
                        updateVariables(tower_name.toString());
                    } catch (IOException ex) {
                        Logger.getLogger(Tower_Controller.class.getName()).log(Level.SEVERE, null, ex);
                    }
                }
            }
        });
    }


}

There are a lot of tutorials and examples how to do small usually single class Java GUI but no tutorials or examples on how to do projects that are bit larger than a single class.

Thanks in advance for all the help and advice.

Answer 1

In addition to the great advice already given, I would recommend reading some of what Trygve Reenskaug has written and/or recorded on his MVC page. He was there during the development of this architectural style in the late 70's. His two page technical report entitled Models - Views - Controllers from December of 1979 presents the most concise description of the model, view, and controller.

Of particular note, views are both observers and manipulators of the model. The controller is primarily concerned with arranging (wiring) the views and translating user input into interactions with the model. Several of the MVC frameworks out there have the controller relaying data from the model to the view - this is simply wrong. A paper from earlier in 1979 included the concept of an editor as a composite of related views. The editor was discarded; its functionality was moved into both the controller and the view.

Another article that is good at describing how to apply this guideline is Burbeck's How to use Model-View-Controller. It is written with Smalltalk in mind so it might not translate to Java easily, but it is a good description of how to apply the guideline.

I think that the most important thing to consider is that the original MVC style was created for user interfaces that included more than one view (representation) of the same model. This really works well for user interfaces but does not translate exceptionally well to the web service world. Using MVC for a GUI lets you really see and understand the power of this style.

Answer 2

Here is my advice for Swing development in general. It does discuss the importance of using Controllers to bridge the needs of the view and the interace of the model.

GUI guidelines for swing

Last Swing project I did I designed a MVC framework that used Spring for defining the model of the program and Controllers, then used annotations in the Controller to wire up events dispatched by the view onto methods in the controller. The view had access to the event dispatcher which was an event bus, and events sent over the bus called methods on the Controller through the annotations. This allowed any Controller to respond to events from the View. So as a Controller got too large it was super simple to refactor each set of methods into another Controller, and the view or model didn't have to change.

The beauty of the event bus was it could be shared with the model as well so the model could dispatch asynchronous events the Controller could register for as well. It looked something like:

public class SomeController {

   private AuthenticationModel authenticationModel;

   private LoginService loginService;

   private MyApp view;

   @Listener( event = "login" )
   public void login( LoginEvent event ) {
       view.showWaitDialog();
       loginService.login( event.getUserName(), event.getPassword() )
       .onResult( new Callback<User>() {
           public void onResult( User user ) {
               authenticationModel.setUser( user );
               view.hideWaitDialog();
               view.showStartScreen(user);
           }
       });
   }

}

Once this framework was in place it was amazing how fast we could get things done. And it held up pretty well as we added features. I've done my fair share of large Swing projects (3 to date), and this architecture made a huge difference.

Answer 3

The easiest way to scale a GUI is to make everything loosely coupled. Events (Swing's and your own) are the best way to do this. Unless a class is directly creating or showing a GUI element, it shouldn't know or care about anything else in the UI.

The Controller should continue doing what it's supposed to do - firing events in response to other events. But, these events should be application level events defined by the needs of your app. The Controller shouldn't directly manipulate GUI elements. Instead, you should create components (maybe just subclasses of JWhatever) that register themselves with the Controller as interested in events.

For example, create an TowerEventListener interface with a nameChanged() function. The Controller also has a changeTowerName() function, which when called, updates the model (a Tower class) then calls nameChanged() on all registered TowerEventListeners.

Then create a TowerRenamer class that, for example, subclasses JDialog (i.e. a popup window) that includes a text box and and OK button along with a reference to the Controller. When the user clicks OK, Controller.changeTowerName() is called. Other parts of your GUI that register as TowerEventListeners will receive the event and update as needed (maybe by updating a JLabel on the UI).

Note, if your needs are simple enough, you can just use PropertyChangeEvents and not worry about a whole event interface structure. PropertyChangeSupport can be used by the Controller to fire event notifications.