java - Vaadin:使用图像作为按钮

Question

我想使用图像作为按钮。我让它工作了，但是制作得不是很好，请看一下屏幕截图。如您所见，按钮本身比图像大很多，但我希望它与图像一样大:

实际的 Button 比 Image 大。这里的目标是除了要单击的图像之外别无其他。我怎样才能做到这一点？这是屏幕截图上按钮的代码:

 Button testButton = new Button();
 String basepath = VaadinService.getCurrent().getBaseDirectory().getAbsolutePath();
 testButton.setIcon(new FileResource(new File(basepath + "/VAADIN/themes/mytheme/img/Button.png")));
 loginForm.addComponent(testButton);

我知道

testButton.setStyleName(BaseTheme.BUTTON_LINK)

使按钮不可见，但不幸的是，这不会调整按钮的大小，只是调整可见性..

Answer 1

您可以简单地将点击监听器添加到图像而不是使用按钮。

Image image = new Image(null, new ClassResource("/images/button-img.jpg");
image.addClickListener(e -> System.out.println("click"));
image.addStyleName("my-img-button");

然后添加这个 css，我使用 @Stylesheet 注释在 CSS 中添加。

.my-img-button {
cursor: pointer;
}