Blog Archives

Auto adjust Grid

Posted on February 26, 2013
by

If you have a Grid within a Panel or Window class and the Grid will not be automatically adjusted, you will have to check the complete widget hierarchy for valid LayoutManagers. All parent widgets of the Grid must use the layout sytem. Then we can use

  grid.getView().setAutoFill(true);
  grid.getView().setForceFit(true);

The parent Panel or Window should define an minimal height and width.

  window.setLayout(new FitLayout());
  window.setMinWidth(500);
  window.setMinHeight(400);

Every resize operation on the Panel/Window should resize the Grid too. If you forget the layout on the window or its panels, the grid will not be displayed till you set a height and width explicitly.

Leave a Reply ?

Tooltips within Grid

Posted on November 30, 2011
by

If you need tooltips within a grid you should create your own GridCellRenderer.

public class MyData extends BaseModelData {
   public MyData(String name, Date date) {
      set("name", name);
      set("date", date);
   }
}

public class MyPanel extends ContentPanel {
   public MyPanel() {
      // ...
      ListStore store = new ListStore();
      Grid grid = new Grid(store, new MyColumnModel());
      // ...
      add(grid);
      new QuickTip(grid);  // don't forget it!
   }
}

public class MyColumnModel extends ColumnModel {
   public MyColumnModel() {
      super(new ArrayList());

      // our ModelData has two properties: name and date
      ColumnConfig aCol = new ColumnConfig("name", "Name", 300);
      aCol.setRenderer(new NameRenderer());
      configs.add(aCol);

      ColumnConfig bCol = new ColumnConfig("date", "Date", 100);
      bCol.setRenderer(new DateRenderer());
      configs.add(bCol);
   }

   private class NameRenderer implements GridCellRenderer {
      public Object render(MyData model, String property, ColumnData config, int rowIndex, int colIndex, ListStore store, Grid grid) {
         return "<div>" + model.get(property) + "</div>";
      }
   }

   private class DateRenderer implements GridCellRenderer {
      public Object render(MyData model, String property, ColumnData config, int rowIndex, int colIndex, ListStore store, Grid grid) {
         String date = DateTimeFormat.getFormat("dd.MM.yyyy").format(model.get("date"));
         return "<div qtitle=\"Date\" qtip=\"a date with format dd.MM.yyyy\">" + date + "</div>";
      }
   }
}

We can return HTML code from the renderer, which has “qtitle” and “qtip” attributes, which are used by the QuickTip instance.

Leave a Reply ?