Home Tutorials Echo3 Grid in Echo3

Questions:Ask|Latest

Grid in Echo3
Posted on: November 25, 2008 By Deepak Kumar

Grid is a two-dimensional structure on which the designers and developers can organize their components in a well and easy to understand manner.

Grid in Echo3

Grid is a two-dimensional structure on which the designers and developers can organize their components in a well and easy to understand manner. Grid class in the server-side API of Echo3 is having the same meaning as in other technologies. In Echo3 it has been provided in nextapp.echo.app package. Grid class is having two constructors to create grid component:

Grid(): default constructor it will create a new Grid with the default size of 2 and horizontal orientation
Grid(int size) will create a new Grid with the specified size given with the default horizontal orientation

In this example we have created a Grid with the default size of 2 and have added two labels into them. We have created one GridServlet which extends the WebContainerServlet and invokes the GridApp by creating a new application instance of it. Here is the full example code of the application as given below:

GridServlet.java


package grid;



import nextapp.echo.app.ApplicationInstance;

import nextapp.echo.webcontainer.WebContainerServlet;



public class GridServlet extends WebContainerServlet {



  public ApplicationInstance newApplicationInstance() {

  return new GridApp();

  }

}

GridApp.java


package grid;



import nextapp.echo.app.ApplicationInstance;

import nextapp.echo.app.ContentPane;

import nextapp.echo.app.Label;

import nextapp.echo.app.Window;

import nextapp.echo.app.*;



import nextapp.echo.app.event.ActionListener;

import nextapp.echo.app.event.ActionEvent;



public class GridApp extends ApplicationInstance {

  

  private  Grid defGrid;

  private  ContentPane contentPane;

  private  WindowPane windowPane;



  public Window init() {

  Window window = new Window();

  window.setTitle("Grid Example");

  defGrid=new Grid();

  defGrid.setBorder(new Border(2,Color.BLUE,Border.STYLE_SOLID));

  defGrid.add(new Label("Item1"));

  defGrid.add(new Label("Item2"));

  contentPane = new ContentPane();

  windowPane = new WindowPane();

  Button def=new Button("Add a default grid of 2 ");

  def.setBorder(new Border(2,Color.BLUE,Border.STYLE_SOLID));

  contentPane.add(def);  

  def.addActionListener(new ActionListener() {

  public void actionPerformed(ActionEvent e)

 {

 contentPane.add(windowPane);

  
    windowPane.setTitle("Default Grid");

  
    windowPane.add(defGrid);

  }

  });  

  window.setContent(contentPane);

  return window;

  }  

}

Output:

When user clicks on the button "Add a default grid of 2" it will invoke a new WindowPane and will add the default grid into it.