Question

First, let me try to clarify that what I mean by “control flow” is the way the user navigates through my UI. (This may very well not be the correct term for what I’m describing, so please suggest a better one if you know any!)

Most modern applications seem to let the user decide what to do when. The self-contained units of control mostly involve some text entry and a mouse click at most.

For the application I’m working on, I want something different (please see the end of this post for the answer to the inevitable ‘Why would you want that, that’s not good design?’). The picture below shows a sample GUI which is quite close to what I’m doing, it’s just stripped down and the business domain has been changed to make it easy to understand:

The intended control flow is the following:

1 user enters name of recipe, presses Enter
2 user enters ingredient, presses Enter
3 if ingredient field is empty, we're done: go to 9
4 dialog window shows up, queries database with user input and lets him select from a list of possible ingredients
5 if nothing was selected, go to 2
6 user enter amount, presses Enter
7 add this ingredient to an observable collection which is bound to the list
8 go to 2
9 dialog window shows up, prompts user for price of the mixture

My current code for this is based on KeyListeners attached to all of those controls which intercept Enter key presses, call the logic involved and then manually setFocus() the appropriate next text field/other control.
This works, but the code looks hard to maintain, and it feels a painful lot like the code I used to write in VB5 a few decades ago.

Is there a better approach to achieving this? I am interested both in general design patterns and in specific solutions that may be offered by frameworks such as WPF, JavaFX or Swing.

---

Why would anyone want that?

Two reasons:

• This particular application has always worked this way and is used by many people with very little computer experience. Giving them too much choice of what to do how and when only adds unnecessary confusion.
• For simple tasks like this (it is more or less just data entry) manual navigation with the mouse is bound to be slower and more error-prone than a pre-defined pathway through the entry mask.

Answer 1

Problems

You are overloading the Enter key. A preferred method would be to have buttons represent actions.

Your amount field is in the wrong place, if it relates to the entire recipe rather than an ingredient. Move it down after the ingredient list.

Buttons

Back to the buttons. You could have a button after the name field, after the ingredient field, and after the amount field on the bottom. This allows the user to be specific about what they want to update.

State Pattern

You could use a state pattern to keep track of what the user has already done, and what the user can do next. If the user does things out of order, you would return an error message somewhere on your screen, guiding the user as to what to do next.

You would have to enumerate all of the different possibilities of user actions. With 3 buttons, that makes 6 combinations.

• name, ingredient, amount (what you described)
• name, amount, ingredient
• ingredient, name, amount
• ingredient, amount, name
• amount, name, ingredient
• amount, ingredient, name

You would decide which combinations are valid, and which are invalid. The state tree has a further complication in that your user is probably going to enter multiple ingredients.

OK and Cancel Buttons

Rather than manage state, you could add a pair of buttons to the bottom of your GUI, OK and Cancel. This allows your user to fill out the fields in any order they choose. You don’t check for validity until the OK button is left clicked.

The OK button is the button that’s usually tied to the Enter key.

You would still have to have a button after the ingredient field, to allow the user to enter more than one ingredient.