How to recreate this progress bar based JFrame?

Question

I'm wanting to create a JFrame and I just found the perfect frame. I want to recreate this:

The code to get this frame looks like this:

progressBar = new JProgressBar();
statusLbl = new JLabel();
statusLbl1 = new JLabel();
percentLbl = new JLabel();

setDefaultCloseOperation(WindowConstants.EXIT_ON_CLOSE);
setTitle("Auto-Updater");
addWindowListener(new WindowAdapter() {
    public void windowClosing(WindowEvent evt) {
    formWindowClosing(evt);
    }
});
statusLbl.setText("Status:");
statusLbl1.setText("N/A");
percentLbl.setText("0%");
GroupLayout layout = new GroupLayout(getContentPane());
getContentPane().setLayout(layout);

layout.setHorizontalGroup(layout.createParallelGroup(GroupLayout.Alignment.LEADING).addGroup(
    layout.createSequentialGroup()
    .addContainerGap()
    .addGroup(layout.createParallelGroup(GroupLayout.Alignment.LEADING)
        .addGroup(layout.createSequentialGroup()
            .addComponent(statusLbl).addPreferredGap(LayoutStyle.ComponentPlacement.RELATED)
            .addComponent(statusLbl1).addPreferredGap(LayoutStyle.ComponentPlacement.RELATED, 304, 32767)
            .addComponent(percentLbl)).addComponent(progressBar, GroupLayout.Alignment.TRAILING, -1, 380, 32767))
    .addContainerGap()));

layout.setVerticalGroup(layout.createParallelGroup(GroupLayout.Alignment.LEADING).addGroup(
    layout.createSequentialGroup()
    .addContainerGap()
    .addGroup(layout.createParallelGroup(GroupLayout.Alignment.LEADING, false)
        .addGroup(layout.createParallelGroup(GroupLayout.Alignment.BASELINE)
            .addComponent(statusLbl1, -1, -1, 32767)
            .addComponent(percentLbl))
        .addComponent(statusLbl, -1, -1, 32767)).addPreferredGap(LayoutStyle.ComponentPlacement.RELATED)
    .addComponent(progressBar, -2, 30, -2).addContainerGap(-1, 32767)));

pack();

But I think this looks ugly and has zero readability, so I'm asking you: How can I recreate this frame using a different layout or how can I use this layout differently to make it readable?

What do you mean with "If you changed the Status: N/A to a TitledBorder" — RuuddR, Apr 14 '17 at 11:27
Well, I just found out what a TitledBorder is, but I really like the design of the JFrame like it is at the moment. I can put the percentage in the progressbar though. Is it by the way possible to make this JFrame with any layout? — RuuddR, Apr 14 '17 at 11:34
My apologies for wasting your time. I should've looked it up before replying to your comment. — RuuddR, Apr 14 '17 at 11:43
A well-established technique for complex layouts is to NOT use a single `JPanel` with a single layout. Instead use several nested `JPanel`s, each with a different layout manager. A good article for this is [Effective Layout Management](http://javadude.com/articles/layouts/). — Thomas Fritsch, Apr 14 '17 at 11:58
Thank you, Thomas. Now I can just learn how I should make layouts for frames. — RuuddR, Apr 14 '17 at 12:00
@ThomasFritsch Good point. Here is [another example of combining layouts](http://stackoverflow.com/a/5630271/418556). — Andrew Thompson, Apr 14 '17 at 12:00
*"how I should make layouts for frames"* The general advice would be "don't do that". Note how both my examples (the one here as well as the linked example) do everything in a `JPanel` that is added to the frame. — Andrew Thompson, Apr 14 '17 at 12:02

score 3 · Accepted Answer · answered Apr 14 '17 at 11:56

If the progress string could be included within the progress bar it would be done with a single JPanel with a BorderLayout. Put the label in the PAGE_START and the progress bar in CENTER (which is the default if no constraint is specified).

Note: I'd tend to display that panel in a JDialog or a JOptionPane rather than a JFrame, but here is a frame based version.

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

public class ProgressBarPanel {

    private JComponent ui = null;

    ProgressBarPanel() {
        initUI();
    }

    public void initUI() {
        if (ui!=null) return;

        ui = new JPanel(new BorderLayout(4,4));
        ui.setBorder(new EmptyBorder(4,4,4,4));

        JProgressBar progressBar = new JProgressBar(0, 100) {
            public Dimension getPreferredSize() {
                // base this on a multiple of the default preferred size to
                // account for the size of the font used to paint the 
                // progress string
                return new Dimension(400,40);
            }
        };
        progressBar.setValue(50);
        progressBar.setStringPainted(true);
        ui.add(progressBar);

        ui.add(new JLabel("Status: N/A"), BorderLayout.PAGE_START);
    }

    public JComponent getUI() {
        return ui;
    }

    public static void main(String[] args) {
        Runnable r = new Runnable() {
            @Override
            public void run() {
                try {
                    UIManager.setLookAndFeel(UIManager.getSystemLookAndFeelClassName());
                } catch (Exception useDefault) {
                }
                ProgressBarPanel o = new ProgressBarPanel();

                JFrame f = new JFrame(o.getClass().getSimpleName());
                f.setDefaultCloseOperation(JFrame.DISPOSE_ON_CLOSE);
                f.setLocationByPlatform(true);

                f.setContentPane(o.getUI());
                f.pack();
                f.setMinimumSize(f.getSize());

                f.setVisible(true);
            }
        };
        SwingUtilities.invokeLater(r);
    }
}

Thank you very much for this example. I'll see if I can understand all of it. I'll make good use of this. — RuuddR, Apr 14 '17 at 12:02
*"I'll see if I can understand all of it."* The important parts are in the `initUI()` method, Even that could be shortened to remove the overridden method to enlarge the size of the progress bar. — Andrew Thompson, Apr 14 '17 at 12:04

How to recreate this progress bar based JFrame?

1 Answers1