Nico33
19 Jan 2010, 11:06 AM
Hi all,
I'm trying to add a listener on a widget that is on a grid row.
This is my code (based on the GridExample) :
public class GridExample extends LayoutContainer
{
@Override
protected void onRender(Element parent, int index) {
super.onRender(parent, index);
setLayout(new FlowLayout(10));
final NumberFormat currency = NumberFormat.getCurrencyFormat();
final NumberFormat number = NumberFormat.getFormat("0.00");
final NumberCellRenderer<Grid<Stock>> numberRenderer = new NumberCellRenderer<Grid<Stock>>(
currency);
GridCellRenderer<Stock> change = new GridCellRenderer<Stock>() {
public String render(Stock model, String property, ColumnData config, int rowIndex,
int colIndex, ListStore<Stock> store, Grid<Stock> grid) {
double val = (Double) model.get(property);
String style = val < 0 ? "red" : "green";
return "<span style='color:" + style + "'>" + number.format(val) + "</span>";
}
};
GridCellRenderer<Stock> barRenderer = new GridCellRenderer<Stock>()
{
public Object render(final Stock model, String property, ColumnData config, final int rowIndex,
final int colIndex, ListStore<Stock> store, Grid<Stock> grid)
{
ProgressBar progressBar = new ProgressBar();
double val = (Double)model.get(property);
if (val < 0)
val = -val;
progressBar.updateProgress(val, "");
progressBar.setToolTip(String.valueOf((int)(val * 100)) + "%");
progressBar.setWidth(grid.getColumnModel().getColumnWidth(colIndex) - 10);
progressBar.addListener(Events.OnClick, new Listener<BaseEvent>()
{
@Override
public void handleEvent(BaseEvent be)
{
MessageBox.alert("", "click ok", null);
}
});
return progressBar;
}
};
GridCellRenderer<Stock> gridNumber = new GridCellRenderer<Stock>() {
public String render(Stock model, String property, ColumnData config, int rowIndex,
int colIndex, ListStore<Stock> store, Grid<Stock> grid) {
return numberRenderer.render(null, property, model.get(property));
}
};
List<ColumnConfig> configs = new ArrayList<ColumnConfig>();
ColumnConfig column = new ColumnConfig();
column.setId("name");
column.setHeader("Company");
column.setWidth(200);
configs.add(column);
column = new ColumnConfig();
column.setId("symbol");
column.setHeader("Symbol");
column.setWidth(100);
configs.add(column);
column = new ColumnConfig();
column.setId("last");
column.setHeader("Last");
column.setAlignment(HorizontalAlignment.RIGHT);
column.setWidth(75);
column.setRenderer(gridNumber);
configs.add(column);
column = new ColumnConfig("change", "Change", 100);
column.setAlignment(HorizontalAlignment.RIGHT);
column.setRenderer(barRenderer);
configs.add(column);
column = new ColumnConfig("date", "Last Updated", 100);
column.setAlignment(HorizontalAlignment.RIGHT);
column.setDateTimeFormat(DateTimeFormat.getShortDateFormat());
configs.add(column);
ListStore<Stock> store = new ListStore<Stock>();
store.add(TestData.getStocks());
ColumnModel cm = new ColumnModel(configs);
ContentPanel cp = new ContentPanel();
cp.setBodyBorder(false);
cp.setHeading("Basic Grid");
cp.setButtonAlign(HorizontalAlignment.CENTER);
cp.setLayout(new FitLayout());
cp.setSize(600, 300);
Grid<Stock> grid = new Grid<Stock>(store, cm);
grid.setStyleAttribute("borderTop", "none");
grid.setAutoExpandColumn("name");
grid.setBorders(true);
grid.setStripeRows(true);
cp.add(grid);
add(cp);
}
}
So, the interessant part is here :
GridCellRenderer<Stock> barRenderer = new GridCellRenderer<Stock>()
{
public Object render(final Stock model, String property, ColumnData config, final int rowIndex,
final int colIndex, ListStore<Stock> store, Grid<Stock> grid)
{
ProgressBar progressBar = new ProgressBar();
[...]
progressBar.addListener(Events.OnClick, new Listener<BaseEvent>()
{
@Override
public void handleEvent(BaseEvent be)
{
MessageBox.alert("", "click ok", null);
}
});
return progressBar;
}
};This is not working, neither with the OnMouseDown event and the RowClick event nor the CellClick event.
But this is working with the OnMouseMove event for example.
How can I react to the click event on the progress bar widget that is on the grid ?
Thanks in advance for any help
I'm trying to add a listener on a widget that is on a grid row.
This is my code (based on the GridExample) :
public class GridExample extends LayoutContainer
{
@Override
protected void onRender(Element parent, int index) {
super.onRender(parent, index);
setLayout(new FlowLayout(10));
final NumberFormat currency = NumberFormat.getCurrencyFormat();
final NumberFormat number = NumberFormat.getFormat("0.00");
final NumberCellRenderer<Grid<Stock>> numberRenderer = new NumberCellRenderer<Grid<Stock>>(
currency);
GridCellRenderer<Stock> change = new GridCellRenderer<Stock>() {
public String render(Stock model, String property, ColumnData config, int rowIndex,
int colIndex, ListStore<Stock> store, Grid<Stock> grid) {
double val = (Double) model.get(property);
String style = val < 0 ? "red" : "green";
return "<span style='color:" + style + "'>" + number.format(val) + "</span>";
}
};
GridCellRenderer<Stock> barRenderer = new GridCellRenderer<Stock>()
{
public Object render(final Stock model, String property, ColumnData config, final int rowIndex,
final int colIndex, ListStore<Stock> store, Grid<Stock> grid)
{
ProgressBar progressBar = new ProgressBar();
double val = (Double)model.get(property);
if (val < 0)
val = -val;
progressBar.updateProgress(val, "");
progressBar.setToolTip(String.valueOf((int)(val * 100)) + "%");
progressBar.setWidth(grid.getColumnModel().getColumnWidth(colIndex) - 10);
progressBar.addListener(Events.OnClick, new Listener<BaseEvent>()
{
@Override
public void handleEvent(BaseEvent be)
{
MessageBox.alert("", "click ok", null);
}
});
return progressBar;
}
};
GridCellRenderer<Stock> gridNumber = new GridCellRenderer<Stock>() {
public String render(Stock model, String property, ColumnData config, int rowIndex,
int colIndex, ListStore<Stock> store, Grid<Stock> grid) {
return numberRenderer.render(null, property, model.get(property));
}
};
List<ColumnConfig> configs = new ArrayList<ColumnConfig>();
ColumnConfig column = new ColumnConfig();
column.setId("name");
column.setHeader("Company");
column.setWidth(200);
configs.add(column);
column = new ColumnConfig();
column.setId("symbol");
column.setHeader("Symbol");
column.setWidth(100);
configs.add(column);
column = new ColumnConfig();
column.setId("last");
column.setHeader("Last");
column.setAlignment(HorizontalAlignment.RIGHT);
column.setWidth(75);
column.setRenderer(gridNumber);
configs.add(column);
column = new ColumnConfig("change", "Change", 100);
column.setAlignment(HorizontalAlignment.RIGHT);
column.setRenderer(barRenderer);
configs.add(column);
column = new ColumnConfig("date", "Last Updated", 100);
column.setAlignment(HorizontalAlignment.RIGHT);
column.setDateTimeFormat(DateTimeFormat.getShortDateFormat());
configs.add(column);
ListStore<Stock> store = new ListStore<Stock>();
store.add(TestData.getStocks());
ColumnModel cm = new ColumnModel(configs);
ContentPanel cp = new ContentPanel();
cp.setBodyBorder(false);
cp.setHeading("Basic Grid");
cp.setButtonAlign(HorizontalAlignment.CENTER);
cp.setLayout(new FitLayout());
cp.setSize(600, 300);
Grid<Stock> grid = new Grid<Stock>(store, cm);
grid.setStyleAttribute("borderTop", "none");
grid.setAutoExpandColumn("name");
grid.setBorders(true);
grid.setStripeRows(true);
cp.add(grid);
add(cp);
}
}
So, the interessant part is here :
GridCellRenderer<Stock> barRenderer = new GridCellRenderer<Stock>()
{
public Object render(final Stock model, String property, ColumnData config, final int rowIndex,
final int colIndex, ListStore<Stock> store, Grid<Stock> grid)
{
ProgressBar progressBar = new ProgressBar();
[...]
progressBar.addListener(Events.OnClick, new Listener<BaseEvent>()
{
@Override
public void handleEvent(BaseEvent be)
{
MessageBox.alert("", "click ok", null);
}
});
return progressBar;
}
};This is not working, neither with the OnMouseDown event and the RowClick event nor the CellClick event.
But this is working with the OnMouseMove event for example.
How can I react to the click event on the progress bar widget that is on the grid ?
Thanks in advance for any help