This post, over time, will serve as a reference to myself and others of the different UI components available in the Swing library. This post assumes a general familiarity with setting up a basic Swing application and focuses only on the individual components.
Buttons are created using the JButton component. The constructor takes the text placed inside the button.
JButton stopBtn = new JButton("Stop");
You can also add images inside a button. To do that you need to get the image and make it into an icon. The following code grabs the image file “smallpanda.jpg” from the current working directory.
Image img = this.getImage(this.getCodeBase(), "smallpanda.jpg"); ImageIcon imgIcon = new ImageIcon(img); JButton feedBtn = new JButton("Feed", imgIcon);
Sometimes, you want to change the location of the text in the button. Like say, we want to place the text in the center horizontally and bottom vertically.
Don’t forget to add your buttons to the screen!
Labels and Textfields
One of the most common forms of input is a text field, usually distinguished with a label. Those components are called JTextField and JLabel respectively. The constructor for JTextArea can take just the width of the text field, or another common use is to have already inputed text and its width.
JLabel nameLabel = new JLabel("Enter in your name: "); // Create an input and set the width to be 10px wide JTextField nameInput = new JTextField(10); //Override nameInput with a field already contains the text "Brandon" //And is 10px wide nameInput = new JTextField("Brandon", 10); this.add(nameLabel); this.add(nameInput);
Checkboxes are commonly used when giving the possibility for multiple answers. Such as, check all of the foods that you like.
JCheckBox pizza = new JCheckBox("Pizza"); JCheckBox noodles = new JCheckBox("Noodles"); JCheckBox rice = new JCheckBox("Rice"); this.add(pizza); this.add(noodles); this.add(rice);
You can even replace the default look of the checkbox with an image. To do this, you need to make image icons for both when it’s checked and when it’s unchecked.
Image checkedImage = this.getImage(this.getCodeBase(), "checked.png"); Image uncheckedImage = this.getImage(this.getCodeBase(), "unchecked.png"); ImageIcon checkedIcon = new ImageIcon(checkedImage); ImageIcon uncheckedIcon = new ImageIcon(uncheckedImage); JCheckBox checkbox = new JCheckBox("Check Me", uncheckedIcon); checkbox.setSelectedIcon(checkedIcon); this.add(checkbox);
Text Areas are different from text fields in which it is made to be able to hold multiple lines of text. It’s called JTextArea and its construction takes a width and height as it’s arguments.
JTextArea textarea = new JTextArea(10, 10);
By default, when the someone inputs more text than the size can hold, it will automatically grow with the text inputted. To override this behaviour and instead introuduce scroll bars. One must define a ScrollPane and put the TextArea inside of it by using it as the scroll pane’s argument for its constructor.
JScrollPane scrollPane = new JScrollPane(textarea);
Radio buttons are used for when you only want one out of many different options to be selected. For this, one needs to define a button group that houses the radio buttons for the user to choose from. This can be achieved with ButtonGroup and JRadioButton respectively.
// Make the radio buttons JRadioButton radio1 = new JRadioButton("Pies"); JRadioButton radio2 = new JRadioButton("Cakes"); JRadioButton radio3 = new JRadioButton("Cookies"); // Put the radio buttons in a group Button Group desserts = new ButtonGroup(); desserts.add(radio1); desserts.add(radio2); desserts.add(radio3); // Add the radio buttons to the screen this.add(radio1); this.add(radio2); this.add(radio3);
To display a list of items that are clickable by the user, you can use a
JList. JLists require a model that stores the list implementation, we’ll use
DefaultListModel to achieve this purpose.
DefaultListModel model = new DefaultListModel(); JList list = new JList(model);
To add scrolling capabilities, remember to add it to a scroll pane
JScollPane sp = new JScrollPane(list);
You can set the number of items you wish to see in the list. The example below, allows us to see three items in the list.
There are a variety of ways to add items to the list. If a number is specified that tells it to place it at the index specified. Starting from the top at zero, to the button.
model.addElement("Apples") model.addElement("Cherries"); model.addElement("Bananas"); // Adds 'Oranges' to the top model.add(0, "Oranges");
Sometimes, you want to only let the user select one item. At the end, don’t forget to add the component to the screen!
To create a dropdown list of different options, consider using a JComboBox.
JComboBox cb = new JComboBox(); cb.addItem("Select Food Option"); cb.addItem("Pizza"); cb.addItem("Burger"); cb.addItem("Hot Dog"); cb.addItem("Steak"); // Add it to the screen this.add(cb);