Databases
StackOverflow2013
Postsdbo
POListView gwt how to organise images
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POListView gwt how to organise images
    text
    copied!<p>Unfortunately I can't post images yet, but I'll try to explain. I have images and I'd like to use them like buttons like in blank page in chrome browser or opera. But as a result I have line with the image and the next image is on the next line and all the line (not only image) is active. </p> <p>So, how can I do this. I've been trying to found any differences(important differences) between my code and the code from example given on ext gwt 2.2 explorer site. Here is my code:</p> <pre><code>public class QueryPanel extends LayoutContainer { public QueryPanel(final String customerId, final String login, final String password){ setLayout(new FitLayout()); final ContentPanel gallery = new ContentPanel(); gallery.setHeading("Reports"); gallery.setLayout(new FitLayout()); gallery.setCollapsible(true); gallery.setAnimCollapse(false); gallery.setFrame(true); gallery.setId("images-view"); gallery.setWidth(535); ListStore&lt;GalleryButtonModel&gt; store = new ListStore&lt;GalleryButtonModel&gt;(); store.add(new GalleryButtonModel("Copy all messages", "CopyIcon.png", new CopyMsgs(customerId))); store.add(new GalleryButtonModel("Spam report", "spam.gif", new SpamReport(customerId, login, password))); store.add(new GalleryButtonModel("Top customers report", "topCustomers.gif", new TopCustomersReport(customerId, login, password))); store.add(new GalleryButtonModel("Total report", "total-report.gif", new TotalReport(customerId, login, password))); store.add(new GalleryButtonModel("Message througput report", "message-troughput.gif", new MessageThroughputReport(customerId, login, password))); store.add(new GalleryButtonModel("Delivery time report", "delivery-time.gif", new DeliveryTimeReport(customerId, login, password))); store.add(new GalleryButtonModel("Action type report", "report.gif", new ActionTypeReport(customerId, login, password))); ListView&lt;GalleryButtonModel&gt; view = new ListView&lt;GalleryButtonModel&gt;() { @Override protected GalleryButtonModel prepareData(GalleryButtonModel model) { String s = model.get("name"); model.set("shortName", Format.ellipse(s, 15)); return model; } }; view.setId("img-chooser-view"); view.setTemplate(getTemplate("")); view.setStore(store); view.setItemSelector("div.thumb-wrap"); view.getSelectionModel().select(0, false); view.getSelectionModel().addListener(Events.SelectionChange, new Listener&lt;SelectionChangedEvent&lt;GalleryButtonModel&gt;&gt;() { public void handleEvent(SelectionChangedEvent&lt;GalleryButtonModel&gt; be) { be.getSelectedItem().getExample().getButtonModel(); } }); VBoxLayoutData vFlex = new VBoxLayoutData(); vFlex.setFlex(1); gallery.add(view, new FitData(5,5,5,5)); add(gallery, vFlex); } private native String getTemplate(String base)/*-{ return ['&lt;tpl for="."&gt;', '&lt;div class="thumb-wrap" id="{name}"&gt;', '&lt;div class="thumb"&gt;&lt;img src="/gxt/images/default/button/{path}" title="{name}"&gt;&lt;/div&gt;', '&lt;span class="x-editable"&gt;{shortName}&lt;/span&gt;&lt;/div&gt;', '&lt;/tpl&gt;', '&lt;div class="x-clear"&gt;&lt;/div&gt;'].join(""); }-*/; } </code></pre>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload