Steps to apply CardLayout

1) Create a Panel(named: cardPanel) and set its layout to CardLayout.
2) Add another Panels(named: firstP, secondP, thirdP) to cardPanel as a Card. Give unique name to each panel.
3) Call CardLayout.show(cardPanel, “name of card”); to make desired card visible.

Program:

import java.awt.*;
import java.applet.Applet;
import java.awt.event.*;

public class CardLayoutDemo extends Applet implements ActionListener
{
  Panel cardPanel;        
  Panel firstP, secondP, thirdP;  
  Panel buttonP;                  
  Button first, second, third;    
  CardLayout ourLayout;           
  
  public void init()
  {
    cardPanel = new Panel();
    ourLayout = new CardLayout();    
    cardPanel.setLayout (ourLayout);
	
    firstP = new Panel();
    firstP.setBackground(Color.blue);
    
    secondP = new Panel();
    secondP.setBackground(Color.yellow);
    
    thirdP = new Panel();
    thirdP.setBackground(Color.green);
    
    first = new Button("First");
    first.addActionListener(this);
    
    second = new Button("Second");
    second.addActionListener(this);
    
    third = new Button("Third");
    third.addActionListener(this);
    
    buttonP = new Panel();   // Panel's default Layout manager is FlowLayout
    buttonP.add(first);
    buttonP.add(second);
    buttonP.add(third);
    
    this.setLayout(new BorderLayout());
    this.add(buttonP, BorderLayout.SOUTH);
    this.add(cardPanel, BorderLayout.CENTER);
    
    cardPanel.add(firstP, "First");     //blue
    cardPanel.add(secondP, "Second");   //yellow
    cardPanel.add(thirdP, "Third");     //green
    
  }
  
  
  public void actionPerformed(ActionEvent e)
  {
    if (e.getSource() == first)
      ourLayout.show(cardPanel, "First");
      
    if (e.getSource() == second)
      ourLayout.show(cardPanel, "Second");
      
    if (e.getSource() == third)
      ourLayout.show(cardPanel, "Third");
  }
}

/*
<applet code="CardLayoutDemo" width="500" height="500"></applet>
*/

Output:

The post CardLayout appeared first on Ankit Virparia.

We can remove the existing layout by calling a method: setLayout(null); and then even if we try to components, that will not be displayed. To make component visible we need to invoke seBounds(x_cord, y_cord, width, height) method on all the components.

Program:

import java.applet.*;
import java.awt.*;

public class NullLayoutDemo extends Applet
{
	Button b1, b2, b3;
	public void init()
	{
		setBackground(Color.green);
		setLayout(null);
		
		b1 = new Button("Button1");
		b2 = new Button("Button2");
		b3 = new Button("Button3");
		
		add(b1);
		add(b2);
		add(b3);
		
		b1.setBounds(50,100, 150, 50);
		b2.setBounds(50,200, 150, 50);
		b3.setBounds(50,300, 150, 50);
	}	
}
/*
<applet code="NullLayoutDemo" width="500" height="500"></applet>
*/

Output:

The post Custom Layout or null Layout appeared first on Ankit Virparia.

borderLayout with normal add() method

Program:

import java.applet.*;
import java.awt.*;

public class BorderLayoutDemo extends Applet
{
	Button b1, b2, b3;
	public void init()
	{
		BorderLayout bl = new BorderLayout(20,20);
		setLayout(bl);
		
		b1 = new Button("Button1");
		b2 = new Button("Button2");
		b3 = new Button("Button3");
		
		add(b1);
		add(b2);
		add(b3);
	}	
}
/*
<applet code="BorderLayoutDemo" width="500" height="500"></applet>
*/

Output:

BorderLayout with proper add() method

Program:

import java.applet.*;
import java.awt.*;

public class BorderLayoutAddDemo extends Applet
{
	Button b1, b2, b3;
	public void init()
	{
		BorderLayout bl = new BorderLayout();
		setLayout(bl);
		
		b1 = new Button("Button1");
		b2 = new Button("Button2");
		b3 = new Button("Button3");
		
		add(b1, BorderLayout.NORTH);
		add(b2, BorderLayout.WEST);
		add(b3);
	}	
}
/*
<applet code="BorderLayoutAddDemo" width="500" height="500"></applet>
*/

Output:

By default the center part will only be visible. If we do not add any component in any other part. CENTER part will occupy the complete area. That means, In case we have used NORTH, CENTER and WEST directions then other areas will not be created at all as shown in the applet above. To change the size occupied by any of the direction. we have to invoke a setPreferredSize() method on the component which we have added.

Re-sizing a part of BorderLayout

Program:

import java.applet.*;
import java.awt.*;

public class BorderLayoutAddResizeDemo extends Applet
{
	Button b1, b2, b3;
	public void init()
	{
		BorderLayout bl = new BorderLayout();
		setLayout(bl);
		
		b1 = new Button("Button1");
		b2 = new Button("Button2");
		b3 = new Button("Button3");
		b1.setPreferredSize(new Dimension(500,250));
		add(b1, BorderLayout.NORTH);
		add(b2, BorderLayout.WEST);
		add(b3);
	}	
}
/*
<applet code="BorderLayoutAddResizeDemo" width="500" height="500"></applet>
*/

Output:

Complete BorderLayout

Program:

import java.applet.*;
import java.awt.*;

public class BorderLayoutCompleteDemo extends Applet
{
	Button b1, b2, b3;
	public void init()
	{
		BorderLayout bl = new BorderLayout();
		setLayout(bl);
		
		b1 = new Button("Button1");
		b2 = new Button("Button2");
		b3 = new Button("Button3");
		add(b1, BorderLayout.NORTH);
		add(b2, BorderLayout.WEST);
		add(b3);
		add(new Button("Button4"),BorderLayout.SOUTH);
		add(new Button("Button5"),BorderLayout.EAST);
	}	
}
/*
<applet code="BorderLayoutCompleteDemo" width="500" height="500"></applet>
*/

Output:

The post BorderLayout appeared first on Ankit Virparia.

GridLayout Constructors

1. GridLayout()

   This constructor creates one column for each component we add. Only 1 row will be created.

2. GridLayout(int rows, int cols)

   This constructor creates specified number of rows and columns.

3. GridLayout(int rows, int cols, int hgap, int vgap)

   This constructor creates specified number of rows and columns plus sets the given horizontal and vertical space between components.

As discussed in the above constructor summary, We have a constructor which takes rows and columns value as integers. Here the constrain/characteristic is: GridLayout is rigid about row creation. and It’s flexible in terms of column creation. For example, If we ask GridLayout to create 20 rows and 20 columns for us and we add only 3 components in Grid. In that case: It automatically understands our requirement and create 20 rows(Its for sure!) and 1 column only(Its Flexible!). Because 20 rows can accommodate our all components. In case we add 21 components, it will create 2 columns.

GridLayout with 2 rows and 2 columns

Program:

import java.applet.*;
import java.awt.*;

public class GridLayoutDemo extends Applet
{
	Button b1, b2, b3;
	public void init()
	{
		GridLayout gl = new GridLayout(2,2);
		setLayout(gl);
		
		b1 = new Button("Button1");
		b2 = new Button("Button2");
		b3 = new Button("Button3");
		
		add(b1);
		add(b2);
		add(b3);
	}	
}
/*
<applet code="GridLayoutDemo" width="500" height="200"></applet>
*/

Output:

GridLayout with 20 rows 20 columns

Program:

import java.applet.*;
import java.awt.*;

public class GridLayout20Demo extends Applet
{
	Button b1, b2, b3;
	public void init()
	{
		GridLayout gl = new GridLayout(20,20);
		setLayout(gl);
		
		b1 = new Button("Button1");
		b2 = new Button("Button2");
		b3 = new Button("Button3");
		
		add(b1);
		add(b2);
		add(b3);
	}	
}
/*
<applet code="GridLayout20Demo" width="500" height="500"></applet>
*/

Output:

The post GridLayout appeared first on Ankit Virparia.

FlowLayout Constructors

1. FlowLayout()

   This constructs is used to create a center aligned and a default 5-unit horizontal and vertical gap based FlowLayout object.

2. FlowLayout(int align)

   This constructs is used to create the specified alignment and a default 5-unit horizontal and vertical gap based FlowLayout object.

3. FlowLayout(int align, int hgap, int vgap)

   This constructor is used to create a new flow layout with the indicated alignment and the indicated horizontal and vertical gaps.

As discussed in the above constructor summary, We have a constructor which takes alignment value as integer. Here the problem is: We can not remember exact value for each alignment. For this , Java provides one easy option in which we have to pass a static VARIABLE as a argument. Again that static value will get from the same class we are using. For example, Here in our case we would like to pass an integer value which creates a LEFT aligned layout for us. For that we can use a public final and static int variable of FlowLayout class which is named as LEFT. And as you know: To access a static variable/method we don’t need object. That can be done by simply writing class name. i.e. FlowLayout.LEFT. So the syntax to change the layout of our base class will be this.setLayout(new FlowLayout()); which will create a CENTER aligned FlowLayout. For left Alignment we can use this.setLayout(new FlowLayout(FlowLayout.LEFT));

FlowLayout Alignments

1. CENTER

   This creates a center aligned FlowLayout. Components will be aligned to center.

2. LEFT

   This creates a left aligned FlowLayout. Components will be aligned to left.

3. RIGHT

   This creates a right aligned FlowLayout. Components will be aligned to right.

4. LEADING

   This aligns all the components to the LEADING edge of parent/container component. In case the parent component is Right aligned and we use LEADING, the alignment which will be generated will be Right.

5. TRAILING

   This aligns all the components to the TRAILING edge of parent/container component. In case the parent component is Right aligned and we use TRAILING, the alignment which will be generated will be LEFT.

FlowLayout with Center Alignment

Program:

import java.applet.*;
import java.awt.*;

public class FlowLayoutDemo extends Applet
{
	Button b1, b2, b3;
	public void init()
	{
		FlowLayout fl = new FlowLayout();
		setLayout(fl);
		
		b1 = new Button("Button1");
		b2 = new Button("Button2");
		b3 = new Button("Button3");
		
		add(b1);
		add(b2);
		add(b3);
	}	
}
/*
<applet code="FlowLayoutDemo" width="500" height="200"></applet>
*/

Output:

FlowLayout with LEFT Alignment

Program:

import java.applet.*;
import java.awt.*;

public class FlowLayoutLeftDemo extends Applet
{
	Button b1, b2, b3;
	public void init()
	{
		FlowLayout fl = new FlowLayout(FlowLayout.LEFT);
		setLayout(fl);
		
		b1 = new Button("Button1");
		b2 = new Button("Button2");
		b3 = new Button("Button3");
		
		add(b1);
		add(b2);
		add(b3);
	}	
}
/*
<applet code="FlowLayoutLeftDemo" width="500" height="200"></applet>
*/

Output:

The post FlowLayout appeared first on Ankit Virparia.