I have this layout that I need to program for an assignment and this is the first time I have used layout managers in the GUI so I'm having problems getting the layout to match. I need your help
I Have two tabs labeled Account creation and Account transfer (those are ok) what I need is to have the JLabel (Account ID) and the first text field in one line then the next JLabel (Amount) and text field in the line under the first. Under that needs to be the JButton Centered (Create an Account). Lastly the JTextArea (No account) needs to be in a column to the right in the empty space separate from the labels, text fields, and button.
Here is the code I have started with:
public CreatePanel(Vector accountList, TransferPanel transferPanel)
{
this.accountList = accountList;
this.transferPanel = transferPanel;
JLabel l1 = new JLabel("Account ID");
JTextField t1 = new JTextField();
JLabel l2 = new JLabel("Amount");
JTextField t2 = new JTextField();
JButton b1 = new JButton("Create an Account");
JTextArea a1 = new JTextArea("No Account");
JPanel panel1 = new JPanel();
panel1.setLayout(new GridLayout(2,3));
panel1.add(l1);
panel1.add(t1);
panel1.add(l2);
panel1.add(t2);
panel1.add(b1, BorderLayout.SOUTH);
b1.setVerticalAlignment(JLabel.CENTER);
JPanel panel2 = new JPanel();
panel2.add(a1);
a1.setSize(200, 300);
add(panel1);
add(panel2);
}
This is how I would approach it. Instead of adding the outer panel to a frame though, it would be added to a tab of the tabbed pane.
The above is an example of a nested or compound layout. The titled borders show the layouts used and the arguments (if any) used to construct them.
The size of the button is suggested by the content (the text). The sizes of the text fields and text area is suggested in the constructor (which itself has been included as the text value).
To get the TALL effect in the text fields, set an HUGE font but use less columns for the constructor.
See also
Another nested layout.
GridBagLayout is the most powerful Layout that you can use to easily implement grid-like displays. It's a layout with n rows and m columns where each cell is customizable independently of the others in several aspects. In this layout you have to attach a GridBagConstraints object to each panel.add(JComponent, Constraints) as constraints. In the tutorial it's clearly specified what is customizable. It might look a little harsh at the beginning but once you get the hang of it it's great. It's powerful and flexible and you don't have to worry about the uncustomizable restrictions you might encounter with other Layouts.
In your layout, the most inconvenient thing I see is having the "Account ID" label aligned by its center with the TextField AND with the empty space over both of them. It would be easier if the label was aligned with the bottom of the TextField. To solve this I'll assume that the Label and the TextField are inside a panel I constructed beforehand that aligns each other correctly (easily with BorderLayout or GridBagLayout... or anything really) and I'll just place the panels in the Layout.
Then I see this Layout as a GridBagLayout with 3 rows and 2 columns that looks like this:
This is an overview of how I'd put the constraints to specify each component in the layout.
Panel 1 (Account ID Label + TextField)
gridx = 0
gridy = 0
weighty = 0.5
weightx = 0.5
anchor = PAGE_END
fill = HORIZONTAL
Panel 2 (Amount Label + TextField)
gridx = 0
gridy = 1
weighty = 0.0
fill = HORIZONTAL
Button
gridx = 0
gridy = 2
anchor = PAGE_START
weighty = 0.5
TextArea
gridx = 1
gridy = 0
gridheight = 3
weightx = 0.5
fill = BOTH
There is a couple of details I overlooked but the core issues can be aproached with these constraints. The least obvious thing to learn about the GridBagLayout is how do weights work in complex cases, for example what happens when there are several different weightx values in the same column. Does it count the max? or the sum?...
For the sake of discussion, you could avoid having those panels using an extra initial row with an invisible component with weighty > 0 and then having 2 columns: one for the JLabels and the other one for the JTextFields, with the apropiate anchors; the button would have gridwith = 2... but that's totally unnecesary, go for the two auxiliar panels.
Related
i want to ask if anything goes wrong with my code. i've set my frame with borderlayout . and on the center part, i want to use gridlayout with 7rows and 2 cols inside them.
paneltengah= new JPanel();
paneltengah.setLayout(new GridLayout(7,2));
labelname = new JLabel(lbl_name,SwingConstants.LEFT);
labelusername = new JLabel(lbl_username,SwingConstants.LEFT);
labelpassword = new JLabel(lbl_password,SwingConstants.LEFT);
labelgender = new JLabel(lbl_gender,SwingConstants.LEFT);
labelemail = new JLabel(lbl_email,SwingConstants.LEFT);
labelhobby = new JLabel(lbl_hobby,SwingConstants.LEFT);
labelrole = new JLabel(lbl_role,SwingConstants.LEFT);
textname = new JTextField(20);
textusername = new JTextField(20);
textpassword = new JPasswordField(20);
textemail = new JTextField(20);
comboboxhobby = new JComboBox();
comboboxrole = new JComboBox();
radiobuttonmale = new JRadioButton("Male");
radiobuttonfemale = new JRadioButton("Female");
ButtonGroup btngroup = new ButtonGroup();
btngroup.add(radiobuttonmale);
btngroup.add(radiobuttonfemale);
paneltengah.add(labelname);
paneltengah.add(labelusername);
paneltengah.add(labelpassword);
paneltengah.add(labelgender);
paneltengah.add(labelemail);
paneltengah.add(labelrole);
paneltengah.add(labelhobby);
//// paneltengah.add(textname); when i open this, the layout become awkward
//// paneltengah.add(textusername);
//// paneltengah.add(textpassword);
//// paneltengah.add(radiobuttonmale);
//// paneltengah.add(radiobuttonfemale);
//// paneltengah.add(comboboxhobby);
//// paneltengah.add(comboboxrole);
pane.add(paneltengah, BorderLayout.CENTER);
the following pictures is shown without opening the comment
the following picture is shown with uncomment
what is wrong with my code ?
First of all, a GridLayout sizes all components evenly in its associated Container, which explains why your labels and fields are all the same size. For example, if you had a JTextArea 200 columns × 20 lines in your JPanel, then even the tiniest label would occupy that huge a space as well!
Next, according to the GridLayout Javadoc, when a GridLayout instance is constructed with two non-zero arguments, the number of rows gets fixed and the number of columns is adjusted according to the number of components put into the parent Container.
What I suggest is using a BorderLayout to set up your main form layout. Put your title at NORTH and keep the CENTER for your labels and fields (your current JPanel).
For your labels and fields, the simplest solution might be using a GridLayout(0, 2) (fixed number of columns). But all your components will still be equally sized.
If you need more control over the size of your components (e.g., fields wider than labels), then I suggest using another layout manager such as GridBagLayout. I know it's more complex to manage but using a GridBagLayout formatting preview utility should help. Such a program may be named something like GridBagLab (I know David Geary's book Graphic Java volume 2 — Swing features one on its companion CD).
There is also a GridBagLayout tutorial at https://www.youtube.com/watch?v=Ts5fsHXIuvI.
I am trying to make a JTable that has a width of 500. The problem is that the JScrollPane associated with the table doesn't appear next to the table.
Here is the relevant code:
// Create authorsPanel
JPanel authorsPanel = new JPanel(new BorderLayout(5,5));
authorsPanel.setBorder( new TitledBorder("Author Selection") );
// Configure author table
DefaultTableModel authorstableModel = new DefaultTableModel(new String[80][1], new String[]{"Authors"}) {
#Override
public boolean isCellEditable(int row, int column) {
//all cells false
return false;
}
};
JTable authorsTable = new JTable(authorstableModel);
authorsTable.getColumnModel().getColumn(0).setPreferredWidth(500);
authorsTable.setAutoResizeMode(JTable.AUTO_RESIZE_OFF);
try {
authorsTable.setAutoCreateRowSorter(true);
} catch(Exception continuewithNoSort) {
}
JScrollPane tableScroll = new JScrollPane(authorsTable);
Dimension tablePreferred = tableScroll.getPreferredSize();
tableScroll.setPreferredSize(new Dimension(500, tablePreferred.height/3));
authorsPanel.add(tableScroll);
Here is a screenshot:
When I get rid of the line:
authorsTable.setAutoResizeMode(JTable.AUTO_RESIZE_OFF);
Then the table returns to being the full width of the panel, so it seems like I need this line.
The java docs on BorderLayout states :
The components are laid out according to their preferred sizes and the
constraints of the container's size. The NORTH and SOUTH components
may be stretched horizontally; the EAST and WEST components may be
stretched vertically; the CENTER component may stretch both
horizontally and vertically to fill any space left over.
You have used authorsPanel.add(tableScroll) to add the JScrollPane to the JPanel. So you are basically adding it to the center. So this is going to occupy the whole space that is lying vacant.
The solution to your problem lies in choosing a different layout. I could suggest MigLayout which is very versatile and you can get all kinds of effects using it.
You add your scroll pane to a panel with BorderLayout. BorderLayout does not care about preferred size. Use e.g GridBagLayout with proper constraints or you can BoxLayout (with horizontal flow) placing the table first and an empty panel second as place holder.
I'm trying to display two buttons next to a text field:
I gave up on the text already, but I really need the two buttons to remain small while the text field should expand with the window:
Currently, I use this layouts:
The text field and the two buttons are both in JPanel.
//JPanel group - the container
//List<JComponent> - the conponents added to JPanel
//int[] weights - weights of components
GridBagLayout lay = new GridBagLayout();
for(int i=0,l=fields.size(); i<l; i++) {
InputDef field = fields.get(i);
GridBagConstraints c = new GridBagConstraints();
if(weights.length<i) {
c.weightx = weights[i];
}
c.fill = GridBagConstraints.HORIZONTAL;
lay.setConstraints(field.getField(), c);
}
group.setLayout(lay);
In the documentation I see that for the components to fill their area horizontally, you should set the GridBagConstraints.HORIZONTAL to the constraints of the components.
Further, I read that you should set different GridBagConstraints#weightx to make the elements take different amount of space.
However running the code above doesn't do anything - the JPanel looks exactly the same with no layout manager whatsoever.
I am using MigLayout I find it flexible etc,but I am having a problem with centring stuff with it. I tried using gapleft 50% but it seems like the percent number needs to change on different frame sizes, because it's also depending on component's size. so if the component is centred using gapleft 25%, it will be on a different location if i resize the width of my frame.
I've tried using just align center and it doesn't nothing at all.
I've also tried new CC().alignX("center").spanX() and same thing:
(source: gyazo.com)
It's sticks to left, however it does work when I use gapleft, why?
super.setLayout(new MigLayout());
this.loginPane = new LoginPanel();
BufferedImage logo = ImageIO.read(new File("assets/logo.png"));
JLabel logoLabel = new JLabel(new ImageIcon(logo));
super.add(logoLabel, new CC().alignX("center").spanX());
It's sticks to left, however it does work when I use gapleft, why?
Based on this single line:
super.setLayout(new MigLayout()); // why super? Did you override setLayout() method?
By default MigLayout rows doesn't fill all available width but only the necessary to display the longest row (based on components width). Having said this your JLabel fits the logo image width and nothing more and it looks like stick to left side. You have to tell the layout manager that it has to fill all available width when you instantiate it:
super.setLayout(new MigLayout("fillx"));
Or
LC layoutConstraints = new LC();
layoutConstraints.setFillX(true);
super.setLayout(new MigLayout(layoutConstraints);
Then, your component constraints will work as expexted.
Picture
Based on this code snippet:
MigLayout layout = new MigLayout("fillx, debug");
JPanel content = new JPanel(layout);
JLabel label = new JLabel("Warehouse");
label.setFont(label.getFont().deriveFont(Font.BOLD | Font.ITALIC, 18));
CC componentConstraints = new CC();
componentConstraints.alignX("center").spanX();
content.add(label, componentConstraints);
Note: you can enable debug feature by doing this:
super.setLayout(new MigLayout("fillx, debug"));
Or
LC layoutConstraints = new LC();
layoutConstraints.setFillX(true);
layoutConstraints.setDebugMillis(500);
super.setLayout(new MigLayout(layoutConstraints);
I have a JPanel (extended by my GeneralOptions class) implemented as:
public GeneralOptions() {
setLayout(new MigLayout("", "[grow]", "[][][][]"));
JLabel lblWyzywienie = new JLabel("Food");
add(lblWyzywienie, "cell 0 0");
JCheckBox chckbxHb = new JCheckBox("HB");
add(chckbxHb, "cell 0 1");
JCheckBox chckbxBb = new JCheckBox("BB");
add(chckbxBb, "cell 0 1,alignx trailing");
JCheckBox chckbxAll = new JCheckBox("All Inclusive");
add(chckbxAll, "cell 0 1,alignx trailing");
}
As you can see, there is a list of checkboxes in one cell of MigLayout. This JPanel in placed as left panel of SplitPanel component, so its width is resizable.
What I want to achieve is to force this list of checkboxes to act like "inline" html list of checkboxes. This means, that they should break line when width of panel is not enough to show them in single line.
Now I can't resize this panel below width of whole list and if init width is less than this list of checkboxes, some of them are just hidden.
Example html code
http://jsfiddle.net/
You can try to resize right panel to see what I'm talking about.
Take a look on the following discussion: http://migcalendar.com/forums/viewtopic.php?f=8&t=2393
Scroll down to see the code. He actually implemented his own layout manager that does exactly what you want.