Link to home
Start Free TrialLog in
Avatar of duta
duta

asked on

Java GridLayout:

Dear Experts:

I have a grid layout as seen below.
The first row of textfields are in  Gridlayout of BorderLayout.North.

The next two rows of textfields are in GridLayout of BorderLayout.Center.

The first two rows have a subheading of the rows. I used  TitledBorder.

I wonder whether there is a way to a subheading to the third row too.

Thanks!
5-digit.png
Avatar of duta
duta

ASKER

I would like to place a third subheading where "password" is.

Avatar of CEHJ
You would need to nest the layout in CENTER. Use another Container in there
no, you'll need to split it into two 1 row panels for that, same as you have done with the top row

Instead of a BorderLayout for the container try a 1x3 GridLayout

Avatar of duta

ASKER

The layout I have in mind is as seen in the screen shot below:



layout.png
The best way to do that is to make a single component class for the first three rows and add three instances together with a button panel to a BoxLayout. Avoid GridLayout - it's ugly without tweaking
Avatar of duta

ASKER

Genius, you said: to make a single component class for the first three rows and add three instances together with a button panel to a BoxLayout.


  I just  wonder whether you may kindly show me how to that.

Thanks!
Avatar of duta

ASKER

Is it possible to nest a BorderLayout in BorderLayout.Center?

SOLUTION
Avatar of Mick Barry
Mick Barry
Flag of Australia image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
> Is it possible to nest a BorderLayout in BorderLayout.Center?

it is, but don't think you'll need to in your case

Avatar of duta

ASKER

Savant, you said:
JPanel panel = new JPanel(new GridLayout(3, 1));
panel.add(row1);
panel.add(row2);
panel.add(row3);

Row 1, 2, 3 each  needs to contain five textfield cells.

I do not know how to add five textfields cells in a row to the panel.
I am assigning a value to each of the textfields by using an array.

Thanks a lot!
JPanel row = new JPanel(new GridLayout(1, 5));
for (int i=0; i<5; i++) {
  row.add(tf[i]);
}

Try something like:
import javax.swing.*;
 
public class InputPanel extends JPanel {
    private JTextField[] fields;
    final int NUM_FIELDS = 5;
 
    public InputPanel(String caption) {
	setBorder(BorderFactory.createTitledBorder(caption));
	fields = new JTextField[NUM_FIELDS];
	for(int i = 0;i < NUM_FIELDS;i++) {	
	    fields[i] = new JTextField(5);
	    add(fields[i]);
	}
    }
 
    public void setField(String text, int index) {
	fields[index].setText(text);
    }
    public String getField(int index) {
	return fields[index].getText();
    }
}

Open in new window

you can achieve by setting GridLayout for all, for e.g.,

1. Create three panels setting Gridlayout with 1 row and 5 cols. add the text fileds.
2. Set TitledBorder to all these panel.
3. Set the GridLayout with 3 rows and 1 col for parent panel/container.
4. add the titled panels to this parent container.
ASKER CERTIFIED SOLUTION
Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of duta

ASKER

Sage, can you kindly give me a made-up code to execute your tip?

I am total beginner.

Thanks!
Together with a final button panel, the gui looks like this on my system:
gui.png
Avatar of duta

ASKER

Genius, thank you so much for your kind tip.

I will try your kind tip and come back to you soon.
Thats just what I had already posted, glad you like it :)
Let me know if you need anything different

Avatar of duta

ASKER

While trying Savant's code, I got  the following error message:


.java:16: 312 cannot find symbol
symbol  : class InputPanel
Avatar of duta

ASKER

I got it. I have to put class InputPanel.
Its made what I suggested a bit more complicated than need to be. Keeping it simple will save you extra in the long run. I'll let the others finish writing it for you, just remember who suggested it :)
Give me a yell if you need my help.

duta, just in case you've been confused by other comments, you're  working with my suggestion made at http:#24222240  ;-)
Avatar of duta

ASKER

Savant, you kindly gave me the following codes in two occasions to create a table that I posted above.

I have three rows of textfields which need to be placed in a GridLayou (3, 1).
You used one GridLayout (3,1) and another GridLayout (1, 5).

Is the GirdLayout (1,5) nested in the GridLayout (3,1)?

If so, how to nest it?

Thanks



I do not know how to incorporate them

JPanel panel = new JPanel(new GridLayout(3, 1));
panel.add(row1);
panel.add(row2);
panel.add(row3);


Panel row = new JPanel(new GridLayout(1, 5));
for (int i=0; i<5; i++) {
  row.add(tf[i]);
}
Panel row1 = new JPanel(new GridLayout(1, 5));
for (int i=0; i<5; i++) {
  row1.add(tf[i]);
}

// now do the same for row2 and row3
// you could use a factory method for that

JPanel panel = new JPanel(new GridLayout(3, 1));
panel.add(row1);
panel.add(row2);
panel.add(row3);

container.add(BorderLayout.CENTER, panel);
container.add(BorderLayout.SOUTH, buttonpanel);


Avatar of duta

ASKER

Savant, can you explain the following code?

row1.add(tf[i]);

What is  tf [ i ] ?

I need to assign a number to each of the textfields using an array.

Thanks!
they are your textfields, main idea is you use a separate panel for each row which allows you to add a title border to each as you require

Avatar of duta

ASKER


I ran the following code. But the output (as seen in attached image)  has a little problem.

The textfield starts at a wrong place.

_____________________  current code _______________________

 Container cp = getContentPane();
         
           
      JPanel   row1  =  new  JPanel (  new GridLayout ( 1,  5 ) );
     
      JPanel   row2  =  new  JPanel (  new GridLayout ( 1,  5 ) );
      JPanel   row3  =  new  JPanel (  new GridLayout ( 1,  5 ) );
   
      JPanel   panelC  =  new  JPanel (  new GridLayout ( 3,  1 ) );
           
     
      panelC.add ( row1 );
      panelC.add ( row2 );
      panelC.add ( row3 );
   
      cp.add    (BorderLayout.CENTER, panelC);
   
panelcenter.png
What was wrong with the display i posted for you?
Avatar of duta

ASKER

Genius, I am a real novice. I am a little scared to try a little lengthy code.

I will make sure to try your kind tip.

I do apologize to you for not trying your tip sooner.

Thanks a lot!
try this,

import java.awt.Container;
import java.awt.GridLayout;

import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.JTextField;
import javax.swing.SwingUtilities;
import javax.swing.border.TitledBorder;

public class TestGridLayout{
      
      private void buildComponent(){
            JFrame frame = new JFrame( "Test GridLayout!" );
            Container cp = frame.getContentPane();
            JPanel row1 = new JPanel( new GridLayout( 1, 5 ) );
            
            JPanel row2 = new JPanel( new GridLayout( 1, 5 ) );
            JPanel row3 = new JPanel( new GridLayout( 1, 5 ) );
            
            JPanel panelC = new JPanel( new GridLayout( 3, 1 ) );
            
            row1.setBorder( new TitledBorder( "Last 5 Digit" ) ) ;
            row2.setBorder( new TitledBorder( "Pin Number" ) ) ;
            row3.setBorder( new TitledBorder( "Password" ) ) ;
            addTextFields( row1 ) ;
            addTextFields( row2 ) ;
            addTextFields( row3 ) ;
            
            panelC.add( row1 );
            panelC.add( row2 );
            panelC.add( row3 );
            
            cp.add( panelC );
            
//            frame.pack() ;
            frame.setSize( 400, 300 ) ;
            frame.setVisible( true ) ;
      }
      
      private void addTextFields( JPanel pnl ){
            for( int i = 0; i < 5; i++ ){
                  pnl.add( new JTextField( 1 ) ) ;
            }
      }
      
      public static void main( String[] args ){
            SwingUtilities.invokeLater( new Runnable(){
                  public void run(){
                        new TestGridLayout().buildComponent() ;
                  }
            }) ;
      }
      
}
make sure your gui leaves enough space to display all your fields.

Avatar of duta

ASKER

Sage,  I have one quick question.

I need  two more row below the above three rows. The fourth row needs to contain three buttons.

The fifth and last row needs contain labels.

I just wonder whether you may kindly modify the code so that I may have two more rows.

Thanks!
SOLUTION
Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of duta

ASKER

Sage, I got  two error messages:

1.  cannot find symbol:   class JButton

2.  cannot find symbol:  class JLabel



Thanks a lot!
you need to import them in the top!

import javax.swing.JButton;
import javax.swing.JLabel;
Avatar of duta

ASKER

Sage, thank you so much for your kind tip.

I just wonder whether I may ask you one FINAL  quick question.

Is there any way to make the buttons smaller (as sketched by red  lines) so that
there are some space between the buttons and  margin from the border of the panel?

Thanks!
buttons.png
As i mentioned earlier, GridLayout produces ugly components if it gets the chance. In this case, the easiest way to fix it would be to set the preferred size for each button
Avatar of duta

ASKER

Genius, can you kindly show me how to set preferred size in the above code?

Thanks a lot!
Actually that won't work when i think about it again, but i already showed you how to produce proper looking buttons
just replace your row4 with below,

            JPanel row4 = new JPanel( new FlowLayout( FlowLayout.CENTER, 30, 10 ));
Yes, use a FlowLayout as i did. In fact the following should suffice
JPanel row4 = new JPanel();

Open in new window

Avatar of duta

ASKER

Thank you so much for your extraordinarily patient, kind help!
:-)