How to left align the swings components in a JPanel

Question

I am having the following swing component. Please see the image. Here the label and the combobox and label and the textfield are not properly aligned. Any idea what is causing this issue?

I am using the GridBagLayout in a panel. Then adding the components such as label and combobox and textfield to the panel.

Following is the code i used.

    srchCategoryLbl = new JLabel("Category");
    categoryCmb = new JComboBox<>();
    categoryCmb.setPreferredSize(dimensionTxt);
    categoryCmb.setBounds(0, 0, 0, 0);

    srchProductCodeLbl = new JLabel("Product Code");
    productCodeTxt = new JTextField();
    productCodeTxt.setPreferredSize(dimensionTxt);

    srchProductDescLbl = new JLabel("Product Desc");
    productDescTxt = new JTextField();
    productDescTxt.setPreferredSize(dimensionTxt);

    searchBtn = new JButton("Search");

    GridBagConstraints gbc = new GridBagConstraints();
    gbc.gridx = 0;
    gbc.gridy = 0;
    gbc.anchor = GridBagConstraints.WEST;
    searchPanel.add(srchCategoryLbl, gbc);

    gbc.gridx = 0;
    gbc.gridy = 1;
    searchPanel.add(categoryCmb, gbc);

    gbc.gridx = 1;
    gbc.gridy = 0;
    searchPanel.add(srchProductCodeLbl, gbc);

    gbc.gridx = 1;
    gbc.gridy = 1;
    searchPanel.add(productCodeTxt, gbc);

    gbc.gridx = 2;
    gbc.gridy = 0;
    searchPanel.add(srchProductDescLbl, gbc);

    gbc.gridx = 2;
    gbc.gridy = 1;
    searchPanel.add(productDescTxt, gbc);

    gbc.gridx = 3;
    gbc.gridy = 1;
    searchPanel.add(searchBtn, gbc);

I think that it will not fix your issue but usually is not recommended the use of setBounds and setPreferrededSize. Let the LayOut Manager handle the position and the size of the components — Francisco Puga, Mar 20 '16 at 10:15
@FranciscoPuga, In that case how do i set the size of the component? — Mayuran, Mar 20 '16 at 10:21
Are you using a Mac? It places a special "focus" border around the text fields, which can display them. You can use insets to move the labels to the right by a few pixels to compensate — MadProgrammer, Mar 20 '16 at 10:36
To test it, try using setBorder(null) on the combobox and text fields — MadProgrammer, Mar 20 '16 at 10:37
I copied and pasted your code to a `JFrame` and got http://i.stack.imgur.com/FwVbF.png this result. So your code is working in Windows. As @MadProgrammer said, maybe it is a Mac issue. If not you must share more code with us. For example how do you define searchPanel and do you adding another component to it? — rdonuk, Mar 20 '16 at 10:43
@rdonuk, No. Search panel does not have any other components. I only initialize it. There is no other code other than what i have posted. Anyway i will try on windows as well — Mayuran, Mar 20 '16 at 10:54
1) For better help sooner, post a [MCVE] or [Short, Self Contained, Correct Example](http://www.sscce.org/). 2) Provide ASCII art or a simple drawing of the *intended* layout of the GUI at minimum size, and if resizable, with more width and height. — Andrew Thompson, Mar 20 '16 at 11:15
@Mayuran check this question for a discussion about the topic http://stackoverflow.com/questions/7229226/should-i-avoid-the-use-of-setpreferredmaximumminimumsize-methods-in-java-swi — Francisco Puga, Mar 20 '16 at 11:31

score 2 · Answer 1 · answered Mar 20 '16 at 21:10

When you select one of the fields, you can see that MacOS places a "focus" rectangle around the field, this is achieved through the use of a custom Border of some kind.

You could set the borders to null (or something else), but that could affect other Look and Feels in unexpected ways and would change the user experience in ways that they may not appreciate

A better solution is to use the GridBagConstraints#insets properties to pad the labels a little...

JLabel srchCategoryLbl = new JLabel("Category");
JComboBox<Object> categoryCmb = new JComboBox<>();
categoryCmb.setPrototypeDisplayValue("This is a really long test string");

JLabel srchProductCodeLbl = new JLabel("Product Code");
JTextField productCodeTxt = new JTextField(20);

JLabel srchProductDescLbl = new JLabel("Product Desc");
JTextField productDescTxt = new JTextField(20);

JButton searchBtn = new JButton("Search");

setLayout(new GridBagLayout());
GridBagConstraints gbc = new GridBagConstraints();
Insets labelInsets = new Insets(0, 4, 0, 4);
Insets fieldInsets = new Insets(0, 0, 0, 0);
gbc.gridx = 0;
gbc.gridy = 0;
gbc.anchor = GridBagConstraints.WEST;
gbc.insets = labelInsets;
add(srchCategoryLbl, gbc);

gbc.gridx = 0;
gbc.gridy = 1;
gbc.insets = fieldInsets;
add(categoryCmb, gbc);

gbc.gridx = 1;
gbc.gridy = 0;
gbc.insets = labelInsets;
add(srchProductCodeLbl, gbc);

gbc.gridx = 1;
gbc.gridy = 1;
gbc.insets = fieldInsets;
add(productCodeTxt, gbc);

gbc.gridx = 2;
gbc.gridy = 0;
gbc.insets = labelInsets;
add(srchProductDescLbl, gbc);

gbc.gridx = 2;
gbc.gridy = 1;
gbc.insets = fieldInsets;
add(productDescTxt, gbc);

gbc.gridx = 3;
gbc.gridy = 1;
add(searchBtn, gbc);

Again, this is one of those unfortunate issues with cross platform UI's because you're going to need to devise a method by which you can determine how much insets you need based on the current platform.

I'd also highly recommend that you avoid using setPreferredSize as there's a lot that goes into calculating the appropriate size for components and instead, make use of the functionality that is already available (like setColumns on JTextFields), see the above code for some examples

How to left align the swings components in a JPanel

1 Answers1