Recreating the CellList Showcase example with Editors

150 views
Skip to first unread message

Maiku

unread,
Oct 21, 2011, 2:32:51 AM10/21/11
to Google Web Toolkit
Hello,

I have a case for a dialog that operates very similar to the CellList
example included in the Showcase. That is, I need to have the ability
to add items to a list, select them, and display a form (within the
same dialog) for the selected item.

I was trying to set it up with an implementation combination of
HasDataEditor and ValueAwareEditor but even if I get the value from
the CellList's SelectionModel I don't get how I can set the values on
an editor that is dynamically displayed. (I thought maybe of using
another RequestFactoryEditorDriver on the inner editor but this
doesn't seem to work...)

Then during my searches I found some very small amount of information
on ValuePicker. However, I cannot grasp from the code or sparse
documentation whether ValuePicker (as the name implies) is made for
picking an option out of a preset list (like selecting an enum value)
or for getting the value from a dynamic list for use in a separate
editor?

Can anyone provide any clues as to whether ValuePicker is what I
should be using or if there is some way to achieve the concept of a
form displaying the value of item selected from a list?

Thomas Broyer

unread,
Oct 21, 2011, 5:46:26 AM10/21/11
to google-we...@googlegroups.com


On Friday, October 21, 2011 8:32:51 AM UTC+2, Maiku wrote:
Hello,

I have a case for a dialog that operates very similar to the CellList
example included in the Showcase. That is, I need to have the ability
to add items to a list, select them, and display a form (within the
same dialog) for the selected item.

I was trying to set it up with an implementation combination of
HasDataEditor and ValueAwareEditor but even if I get the value from
the CellList's SelectionModel I don't get how I can set the values on
an editor that is dynamically displayed. (I thought maybe of using
another RequestFactoryEditorDriver on the inner editor but this
doesn't seem to work...)

That's how you should do it: a distinct RequestFactoryEditorDriver.
We're doing just that, so I can guarantee that it works (or can be made to work).

You'd maybe want to also implement HasRequestContext so you can pass the same RequestContext to the "child" RequestFactoryEditorDriver that you use in the "parent one".

Then during my searches I found some very small amount of information
on ValuePicker. However, I cannot grasp from the code or sparse
documentation whether ValuePicker (as the name implies) is made for
picking an option out of a preset list (like selecting an enum value)
or for getting the value from a dynamic list for use in a separate
editor?

The former.

But that (probably, you'd have to try it) doesn't preclude the latter usage; you wouldn't use the ValuePicker as an editor by itself though, just as a widget around a CellList (that CellList would be be used with an HasDataEditor to populate it "dynamically").

Maiku

unread,
Oct 24, 2011, 12:33:44 PM10/24/11
to Google Web Toolkit
Hi Thomas,


After much tinkering, I managed to get it to work but I have 2
questions:

1. It seems to work equally well with ValuePicker or with using the
actual SelectionModel (since I guess the former is just hiding the
implementation of the later) with the exception that either way it
will select multiple rows if my ValueProxy has the same values as
another ValueProxy in the list. I tried to use a KeyProvider that
looks at the hashCode but this has the same effect (which I guess
makes sense if the hash is based on the values?) So is there a way
to correct this behaviour without adding extraneous fields to my model
or adding a uniqifier to the string?

2. I am trying to "generify" my dialog that contains the cellList but
I have hit a snag because I require a RequestFactoryEditorDriver
interface to accompany the inner Editor. However, if I use the
following code I get an error like "... is assignable to Editor raw
type but a Parameterization is required."

interface Driver<A, B extends Editor<A>> extends
RequestFactoryEditorDriver<A, B>
{
}

private final Driver<T, E> driver =
GWT.create(Driver.class);

-------------------

Here is the full source code in case there is some other obvious way I
could be doing this without knowing it:


public class DialogCellListEditor<T extends BaseProxy, E extends
Editor<T> & IsWidget> extends DialogBox implements
IsEditor<HasDataEditor<T>>, HasRequestContext<T>
{

/**
* Standard interface to allow the binding of the declarative
layout to this
* Editor.
*/
interface DialogCellListEditorUiBinder extends UiBinder<Widget,
DialogCellListEditor<?, ?>>
{
}

interface Driver<A, B extends Editor<A>> extends
RequestFactoryEditorDriver<A, B>
{
}

private static final DialogCellListEditorUiBinder UIBINDER =
GWT.create(DialogCellListEditorUiBinder.class);

private final Driver<T, E> driver =
GWT.create(Driver.class);

private RequestContext requestContext;

private Class<T> proxyClass;

private T currentProxy;

private HasDataEditor<T> dataEditor;

@Ignore
private E mainEditor;

@UiField
FlowPanel container;
@UiField
Button buttonAdd;
@UiField
Button buttonClose;

CellList<T> cellList;

private final SingleSelectionModel<T> selectionModel;

// TODO Remove. This was used for uniquely identifying new entries
private int counter = 0;

/**
* Constructor. Binds the declarative XML layout to this Editor and
creates
* the backing ListEditor.
*/
public DialogCellListEditor(Class<T> proxyClass, AbstractCell<T>
cell, E mainEditor)
{
setWidget(UIBINDER.createAndBindUi(this));

this.proxyClass = proxyClass;
this.mainEditor = mainEditor;

// TODO As this is basically the same as comparing the objects,
it may not be adding anything
ProvidesKey<T> keyProvider = new ProvidesKey<T>()
{
@Override
public Object getKey(T item)
{
return (null == item) ? null : item.hashCode();
}
};

cellList = new CellList<T>(cell, keyProvider);

dataEditor = HasDataEditor.of(cellList);

selectionModel = new SingleSelectionModel<T>(keyProvider);
cellList.setSelectionModel(selectionModel);
selectionModel.addSelectionChangeHandler(new
SelectionChangeEvent.Handler()
{

@Override
public void onSelectionChange(SelectionChangeEvent event)
{
if (null != currentProxy)
{
// Dealing with the previously selected object. Update
the list with the new version.
int index =
dataEditor.getList().indexOf(currentProxy);

T temp =
driver.flush().edit(dataEditor.getList().remove(index));
dataEditor.getList().add(index, temp);
}

// Dealing with the object now selected
currentProxy = selectionModel.getSelectedObject();
driver.initialize(DialogCellListEditor.this.mainEditor);
driver.edit(currentProxy, requestContext);
}
});

container.add(cellList);

}

/**
* Creates a new instance of a LanguageProxy and displays it in a
new
* LanguageEditor added to this screen.
*
* @param event
* The ClickEvent triggered by the user clicking
buttonAdd.
*/
@UiHandler(value = "buttonAdd")
void onClickAdd(ClickEvent event)
{
T temp = requestContext.create(proxyClass);
dataEditor.getList().add(temp);
}

/**
* Closes this dialog.
*
* @param event
* The ClickEvent triggered by the user clicking
buttonClose.
*/
@UiHandler(value = "buttonClose")
void onClickClose(ClickEvent event)
{
this.hide();
}

@Override
public void setRequestContext(RequestContext ctx)
{
requestContext = ctx;
}

@Override
public HasDataEditor<T> asEditor()
{
return dataEditor;
}

}
Reply all
Reply to author
Forward
0 new messages