Applet not displaying correctly

[Suvojit Chakraborty]

Hi all,

I have coded an applet which accepts name and occupation of use and displays the total characters entered on click of a button.
COde:

import java.awt.*;
import java.awt.event.*;
import java.applet.*;
public class appExample extends Applet
{
	Label l1,l2,l3;
	TextField t1,t2,t3;
	GridBagLayout gLay;
	GridBagConstraints gCon;
	Button b;
	public void init()
	{	
		l1=new Label("Name");
		l2=new Label("Address");
		l3=new Label("Total characters");
		l3.setVisible(false);
		t1=new TextField(50);
		t2=new TextField(50);
		t3=new TextField(50);
		t3.setVisible(false);
		b=new Button("Enter");
	
		gLay=new GridBagLayout();
		setLayout(gLay);
		gCon=new GridBagConstraints();
		
		gCon.anchor=GridBagConstraints.CENTER;
		gCon.gridx=1;
		gCon.gridy=4;
		gLay.setConstraints(l1,gCon);
		add(l1);
 
		gCon.anchor=GridBagConstraints.CENTER;
		gCon.gridx=4;
		gCon.gridy=4;
		gLay.setConstraints(t1,gCon);
		add(t1);
 
		gCon.anchor=GridBagConstraints.CENTER;
		gCon.gridx=1;
		gCon.gridy=6;
		gLay.setConstraints(l2,gCon);
		add(l2);
 
		gCon.anchor=GridBagConstraints.CENTER;
		gCon.gridx=4;
		gCon.gridy=6;
		gLay.setConstraints(t2,gCon);
		add(t2);
 
		gCon.anchor=GridBagConstraints.CENTER;
		gCon.gridx=1;
		gCon.gridy=8;
		gLay.setConstraints(l3,gCon);
		add(l3);
 
		gCon.anchor=GridBagConstraints.CENTER;
		gCon.gridx=4;
		gCon.gridy=8;
		gLay.setConstraints(t3,gCon);
		add(t3);
 
 
		gCon.anchor=GridBagConstraints.CENTER;
		gCon.gridx=2;
		gCon.gridy=12;
		gLay.setConstraints(b,gCon);
		add(b);
		b.addActionListener(new ActionListener()
			{	
				public void actionPerformed(ActionEvent e)
				{
					int i=t1.getText().length();
					i+=t2.getText().length();
					t3.setText(new 
 
Integer(i).toString());
					t3.setVisible(true);
					l3.setVisible(true);
					repaint();
				}
			});
		
	}		
	
}  

If you execute this code,you will notice that controls appears in a way which give a look of an Iron piece struck to an electro magnet in the center. I know it is something to do with constraints of the components, but I cant figure out what. I tried specifying weightx as 0.5 but that seperates the coponents in an ugly way. Can you suggest me how can I make the controls arrangement look pleasant.

Also, you will notice that on Enter button appears immediately below the Occupation label. Whereas accoding my layout arrangement it should leave some row space for the hidden fields.On entering values and pressing enter the hidden fields ,must become visible as per my codes logic. But it is not happening. For some reason it happens once the applet is resized.

Please guide me to fix these logic errors.



Thanks

[Paul Clapham]

Let's try moving this to the AWT/Swing forum where there are more regulars to answer AWT questions. This one isn't specifically applet-related anyway.

[pete stein]

Your best bet is to use more than one layout manager in nested Panels (or JPanels if this were a Swing app -- which I recommend by the way). You can find the tutorial on how to use layout managers here: http://java.sun.com/docs/books/tutorial/uiswing/layout/index.html

Also, when using GridBagLayout, don't forget to use insets and fills. e.g.,

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

public class AppExample2 extends JApplet {
  public void init() {
    try {
      javax.swing.SwingUtilities.invokeAndWait(new Runnable() {
        public void run() {
          createGUI();
        }
      });
    } catch (Exception e) {
      System.err.println("createGUI didn't successfully complete");
    }
  }

  private void createGUI() {
    getContentPane().add(new AppExample2Gui().getMainPanel());
  }
}

class AppExample2Gui {
  private static final int GAP = 8;
  private static final int FIELD_SIZE = 15;
  private JPanel mainPanel = new JPanel();

  public AppExample2Gui() {
    JPanel midPanel = new JPanel(new GridBagLayout());
    GridBagConstraints gpc = createGpc(0, 0);
    midPanel.add(new JLabel("Name"), gpc);
    gpc = createGpc(1, 0);
    midPanel.add(new JTextField(FIELD_SIZE), gpc);
    gpc = createGpc(0, 1);
    midPanel.add(new JLabel("Address"), gpc);
    gpc = createGpc(1, 1);
    midPanel.add(new JTextField(FIELD_SIZE), gpc);
    gpc = createGpc(0, 2);
    midPanel.add(new JLabel(" "), gpc);
    gpc = createGpc(1, 2);
    midPanel.add(new JButton("Enter"), gpc);
    
    mainPanel.setLayout(new BorderLayout(GAP, GAP));
    mainPanel.add(midPanel, BorderLayout.NORTH);
  }

  private GridBagConstraints createGpc(int x, int y) {
    GridBagConstraints gpc = new GridBagConstraints();
    gpc.gridx = x;
    gpc.gridy = y;
    gpc.gridheight = 1;
    gpc.gridwidth = 1;
    gpc.weighty = 0.0;
    
    if (x == 0) {
      gpc.weightx = 0.01;
      gpc.anchor = GridBagConstraints.WEST;
      gpc.fill = GridBagConstraints.BOTH;
      gpc.insets = new Insets(GAP, GAP, GAP, GAP);
    } else {
      gpc.weightx = 1.0;
      gpc.anchor = GridBagConstraints.EAST;
      gpc.fill = GridBagConstraints.HORIZONTAL;
      gpc.insets = new Insets(GAP, 4*GAP, GAP, GAP);
    }
    
    return gpc;
  }

  public JPanel getMainPanel() {
    return mainPanel;
  }
}

[Suvojit Chakraborty]

Thank you so much for posting reply. I thought my post was erased as I could not find it in its original location.
I have read the suns document on Gridbaglayouts and learned a lot. But I have found it difficult to implement the things practically. It will be great if you can share some sources on gridbag layout which show practical examples and explains it in better way.
I have also executed your code and it looks perfect. However I dont understand why does your code's applet has grey background in which button is blue and labels are bold Where as in my case applet has white background, Please tell me what did you do in your code which makes it behave like this?? I could not spot any reason

Also I am posting my modified code in which I have set ipadx,ipady etc as per your suggetion, but still there are layout problems which are:
1. You will notice there is unwanted space is there between the rows, even though I mentioned them to be on consequent rows.
2. Also I dont understand why does the total char row which is hidden initially and is supposed to be displayed on click of enter, does not get displayed on pressing enter. It get displays when I resize the window or remove focus from applet and again gives focus to the applet. It seems to me that the paint process is not happening in this case but I dont understand why? I have made a call to repaint from inside the event handler.

 import java.awt.*;
import java.awt.event.*;
import java.applet.*;
public class appFinalExample extends Applet
{
	Label l1,l2,l3;
	TextField t1,t2,t3;
	GridBagLayout gLay;
	GridBagConstraints gCon;
	Button b;
	Panel p;
	public void init()
	{	
		setBackground(Color.YELLOW);

		l1=new Label("Name");
		l2=new Label("Address");
		l3=new Label("Total characters");
		l3.setVisible(false);
		t1=new TextField(50);
		t2=new TextField(50);
		t3=new TextField(50);
		t3.setVisible(false);
		b=new Button("Enter");
		b.setBackground(Color.RED);
		p=new Panel();
		
		gLay=new GridBagLayout();
		setLayout(gLay);
		gCon=new GridBagConstraints();
	
		
		gCon.gridx=1;
		gCon.gridy=4;
		gCon.ipadx=3;
		gCon.ipady=3;
		gCon.gridheight = 1;
		gCon.gridwidth = 1; 
		gCon.fill = GridBagConstraints.NONE;
		gCon.anchor = GridBagConstraints.LINE_END;
		gCon.insets = new Insets(2,2,2,2); 
		gCon.weightx = 0.1;
		gCon.weighty = 0.1;
		gLay.setConstraints(l1,gCon);
		add(l1);
		l1.setBackground(Color.RED);

		
		gCon.gridx=2;
		gCon.gridy=4;
		gCon.ipadx=1;
		gCon.ipady=1;
		gCon.gridheight = 1;
		gCon.gridwidth = 1; 
		gCon.fill = GridBagConstraints.NONE;
		gCon.anchor = GridBagConstraints.LINE_START;	
		gCon.insets = new Insets(2,2,2,2); 
		gCon.weightx = 0.2;
		gCon.weighty = 0.2;
		gLay.setConstraints(t1,gCon);
		add(t1);
		t1.setBackground(Color.RED);
	
		gCon.gridx=1;
		gCon.gridy=5;
		gCon.ipadx=1;
		gCon.ipady=1;
		gCon.gridheight = 1;
		gCon.gridwidth = 1; 
		gCon.fill = GridBagConstraints.NONE;
		gCon.anchor = GridBagConstraints.LINE_END;	
		gCon.insets = new Insets(2,2,2,2); 
		gCon.weightx = 0.1;
		gCon.weighty = 0.1;
		gLay.setConstraints(l2,gCon);
		add(l2);
		l2.setBackground(Color.RED);
		
		gCon.gridx=2;
		gCon.gridy=5;
		gCon.ipadx=1;
		gCon.ipady=1;
		gCon.gridheight = 1;
		gCon.gridwidth = 1; 
		gCon.insets =new Insets(4,4,4,4); 
		gCon.fill = GridBagConstraints.NONE;
		gCon.anchor = GridBagConstraints.LINE_START;
		gCon.weightx = 0.2;
		gCon.weighty = 0.2;
		gLay.setConstraints(t2,gCon);
		add(t2);
		t2.setBackground(Color.RED);
		
		gCon.gridx=1;
		gCon.gridy=6;
		gCon.ipadx=1;
		gCon.ipady=1;
		gCon.gridheight = 1;
		gCon.gridwidth = 1; 
		gCon.fill = GridBagConstraints.NONE;
		gCon.anchor = GridBagConstraints.LINE_END;			
		gCon.insets = new Insets(2,2,2,2); 		
		gCon.weightx = 0.1;
		gCon.weighty = 0.1;
		gLay.setConstraints(l3,gCon);
		add(l3);
		l3.setBackground(Color.RED);
		
		gCon.gridx=2;
		gCon.gridy=6;
		gCon.ipadx=1;
		gCon.ipady=1;
		gCon.gridheight = 1;
		gCon.gridwidth = 1; 
		gCon.anchor = GridBagConstraints.LINE_START;
		gCon.fill = GridBagConstraints.NONE;
		gCon.insets = new Insets(4,4,4,4); 
		gCon.weightx = 0.5;
		gCon.weighty = 0.5;
		gLay.setConstraints(t3,gCon);
		add(t3);
		t3.setBackground(Color.RED);


		
		gCon.gridx=2;
		gCon.gridy=8;
		gCon.ipadx=40;
		gCon.ipady=5;
		gCon.gridheight = 1;
		gCon.gridwidth = 1; 
		gCon.insets = new Insets(4,4,4,4); 
		gCon.fill = GridBagConstraints.NONE;
		gCon.anchor = GridBagConstraints.LINE_START;
		gCon.weightx = 0.5;
		gCon.weighty = 0.5;
		gLay.setConstraints(b,gCon);
		add(b);
		b.addActionListener(new ActionListener()
			{	
				public void actionPerformed(ActionEvent e)
				{
					repaint();
					int i=t1.getText().length();
					i+=t2.getText().length();
					t3.setText(new 

Integer(i).toString());
						t3.setVisible(true);
					t3.setEditable(false);
					l3.setVisible(true);
					callPaint();
				}
			});
		
		
	}
	
		private void callPaint()
		{
			repaint();
		}		
	
} 

Please help to fix the problem.

Thanks

[Ulf Dittmer]

Suvojit Chakraborty wrote:I thought my post was erased as I could not find it in its original location.

Posts get moved around if there are other forums in which they would be a better fit. You can always find all your posts through the "My Posts" link at the top of the page.

[pete stein]

Suvojit Chakraborty wrote:Thank you so much for posting reply. I thought my post was erased as I could not find it in its original location.
I have read the suns document on Gridbaglayouts and learned a lot. But I have found it difficult to implement the things practically. It will be great if you can share some sources on gridbag layout which show practical examples and explains it in better way.

You're welcome. One helpful tutorial is this one: Taming the GridBagLayout and others can be found through Google.

I have also executed your code and it looks perfect. However I dont understand why does your code's applet has grey background in which button is blue and labels are bold Where as in my case applet has white background, Please tell me what did you do in your code which makes it behave like this?? I could not spot any reason

Probably this is due to my applet being a JApplet, and thus a Swing GUI application rather than an Applet which is built with the older, less flexible and less robust AWT graphics library.

Also I am posting my modified code in which I have set ipadx,ipady etc as per your suggetion, but still there are layout problems which are:
1. You will notice there is unwanted space is there between the rows, even though I mentioned them to be on consequent rows.
2. Also I dont understand why does the total char row which is hidden initially and is supposed to be displayed on click of enter, does not get displayed on pressing enter. It get displays when I resize the window or remove focus from applet and again gives focus to the applet. It seems to me that the paint process is not happening in this case but I dont understand why? I have made a call to repaint from inside the event handler.

1. Some of your GridBagConstraint values seem randomly created. You'll want to read all tutorials you can find to help straighten you out on this.
2. I'm no expert in AWT but perhaps calling revalidate() in your action listener after you've called setVisible(true) but before you repaint you can get the layout managers to relayout components.

[Suvojit Chakraborty]

Hello Pete,

Thank you for your support. I did some more researchwork on layout and I am now in a better position. I fixed my code and it is ok now. I have understood weightx,weighty now. And I also realized that weightx,weighty is aint important as long as we dont strech applet area.

revalidate() works with swing. However I found that validate() can solve my problem.

My code now

  import java.awt.*;
import java.awt.event.*;
import java.applet.*;
public class appExample extends Applet
{
	Label l1,l2,l3;
	TextField t1,t2,t3;
	GridBagLayout gLay;
	GridBagConstraints gCon;
	Button b;
	Panel p;
	String FontList[];
	Font f;
	public void init()
	{	
		setBackground(Color.BLUE);
		l1=new Label("Name");
		l2=new Label("Address");
		l3=new Label("Total characters");
		l3.setVisible(false);
		t1=new TextField(50);
		t2=new TextField(50);
		t3=new TextField(50);
		t3.setVisible(false);
		b=new Button("Enter");
		b.setBackground(Color.RED);
		p=new Panel();
		f=new Font("Tahoma",Font.BOLD | Font.ITALIC,12);
	
		gLay=new GridBagLayout();
		setLayout(gLay);
		gCon=new GridBagConstraints();
		GraphicsEnvironment ge=GraphicsEnvironment.getLocalGraphicsEnvironment(); 
		FontList = ge.getAvailableFontFamilyNames();
for(int i = 0; i < FontList.length; i++)
		System.out.println(FontList[i] + " ");	
		
		gCon.gridx=1;
		gCon.gridy=4;
		gCon.ipadx=3;
		gCon.ipady=3;
		gCon.gridheight = 1;
		gCon.gridwidth = 1; 
		gCon.fill = GridBagConstraints.NONE;
		gCon.anchor = GridBagConstraints.LINE_END;
		gCon.insets = new Insets(2,2,2,2); 
		//gCon.weightx = 0.5;
		//gCon.weighty = 0.5;
		gLay.setConstraints(l1,gCon);
		l1.setFont(f);
		l1.setForeground(Color.LIGHT_GRAY);
		add(l1);

		
		gCon.gridx=4;
		gCon.gridy=4;
		gCon.ipadx=1;
		gCon.ipady=1;
		gCon.gridheight = 1;
		gCon.gridwidth = 1; 
		gCon.fill = GridBagConstraints.NONE;
		gCon.anchor = GridBagConstraints.LINE_START;	
		gCon.insets = new Insets(2,2,2,2); 
		gCon.weightx = 0.5;
		////gCon.weighty = 0.5;
		gLay.setConstraints(t1,gCon);
		add(t1);

	
		gCon.gridx=1;
		gCon.gridy=6;
		gCon.ipadx=10;
		gCon.ipady=1;
		gCon.gridheight = 1;
		gCon.gridwidth = 1; 
		gCon.fill = GridBagConstraints.NONE;
		gCon.anchor = GridBagConstraints.LINE_END;
		gCon.insets = new Insets(2,2,2,2); 
		//gCon.weightx = 0.1;
		//gCon.weighty = 0.1;
		l2.setForeground(Color.LIGHT_GRAY);
		l2.setFont(f);
		gLay.setConstraints(l2,gCon);
		add(l2);

		
		gCon.gridx=4;
		gCon.gridy=6;
		gCon.ipadx=1;
		gCon.ipady=1;
		gCon.gridheight = 1;
		gCon.gridwidth = 1; 
		gCon.insets =new Insets(4,4,4,4); 
		gCon.fill = GridBagConstraints.NONE;
		gCon.anchor = GridBagConstraints.LINE_START;
		//gCon.weightx = 0.5;
		//gCon.weighty = 0.5;
		gLay.setConstraints(t2,gCon);
		add(t2);

		
		gCon.gridx=1;
		gCon.gridy=8;
		gCon.ipadx=1;
		gCon.ipady=1;
		gCon.gridheight = 1;
		gCon.gridwidth = 1; 
		gCon.fill = GridBagConstraints.NONE;
		gCon.anchor = GridBagConstraints.LINE_END;			
		gCon.insets = new Insets(2,2,2,2); 		
		//gCon.weightx = 0.1;
		//gCon.weighty = 0.1;
		l3.setForeground(Color.LIGHT_GRAY);
		l3.setFont(f);
		gLay.setConstraints(l3,gCon);
		add(l3);

		
		gCon.gridx=4;
		gCon.gridy=8;
		gCon.ipadx=1;
		gCon.ipady=1;
		gCon.gridheight = 1;
		gCon.gridwidth = 1; 
		gCon.anchor = GridBagConstraints.LINE_START;
		gCon.fill = GridBagConstraints.NONE;
		gCon.insets = new Insets(4,4,4,4); 
		//gCon.weightx = 0.5;
		//gCon.weighty = 0.5;
		gLay.setConstraints(t3,gCon);
		add(t3);


		
		gCon.gridx=4;
		gCon.gridy=12;
		gCon.ipadx=10;
		gCon.ipady=1;
		gCon.gridheight = 1;
		gCon.gridwidth = 1; 
		gCon.insets = new Insets(4,4,4,4); 
		gCon.fill = GridBagConstraints.NONE;
		gCon.anchor = GridBagConstraints.LINE_START;
		//gCon.weightx = 0.5;
		//gCon.weighty = 0.5;
		b.setForeground(Color.GREEN);
		b.setFont(f);
		gLay.setConstraints(b,gCon);
		add(b);

		b.addActionListener(new ActionListener()
			{	
				public void actionPerformed(ActionEvent e)
				{
					//repaint();
					int i=t1.getText().length();
					i+=t2.getText().length();
					t3.setText(new Integer(i).toString());
						
						t3.setVisible(true);
					t3.setEditable(false);
					l3.setVisible(true);
					validate();
				}
			});
		
		
	}
	
		private void callPaint()
		{
			repaint();
		}		
	
} 

I also think layouts can be mastered with more and more practical work. I will continue to do experiments with different components og GridBagConstraints to gain better command of the subject. I hope you will help in my silly doubts( if any)

if ever my post if being viewed by someone like me, then I would like to ask them to go through sun's tutorial first throughly and then refer this: this

Thanks again