Auto Height Grid In EXT GWT

Auto Height Grid In EXT Google Web Toolkit

1. package com.extjs.gxt.samples.client.examples.grid;  
2.   
3. import java.util.ArrayList;  
4. import java.util.List;  
5.   
6. import com.extjs.gxt.samples.resources.client.Resources;  
7. import com.extjs.gxt.samples.resources.client.model.Plant;  
8. import com.extjs.gxt.ui.client.Style.HorizontalAlignment;  
9. import com.extjs.gxt.ui.client.data.ModelData;  
10. import com.extjs.gxt.ui.client.event.ButtonEvent;  
11. import com.extjs.gxt.ui.client.event.ColumnModelEvent;  
12. import com.extjs.gxt.ui.client.event.ComponentEvent;  
13. import com.extjs.gxt.ui.client.event.Events;  
14. import com.extjs.gxt.ui.client.event.Listener;  
15. import com.extjs.gxt.ui.client.event.SelectionListener;  
16. import com.extjs.gxt.ui.client.store.ListStore;  
17. import com.extjs.gxt.ui.client.store.Store;  
18. import com.extjs.gxt.ui.client.store.StoreEvent;  
19. import com.extjs.gxt.ui.client.util.DateWrapper;  
20. import com.extjs.gxt.ui.client.widget.ContentPanel;  
21. import com.extjs.gxt.ui.client.widget.LayoutContainer;  
22. import com.extjs.gxt.ui.client.widget.button.Button;  
23. import com.extjs.gxt.ui.client.widget.form.CheckBox;  
24. import com.extjs.gxt.ui.client.widget.form.DateField;  
25. import com.extjs.gxt.ui.client.widget.form.NumberField;  
26. import com.extjs.gxt.ui.client.widget.form.SimpleComboBox;  
27. import com.extjs.gxt.ui.client.widget.form.TextField;  
28. import com.extjs.gxt.ui.client.widget.form.ComboBox.TriggerAction;  
29. import com.extjs.gxt.ui.client.widget.grid.CellEditor;  
30. import com.extjs.gxt.ui.client.widget.grid.CheckColumnConfig;  
31. import com.extjs.gxt.ui.client.widget.grid.ColumnConfig;  
32. import com.extjs.gxt.ui.client.widget.grid.ColumnModel;  
33. import com.extjs.gxt.ui.client.widget.grid.EditorGrid;  
34. import com.extjs.gxt.ui.client.widget.layout.FitLayout;  
35. import com.extjs.gxt.ui.client.widget.layout.FlowLayout;  
36. import com.extjs.gxt.ui.client.widget.toolbar.ToolBar;  
37. import com.google.gwt.i18n.client.DateTimeFormat;  
38. import com.google.gwt.i18n.client.NumberFormat;  
39. import com.google.gwt.user.client.Element;  
40.   
41. public class AutoHeightGridExample extends LayoutContainer {  
42.   private EditorGrid<Plant> grid;  
43.   private ContentPanel cp;  
44.   
45.   protected Plant createPlant() {  
46.     Plant plant = new Plant();  
47.     plant.setName("New Plant 1");  
48.     plant.setLight("Mostly Shady");  
49.     plant.setPrice(0);  
50.     plant.setAvailable(new DateWrapper().clearTime().asDate());  
51.     plant.setIndoor(false);  
52.     return plant;  
53.   }  
54.   
55.   protected void doAutoHeight() {  
56.     if (grid.isViewReady()) {  
57.       grid.getView().getScroller().setStyleAttribute("overflowY", "hidden");  
58.       cp.setHeight((grid.getView().getBody().isScrollableX() ? 19 : 0) + grid.el().getFrameWidth("tb")  
59.           + grid.getView().getHeader().getHeight() + cp.getFrameHeight()  
60.           + grid.getView().getBody().firstChild().getHeight());  
61.     }  
62.   }  
63.   
64.   @Override  
65.   protected void onRender(Element parent, int index) {  
66.     super.onRender(parent, index);  
67.   
68.     setLayout(new FlowLayout(10));  
69.   
70.     List<ColumnConfig> configs = new ArrayList<ColumnConfig>();  
71.   
72.     ColumnConfig column = new ColumnConfig();  
73.     column.setId("name");  
74.     column.setHeader("Common Name");  
75.     column.setWidth(220);  
76.   
77.     TextField<String> text = new TextField<String>();  
78.     text.setAllowBlank(false);  
79.     column.setEditor(new CellEditor(text));  
80.     configs.add(column);  
81.   
82.     final SimpleComboBox<String> combo = new SimpleComboBox<String>();  
83.     combo.setForceSelection(true);  
84.     combo.setTriggerAction(TriggerAction.ALL);  
85.     combo.add("Shade");  
86.     combo.add("Mostly Shady");  
87.     combo.add("Sun or Shade");  
88.     combo.add("Mostly Sunny");  
89.     combo.add("Sunny");  
90.   
91.     CellEditor editor = new CellEditor(combo) {  
92.       @Override  
93.       public Object preProcessValue(Object value) {  
94.         if (value == null) {  
95.           return value;  
96.         }  
97.         return combo.findModel(value.toString());  
98.       }  
99.   
100.       @Override  
101.       public Object postProcessValue(Object value) {  
102.         if (value == null) {  
103.           return value;  
104.         }  
105.         return ((ModelData) value).get("value");  
106.       }  
107.     };  
108.   
109.     column = new ColumnConfig();  
110.     column.setId("light");  
111.     column.setHeader("Light");  
112.     column.setWidth(130);  
113.     column.setEditor(editor);  
114.     configs.add(column);  
115.   
116.     column = new ColumnConfig();  
117.     column.setId("price");  
118.     column.setHeader("Price");  
119.     column.setAlignment(HorizontalAlignment.RIGHT);  
120.     column.setWidth(70);  
121.     column.setNumberFormat(NumberFormat.getCurrencyFormat());  
122.     column.setEditor(new CellEditor(new NumberField()));  
123.   
124.     configs.add(column);  
125.   
126.     DateField dateField = new DateField();  
127.     dateField.getPropertyEditor().setFormat(DateTimeFormat.getFormat("MM/dd/y"));  
128.   
129.     column = new ColumnConfig();  
130.     column.setId("available");  
131.     column.setHeader("Available");  
132.     column.setWidth(95);  
133.     column.setEditor(new CellEditor(dateField));  
134.     column.setDateTimeFormat(DateTimeFormat.getFormat("MMM dd yyyy"));  
135.     configs.add(column);  
136.   
137.     CheckColumnConfig checkColumn = new CheckColumnConfig("indoor", "Indoor?", 55);  
138.     CellEditor checkBoxEditor = new CellEditor(new CheckBox());  
139.     checkColumn.setEditor(checkBoxEditor);  
140.     configs.add(checkColumn);  
141.   
142.     final ListStore<Plant> store = new ListStore<Plant>();  
143.   
144.     ColumnModel cm = new ColumnModel(configs);  
145.   
146.     cp = new ContentPanel();  
147.     cp.setHeading("Auto Height Edit Plants");  
148.     cp.setFrame(true);  
149.     cp.setIcon(Resources.ICONS.table());  
150.     cp.setWidth(600);  
151.     cp.setLayout(new FitLayout());  
152.   
153.     grid = new EditorGrid<Plant>(store, cm);  
154.     grid.setAutoExpandColumn("name");  
155.     grid.setBorders(true);  
156.     grid.addPlugin(checkColumn);  
157.     cp.add(grid);  
158.   
159.     ToolBar toolBar = new ToolBar();  
160.     Button add = new Button("Add Plant");  
161.     add.addSelectionListener(new SelectionListener<ButtonEvent>() {  
162.   
163.       @Override  
164.       public void componentSelected(ButtonEvent ce) {  
165.   
166.         grid.stopEditing();  
167.         store.insert(createPlant(), 0);  
168.         grid.startEditing(0, 0);  
169.   
170.       }  
171.   
172.     });  
173.     toolBar.add(add);  
174.     cp.setTopComponent(toolBar);  
175.     cp.setButtonAlign(HorizontalAlignment.CENTER);  
176.     cp.addButton(new Button("Reset", new SelectionListener<ButtonEvent>() {  
177.   
178.       @Override  
179.       public void componentSelected(ButtonEvent ce) {  
180.         store.rejectChanges();  
181.       }  
182.     }));  
183.   
184.     cp.addButton(new Button("Save", new SelectionListener<ButtonEvent>() {  
185.   
186.       @Override  
187.       public void componentSelected(ButtonEvent ce) {  
188.         store.commitChanges();  
189.       }  
190.     }));  
191.   
192.     add(cp);  
193.     store.insert(createPlant(), 0);  
194.     store.insert(createPlant(), 1);  
195.     store.insert(createPlant(), 2);  
196.   
197.     grid.addListener(Events.ViewReady, new Listener<ComponentEvent>() {  
198.       public void handleEvent(ComponentEvent be) {  
199.         grid.getStore().addListener(Store.Add, new Listener<StoreEvent<Plant>>() {  
200.           public void handleEvent(StoreEvent<Plant> be) {  
201.             doAutoHeight();  
202.           }  
203.         });  
204.         doAutoHeight();  
205.       }  
206.     });  
207.     grid.addListener(Events.ColumnResize, new Listener<ComponentEvent>() {  
208.       public void handleEvent(ComponentEvent be) {  
209.         doAutoHeight();  
210.       }  
211.     });  
212.     grid.getColumnModel().addListener(Events.HiddenChange, new Listener<ColumnModelEvent>() {  
213.       public void handleEvent(ColumnModelEvent be) {  
214.         doAutoHeight();  
215.       }  
216.     });  
217.   }  
218. }  

Posted by SKILLS DEVELOPEMENT

For Further Reading,