Re: GWT 2.5 Cell rendering using uiBinder + image

On Monday, November 5, 2012 7:14:15 PM UTC+2, Thomas Broyer wrote:

On Monday, November 5, 2012 4:23:56 PM UTC+1, Evgeniy Bogdanov wrote:

Hi,

Is there an any example - how to add image into Cell with UiBinder?

There is great example in showcase (http://gwt.google.com/samples/Showcase/Showcase.html#!CwCellList) but without uiBinder.

UiBinder file: 

<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent">

<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder" xmlns:g="urn:import:com.google.gwt.user.client.ui">

<ui:with field='contact' type='com.billmanager.client.model.ClientContact'/>

<ui:with field='res' type='com.billmanager.client.common.Resources'/>

  <g:HTMLPanel>

   <span><ui:text from='{contact.getDisplayName}'/></span>

   <span><ui:text from='{contact.getDisplayEmail}'/></span>

   <g:Image resource='{res.delete}'/>

  </g:HTMLPanel>

</ui:UiBinder> 

 

Do not displays image.

My java class is simple:

 public class ContactCell extends AbstractCell<ClientContact> {

interface MyUiRenderer extends UiRenderer {

void render(SafeHtmlBuilder sb, ClientContact contact);

}

 

private static MyUiRenderer renderer = GWT.create(MyUiRenderer.class);

@Override

public void render(com.google.gwt.cell.client.Cell.Context context, ClientContact value, SafeHtmlBuilder sb) {

renderer.render(sb, value);

}

}

What I thought is to get rendered element (empty) and add image as html, but I don't thing it is the right way. 

You cannot use a widget (<g:HTMLPanel>, <g:Image>) in a Cell. Replace those with HTML elements (<div> for instance); and for displaying an ImageResource in a Cell, use an ImageResourceRenderer to generate the SafeHtml that you can then pass as argument to the UiRenderer and use in the template with <ui:safehtml> (similar to <ui:text>).

Yah, that works.

finally I was able to display image in Cell, but I don't think it is optimal way.

So the UiBinder file:

<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent">

<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder" xmlns:g="urn:import:com.google.gwt.user.client.ui">

<ui:with field='contact' type='com.billmanager.client.model.ClientContact' />

<div>

<span>

<ui:text from='{contact.getDisplayName}' />

</span>

<span>

<ui:text from='{contact.getDisplayEmail}' />

</span>

<span>

<ui:safehtml from='{contact.getDeleteBtn}' />

</span>

</div>

</ui:UiBinder>  

Corresponding Java file:

 public class ContactCell extends AbstractCell<ClientContact> {

private static ImageResourceRenderer imageRenderer = new ImageResourceRenderer();

interface MyUiRenderer extends UiRenderer {

void render(SafeHtmlBuilder sb, ClientContact contact);

}

 

private static MyUiRenderer renderer = GWT.create(MyUiRenderer.class);

@Override

public void render(com.google.gwt.cell.client.Cell.Context context, ClientContact value, SafeHtmlBuilder sb) {

value.setDeleteBtn(imageRenderer.render(Resources.INSTANCE.delete()));

renderer.render(sb, value);

}

}

The problme is I have to add image into ClientContact model. I didn't find other way to pass several arguments into UiRenderer. Any ideas about that?

Thank you, 

--
You received this message because you are subscribed to the Google Groups "Google Web Toolkit" group.
To view this discussion on the web visit https://groups.google.com/d/msg/google-web-toolkit/-/uUOXQWgDd7MJ.
To post to this group, send email to google-web-toolkit@googlegroups.com.
To unsubscribe from this group, send email to google-web-toolkit+unsubscribe@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-web-toolkit?hl=en.