Updating component's height also changes it's width - java

I have a GUI with one main JPanel and inside of it multiple rows, each row being another JPanel. Every row (of type JPanel) consists of 4 smaller JPanels and every panel out of those 4 has a component inside of it. The end result is a grid like interface.
Main panel has a BoxLayout and panels that are parts of a row have FlowLayout.
When I update height of some component (from row) using some listener, entire row becomes taller, which works as expected. But what happens is that not only height is changed, but also width of components (inside a row) is changed. I understand that BoxLayout is trying to layout the components using maxSize and minSize that I can set to be the same value and that worked, but then when I resize the window, other rows expand and the row with same minSize and maxSize doesn't and the grid structure becomes messed up.
What I want to achieve, is that I update only the height of the row. And when I resize the window, entire row expands, and the structure of grid is still the grid. Here is the Short, Self Contained, Correct (Compilable), Example:
Main class:
public class Main {
public static void main(String args[]) {
SwingUtilities.invokeLater(() -> {
new MainFrame(450,150);
});
}
}
MainFrame class:
public class MainFrame extends JFrame{
public MainFrame(int width, int height) {
super("Title");
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
setSize(width, height);
setVisible(true);
JPanel mainPanel = new JPanel();
mainPanel.setLayout(new BoxLayout(mainPanel, BoxLayout.Y_AXIS));
JScrollPane scrollPane = new JScrollPane(mainPanel);
add(scrollPane);
for(int i=0; i<50; i++) {
JPanel panel1 = new JPanel();
panel1.setLayout(new FlowLayout(FlowLayout.LEFT));
panel1.setBorder(BorderFactory.createMatteBorder(0, 1, 0, 1, Color.black));
panel1.setPreferredSize(new Dimension(70,35));
JPanel panel2 = new JPanel();
panel2.setLayout(new FlowLayout(FlowLayout.LEFT));
panel2.setBorder(BorderFactory.createMatteBorder(0, 0, 0, 1, Color.black));
panel2.setPreferredSize(new Dimension(70,35));
JPanel panel3 = new JPanel();
panel3.setLayout(new FlowLayout(FlowLayout.LEFT));
panel3.setBorder(BorderFactory.createMatteBorder(0, 0, 0, 1, Color.black));
panel3.setPreferredSize(new Dimension(70,35));
JTextArea area1 = new JTextArea("hello " + i);
area1.setPreferredSize(new Dimension(70,25));
panel1.add(area1);
JTextArea area2 = new JTextArea("hello " + i);
area2.setPreferredSize(new Dimension(70,25));
panel2.add(area2);
JTextArea area3 = new JTextArea("hello " + i);
area3.setPreferredSize(new Dimension(70,25));
panel3.add(area3);
JPanel row = new JPanel();
row.setBorder(BorderFactory.createMatteBorder(0, 0, 1, 0, Color.black));
row.setLayout(new BoxLayout(row, BoxLayout.X_AXIS));
row.add(panel1);
row.add(panel2);
row.add(panel3);
JButton button = new JButton("Click me");
JPanel buttonPanel = new JPanel();
buttonPanel.setLayout(new FlowLayout(FlowLayout.LEFT));
buttonPanel.setBorder(BorderFactory.createMatteBorder(0, 0, 0, 1, Color.black));
buttonPanel.setPreferredSize(new Dimension(70,35));
buttonPanel.add(button);
button.addActionListener(event -> {
panel1.setPreferredSize(new Dimension(panel1.getWidth(), panel1.getHeight() + 30));
area1.setPreferredSize(new Dimension(area1.getWidth(), area1.getHeight() + 30));
area1.updateUI();
});
row.add(buttonPanel);
mainPanel.add(row);
}
}
}
If you run this code and press button it will update not only row's height, but also row's width and grid is not aligned well anymore.

You are setting the "preferred size" based on the "size" of the component. The two can be different.
Your code should be something like:
//panel1.setPreferredSize(new Dimension(panel1.getWidth(), panel1.getHeight() + 30));
Dimension d = panel1.getPreferredSize();
panel1.setPreferredSize(new Dimension(d.width, d.height + 30));
Also, you should not be using updateUI(). That is a method used internally by Swing on a LAF change.
Instead, when you want to invoke the layout manager you invoke revalidate() on the top level component that was changed:
//area1.updateUI();
panel1.revalidate();

Related

Button creating another column in Panel

The button on the Panel was supposed to be below the last row of ovals but what it does was add a column:
Here is my Code
Panel p1 = new Panel();
JButton shiftLeft = new JButton("Shift Left");
JButton shiftRight = new JButton("Shift Right");
p1.setLayout(new GridLayout(Rows, Columns));
for (int i=0; i<Rows; i++) {
for (int j = 0; j < Columns; j++) {
arcs[i][j] = new ArcsPanel(i, j);
p1.add(arcs[i][j]);
arcs[i][j].addMouseListener(me);
}
}
p1.add(shiftRight);
add(p1, BorderLayout.CENTER);
this.pack();
this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
this.setLocationRelativeTo(null);
this.setVisible(true);
The button on the Panel was supposed to be below the last row of ovals
A GridLayout always adds components in rows/columns.
If you want the button separate from the GridLayout then you need to add the button to the frame directly:
//p1.add(shiftRight);
add(p1, BorderLayout.CENTER);
add(shiftRight, BorderLayout.PAGE_END);
Or if you don't want the button resized, then you need to wrap it in another panel first:
JPanel buttonPanel = new JPanel();
buttonPanel.add( shiftRight );
add(buttonPanel, BorderLayout.PAGE_END);
The point is to achieve desired layout you can use multiple panels each with different layouts. You are not force to use a single panel or layout manager.

JScrollPane is not Working in JPanel

I have to use JScrollPane in my Project but it is not working.
I have pasted my code where I use a JSCrollPane in my main JPanel.
frame = new JFrame();
frame.setBounds(100, 100, 1179, 733);
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.getContentPane().setLayout(null);
JScrollPane scrollPane_1 = new JScrollPane();
scrollPane_1.setVerticalScrollBarPolicy(ScrollPaneConstants.VERTICAL_SCROLLBAR_ALWAYS);
scrollPane_1.setHorizontalScrollBarPolicy(ScrollPaneConstants.HORIZONTAL_SCROLLBAR_ALWAYS);
scrollPane_1.setBounds(0, 0, 1163, 694);
frame.getContentPane().add(scrollPane_1);
JPanel panel = new JPanel();
scrollPane_1.setViewportView(panel);
panel.setLayout(null);
Setting the layout to Null means you need to handle the placement manually --> Specify the pixel location and handle the size of the container.
A layout manager handles this placement for you. The manager calculates its preferred size based on its content. The ScrollPane uses this calculated size from the layout manager.
This means you should use a layout manager, place your components within it. The rest should work automatically.
public static void main(String[] args) {
JFrame frame = new JFrame();
frame.setDefaultCloseOperation(WindowConstants.EXIT_ON_CLOSE);
frame.setSize(500, 500);
JPanel panel = new JPanel();
panel.setLayout(new GridLayout(30, 15));
for (int row = 0; row < 30; row++) {
for (int col = 0; col < 15; col++) {
panel.add(new Button("Button" + row + "/" + col));
}
}
frame.getContentPane().add(new JScrollPane(panel));
frame.setVisible(true);
}
I am not sure which layout you are using, but you need to set your panel layout something like this
panel.setLayout(new FormLayout(
"default:grow",
"fill:default:grow"));

Java : divide the screen

I try to do a simple swing window, but with the layout it's not easy...
I mean I just want a window with 3 panels :
header with 20% of window in height
content with 60% of window in height
footer with 20% of window in height
But I can't succeed to have what I want. I used a gridLayout(3,1) but I can't specify the height.
public class Window extends JFrame implements Serializable {
private JPanel _header;
private JPanel _content;
private JPanel _footer;
public Window() {
GridLayout grid = new GridLayout(3,1);
setLayout(grid);
_header = new JPanel();
_header.setBackground(Color.GRAY);
getContentPane().add(_header);
_content = new JPanel();
JScrollPane jsp = new JScrollPane(_content, JScrollPane.VERTICAL_SCROLLBAR_ALWAYS, JScrollPane.HORIZONTAL_SCROLLBAR_NEVER);
jsp.setVerticalScrollBarPolicy(ScrollPaneConstants.VERTICAL_SCROLLBAR_AS_NEEDED);
getContentPane().add(jsp);
_footer = new JPanel();
_footer.setBackground(Color.GRAY);
getContentPane().add(_footer);
pack();
validate();
setTitle("Chat client");
setVisible(true);
setSize(500, 500);
setLocationRelativeTo(null);
}
Can you help me ?
Best regards
GridBagLayout is capable of dividing vertical or horizontal space proportionally.
Here's an example that displays a red JPanel in the top 20% of a window, a green JPanel in the middle 60%, and a blue JPanel in the bottom 20%:
JFrame window = new JFrame();
window.setLayout(new GridBagLayout());
JPanel top = new JPanel(), middle = new JPanel(), bottom = new JPanel();
top.setBackground(Color.red);
middle.setBackground(Color.green);
bottom.setBackground(Color.blue);
GridBagConstraints c = new GridBagConstraints();
// we want the layout to stretch the components in both directions
c.fill = GridBagConstraints.BOTH;
// if the total X weight is 0, then it won't stretch horizontally.
// It doesn't matter what the weight actually is, as long as it's not 0,
// because the grid is only one component wide
c.weightx = 1;
// Vertical space is divided in proportion to the Y weights of the components
c.weighty = 0.2;
c.gridy = 0;
window.add(top, c);
// It's fine to reuse the constraints object; add makes a copy.
c.weighty = 0.6;
c.gridy = 1;
window.add(middle, c);
c.weighty = 0.2;
c.gridy = 2;
window.add(bottom, c);
window.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
window.setVisible(true);
Result:
GridLayout always spaces evenly. You could instead use GridBagLayout, the most evil of all the Java layout managers. I've given them "weights" of 20, 60, 20 so you can see which values are which. You can just as easily use 2, 6, 2, it doesn't matter it's just a ratio. Look at the GridBagLayout tutorial for more info.
Example
public class Window extends JFrame implements Serializable {
private JPanel _header;
private JPanel _content;
private JPanel _footer;
public Window() {
GridBagLayout grid = new GridBagLayout();
setLayout(grid);
_header = new JPanel();
_header.setBackground(Color.GRAY);
// <=== add with constraints here
getContentPane().add(_header, new GridBagConstraints(0, 0, 1, 1, 1, 20, GridBagConstraints.BASELINE, GridBagConstraints.BOTH, new Insets(0, 0, 0, 0), 0, 0));
_content = new JPanel();
JScrollPane jsp = new JScrollPane(_content, JScrollPane.VERTICAL_SCROLLBAR_ALWAYS, JScrollPane.HORIZONTAL_SCROLLBAR_NEVER);
jsp.setVerticalScrollBarPolicy(ScrollPaneConstants.VERTICAL_SCROLLBAR_AS_NEEDED);
// <=== add with constraints here
getContentPane().add(jsp, new GridBagConstraints(0, 1, 1, 1, 1, 60, GridBagConstraints.BASELINE, GridBagConstraints.BOTH, new Insets(0, 0, 0, 0), 0, 0));
_footer = new JPanel();
_footer.setBackground(Color.GRAY);
// <=== add with constraints here
getContentPane().add(_footer, new GridBagConstraints(0, 2, 1, 1, 1, 20, GridBagConstraints.BASELINE, GridBagConstraints.BOTH, new Insets(0, 0, 0, 0), 0, 0));
pack();
validate();
setTitle("Chat client");
setVisible(true);
setSize(500, 500);
setLocationRelativeTo(null);
}
public static void main(String[] args) {
SwingUtilities.invokeLater(new Runnable() {
#Override
public void run() {
new Window();
}
});
}
}
Screenshot

Java Swing - Button doesn't change size of the width

I have a JPanel which uses the FlowLayout, and a Box which has components arranged vertically.
What I want, is to set the same width size of the other components to button "Remove Column".
I've tried to change the size with line
removeColumnButton.setPreferredSize(new Dimension(130, 25));
but I can only change size of the height, not width.
Below is screenshot of the panel and code:
JPanel eastPanel = new JPanel(new FlowLayout(FlowLayout.CENTER, 5, 0));
Box eastPanelBox = Box.createVerticalBox();
addNewColumnButton = new JButton("Add New Column");
addNewColumnButton.setAlignmentX(Box.CENTER_ALIGNMENT);
eastPanelBox.add(addNewColumnButton);
eastPanelBox.add(Box.createVerticalStrut(5));
removeColumnButton = new JButton("Remove Column");
removeColumnButton.setAlignmentX(Box.CENTER_ALIGNMENT);
removeColumnButton.setPreferredSize(new Dimension(130, 25));
eastPanelBox.add(removeColumnButton);
eastPanelBox.add(Box.createVerticalStrut(5));
columnField = new JTextField();
columnField.setAlignmentX(Box.CENTER_ALIGNMENT);
columnField.setPreferredSize(new Dimension(130, 25));
eastPanelBox.add(columnField);
eastPanelBox.add(Box.createVerticalStrut(5));
columnListCB = new JComboBox(cBoxModel);
columnListCB.setAlignmentX(Box.CENTER_ALIGNMENT);
eastPanelBox.add(columnListCB);
eastPanelBox.add(Box.createVerticalStrut(5));
calculateColumnButton = new JButton("Calculate Column");
calculateColumnButton.setAlignmentX(Box.CENTER_ALIGNMENT);
eastPanelBox.add(calculateColumnButton);
eastPanel.add(eastPanelBox);
Use a GridLayout for the container holding the column of components. Initialize it with
int vGap = 5;
new GridLayout(0, 1, 0, vGap)
which stands for 1 column, variable number of rows. The vGap parameter must be an int that represents the vertical gap between components.

Why setPreferredSize does not change the size of the button?

Here is the code:
import javax.swing.*;
import java.awt.event.*;
import java.awt.*;
public class TestGrid {
public static void main(String[] args) {
JFrame frame = new JFrame("Colored Trails");
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
JPanel mainPanel = new JPanel();
mainPanel.setLayout(new BoxLayout(mainPanel, BoxLayout.Y_AXIS));
JPanel panel = new JPanel();
panel.setLayout(new GridLayout(4, 9));
panel.setMaximumSize(new Dimension(9*30-20,4*30));
JButton btn;
for (int i=1; i<=4; i++) {
for (int j=1; j<=4; j++) {
btn = new JButton();
btn.setPreferredSize(new Dimension(30, 30));
panel.add(btn);
}
btn = new JButton();
btn.setPreferredSize(new Dimension(30, 10));
panel.add(btn);
for (int j=1; j<=4; j++) {
btn = new JButton();
btn.setPreferredSize(new Dimension(30, 30));
panel.add(btn);
}
}
mainPanel.add(panel);
frame.add(mainPanel);
frame.setSize(450,950);
frame.setVisible(true);
}
}
I suppose to have a table of buttons with 4 rows and 9 columns. And the middle column should be narrower that other columns. I tried Dimension(30, 10) and Dimension(30, 10) both have no effect on the width of the middle column. Why?
Layout managers are free to ignore the preferred size. Specifically, GridLayout will always make each cell in the grid exactly the same size (it's a pretty useless layout manager for that reason).
You'll have to use a different layout manager, such as nested BoxLayout or a GroupLayout.
GridLayout is quite inflexible in that each and every cell is the same size, typically honoring the largest height and width settings of any object added to the grid.
If the rows and/or columns need to have varying sizes you should use GridBagLayout.
setPreferredSize will not change the size of the button until dimension is set by using Dimension.
Example:-
Dimension dim = new Dimension(20,20), then use setPerferredSize(dim).

Categories