我尝试添加叠加插件。 https://vaadin.com/directory/component/overlays 我有图像叠加问题。我得到了这个错误:
The type com.vaadin.terminal.Resource cannot be resolved.
It is indirectly referenced from required .class file
问题在于这一行:
io.setImage(res);
我该如何解决?我将icon-new.png放到类包文件夹中并添加到maven覆盖插件
我的代码:
final ImageOverlay io = new ImageOverlay(button);
Resource res = new ClassResource(this.getClass(), "../icon-new.png");
io.setImage(res);
io.setComponentAnchor(Alignment.TOP_LEFT); // Top left of the button
io.setOverlayAnchor(Alignment.MIDDLE_CENTER); // Center of the image
io.setClickListener(new OverlayClickListener() {
public void overlayClicked(CustomClickableOverlay overlay) {
Notification.show("ImageOverlay Clicked!");
}
});
layout.addComponent(io);
io.setEnabled(true);
答案 0 :(得分:3)
因为它与Vaadin 6兼容,只是在附加页面中指出了这一点:
如果您滚动到评论部分,有人建议与Vaadin 7兼容的插件的分支,但我看不到任何与8相关的内容:
全部!你可以在这里找到Vaadin 7.6的1.1.3版本:https://github.com/Haulmont/vaadin-overlays/releases
YURIY ARTAMONOV
与多个Vaadin版本兼容的附加组件明确指出,并且通常(但不一定是......开发人员的选择)具有不同的版本编号,例如:1.x代表Vaadin 6,2。 x对于Vaadin 7,3.x用于Vaadin 8等:
无论哪种方式,单击特定Vaadin版本的链接,都将选择与其兼容的最新附加版本。或者,如果您从下拉列表中选择附加版本,则与其兼容的Vaadin版本将相应更新。
更新后修改
您可以使用常规按钮+预定义的BUTTON_ICON_ALIGN_RIGHT Valo样式。来自javadoc:
/**
* Align the icon to the right side of the button caption. Can be combined
* with any other Button style.
*/
public static final String BUTTON_ICON_ALIGN_RIGHT = "icon-align-right";
请注意,为了获得最佳用户界面结果,我使用了24x24图标,但根据您的要求,您可以根据需要调整主题。此外,如果您没有图标并且不想花钱或花时间购买或创建自己的图标,则可以使用现有的Vaadin Font Icons(list of icons和{{3} })
public class ButtonWithIconOnTheRightComponent extends VerticalLayout {
public ButtonWithIconOnTheRightComponent() {
// text filed to specify icon URL
TextField urlField = new TextField("Icon URL", "http://files.softicons.com/download/toolbar-icons/status-icons-set-by-iconleak/png/16x16/30.png");
// button which updates its icon using the URL specified in the text field above
Button button = new Button("Update icon", event -> event.getButton().setIcon(new ExternalResource(urlField.getValue())));
// use valo style to align icon to the right
button.addStyleName(ValoTheme.BUTTON_ICON_ALIGN_RIGHT);
// add components to the UI
addComponents(urlField, button);
setSpacing(true);
}
}