Important Notice - Forums is archived
To simplify things and help our users to be more productive, we have archived the current forum and focus our efforts on helping developers on Stack Overflow. You can post new questions on Stack Overflow or join our Discord channel.

Vaadin lets you build secure, UX-first PWAs entirely in Java.
Free ebook & tutorial.
Button with two Images
Hi,
I need to create a button that shows 2 images.
Since it is possibile to set as button icon only one resource, there is any way to combine two images as a single resource on the fly ?
I could not use fonticon, I have only png images.
Regards
Hi Bob,
im not sure if this solves your problem, but you could try wrapping your images in a CssLayout that is themed like a Button.
CssLayout button = new CssLayout();
button.setPrimaryStyleName("v-button");
button.addLayoutClickListener(new LayoutClickListener() {
@Override
public void layoutClick(LayoutClickEvent event) {
Notification.show("'Button' clicked!");
}
});
button.setHeight(64, Unit.PIXELS);
Label buttonCaption = new Label("Test");
buttonCaption.setPrimaryStyleName("v-button-wrap");
Image image1 = new Image();
image1.setSource(new ThemeResource("img/linux.png"));
image1.setPrimaryStyleName("v-icon");
image1.setHeight(32, Unit.PIXELS);
Image image2 = new Image();
image2.setSource(new ThemeResource("img/windows.png"));
image2.setPrimaryStyleName("v-icon");
image2.addStyleName(ValoTheme.BUTTON_ICON_ONLY);
image2.setHeight(32, Unit.PIXELS);
Image image3 = new Image();
image3.setSource(new ThemeResource("img/mac.png"));
image3.setPrimaryStyleName("v-icon");
image3.addStyleName(ValoTheme.BUTTON_ICON_ONLY);
image3.setHeight(32, Unit.PIXELS);
button.addComponents(image1, image2, image3, buttonCaption);
result:
regards
Johannes
Hi Johannes,
your suggestion is very useful, I did not think to a clickable layout !
It works very well since I have to use such clickable layout inside a table cell
Thank you very much