Lesson 4 - Birthday Reminder in Java Swing - Form design

In the previous lesson, Simple calculator in Java Swing, we learned to handle events and created a simple calculator. In today's lesson, we'll start working on an app to remind friends' birthdays. The app will look as follows:

We'll create a new Java application without the main class named Anniversary.

Form design

As always, we'll start by designing the form. This time, we'll have two of them in the app.

The Overview Form

The overview form is a primary application window with an overview of people and their birthdays. We'll add a new JFrame Form, named OverviewJFrame, to the project. We'll set its title to "Anniversary". We'll change the code in its main method so that the form is centered:

public void run() {
    OverviewJFrame overviewJFrame = new OverviewJFrame();
    overviewJFrame.setLocationRelativeTo(null);
    overviewJFrame.setVisible(true);
}

By the way, note that the forms are named using PascalCase (the first letter is capitalized) and its components with camelCase. This is because the form is a class and components are instances.

We'll also need the following components:

• 8x JLabel
• 2x JButton
• 1x JList

Labels

Place the labels as shown in the picture above. Set the texts to the labels on the left as shown in the picture. We won't set the texts to labels on the right. However, we'll name them so we can later set the text from the code. Labels on the right side will be named: todayJLabel, nearestJLabel, birthdayJLabel, ageJLabel.

Buttons

We'll place two JButtons at the bottom of the form and set their texts to "Add" and "Remove". You shouldn't be surprised that their names will be addJButton and removeJButton. We can add some icons to the buttons. I found those in the picture above at http://www.iconfinder.com, the size is 32x32 pixels. To set the image, we use the Icon property where we click on the "..." button. We can now import the image from a project or upload it from an external location. We'll select the External image and choose an appropriate image from the disk.

JList

JList is basically an expanded version of JComboBox, which we introduced in the previous lesson. Otherwise, it works the same way and we'll use it to display a list of people. Name the list as personsJList.

Add Person Form

The second form will be used to add new people and will look as follows:

This time, we won't add the form as an JFrame Form to the project, but as a JDialog Form. If you don't have this option in the menu, you must select Other ... and then select the JDialog Form in the Swing GUI Forms section.

The difference between a dialog and a form is that the dialog is understood as a single-purpose auxiliary form that mostly serves to enter certain data and then closes. Therefore, unlike JFrame, JDialog can be marked as modal. A modal dialog is displayed in the foreground of the application and the entire application then waits for it to close. This is very useful. We can, for example, display a dialog to add a person and then refresh the person being displayed. After the modal dialog is displayed, the method waits for it to close and then resumes, in this case, refreshes the person detail. If the form wasn't modal, we wouldn't be able to respond well when it's been closed. Sometimes it's useful that it isn't possible to manipulate with the application when the dialog is displayed or to display multiple dialogs at once.

Let's name the dialog as PersonJDialog and set its title to "Add Person". NetBeans has probably generated the main method into the JDialog's source code. We won't need it here, so we'll remove it.

Next, we'll put the following components into the dialog:

• 3x JLabel
• 1x JTextField
• 1x JFormattedTextField
• 1x JButton

JLabels

The two JLabels are here just to describe the text fields, so just set the text as shown in the picture above, you don't even have to name them. The third label is used to display the new user's icon to make our form more user-friendly. You can set the JLabel icon again using the icon property. We'll clear the label's text to prevent it from appearing.

JTextField

As you would expect, JTextField is a field where the user of the application can enter any text. It's ideal for the purpose of entering a name. Some beginners also use it to enter numbers or dates, which is wrong, as we explained last time. Name the TextField as nameJTextField.

JFormattedTextField

The JFormattedTextField component allows us to enter text in the same way as JTextField, but maintains a specified format. If we then read what the user has entered, we always get a meaningful input.

We'll name the component birthdayJFormattedTextField and proceed to its formatterFactory property settings:

Here you can find many ready-made formats for entering numbers, date and time, percent and currency. We'll use the custom option from the date category, where we'll enter the following format:

d.M.yyyy

So we specified that the format of the date entered into the TextField would be day.month.year. We can test the format with the Test button. After confirming, the component will maintain the specified format and even if the user enters nonsense, e.g. the 13th month, it'll always return a meaningful value.

JButton

Name the button for the dialog confirmation as okButton and set its text to "OK".

When running the application, don't forget to set the overviewJFrame as the main form.

We have the forms ready, we'll create classes with application logic in the next lesson, Birthday Reminder in Java Swing - Logic Layer. The created forms are available for download below.

Did you have a problem with anything? Download the sample application below and compare it with your project, you will find the error easily.