Combobox and icons

Hi Vaadin users :slight_smile:

I extended the Combobox class like this :

public class EvaluationComboBox extends ComboBox {

	private static final long serialVersionUID = -8066740263423180200L;
	
	private static final String BAD_ICON_PATH = "icons/delete.png";
	private static final String NORMAL_ICON_PATH = "icons/warning.png";
	private static final String GOOD_ICON_PATH = "icons/check.png";
	
	public EvaluationComboBox() {
		// Datasource
		setContainerDataSource(new IndexedContainer(Arrays.asList(Evaluation.values())));
		
		// Image
		setItemIcon(Evaluation.BAD, new ThemeResource(BAD_ICON_PATH));
		setItemIcon(Evaluation.NORMAL, new ThemeResource(NORMAL_ICON_PATH));
		setItemIcon(Evaluation.GOOD, new ThemeResource(GOOD_ICON_PATH));
		
		// On affiche que les icônes
		setItemCaptionMode(Select.ITEM_CAPTION_MODE_ICON_ONLY);
		
		// Taille
		setWidth("50px");
	}	
}

Evaluation is an enum.

It works but the icon (<img class=“v-icon” src=“/PPMTool/VAADIN/themes/ppmtooltheme/icons/check.png”
style="margin-top: 12px; "
>) has a bad margin-top css property so it does not show correctly and the “Analyse Layout” return me the following warning : [quote]
Warning: Icon load event was not propagated because VCaption owner is unknown.
[/quote]

I use Vaadin 6.4.8

What can I do to resolve that? I don’t understand the warning message…

I created a test app and the problem still occurs. Maybe a bug?

Test app code:

package com.example.testcombbox;

import com.vaadin.Application;
import com.vaadin.data.util.IndexedContainer;
import com.vaadin.terminal.ThemeResource;
import com.vaadin.ui.*;

public class TestcombboxApplication extends Application {
	
	private static final String BAD_ICON_PATH = "icons/delete.png";
	private static final String NORMAL_ICON_PATH = "icons/warning.png";
	private static final String GOOD_ICON_PATH = "icons/check.png";
	
	@Override
	public void init() {
		setTheme("ppmtooltheme");
		
		Window mainWindow = new Window("Testcombbox Application");
		Label label = new Label("Hello Vaadin user");
		mainWindow.addComponent(label);
		
		ComboBox cb = new ComboBox();
		cb.setWidth("50px");
		cb.setItemCaptionMode(ComboBox.ITEM_CAPTION_MODE_ICON_ONLY);
		
		IndexedContainer ic = new IndexedContainer();
		ic.addItem("BAD");
		ic.addItem("NOR");
		ic.addItem("GOO");
		
		cb.setContainerDataSource(ic);
		
		cb.setItemIcon("BAD", new ThemeResource(BAD_ICON_PATH));
		cb.setItemIcon("NOR", new ThemeResource(NORMAL_ICON_PATH));
		cb.setItemIcon("GOO", new ThemeResource(GOOD_ICON_PATH));
		
		mainWindow.addComponent(cb);
		
		setMainWindow(mainWindow);
	}

}


I forgot to mention it but the problem occurs only with Chrome 9 (9.0.597.107).

With Firefox 3.6.14 all is fine.

Works fine for me in Chrome 9 (Windows 7) when replacing the icons with icons from the Runo theme. The margin top is calculated so the icon is centered vertically if I remember correctly.

Yep, excuse me. I’m gonna become crazy with web technologies. It was a problem of Chrome’s cache. However I’m sure I cleaned it many times :frowning: