Vaadin 8. Ресурс не может быть разрешен

Я попытался добавить плагин оверлея. 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 overlays.

Мой код:

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);

Мне нужно добиться того, чтобы на кнопке отображалось наложение. Если пользователь нажал на эту кнопку и добавил новый контент, что-то вроде этого появится на кнопке введите здесь описание изображения


java vaadin vaadin8 vaadin4spring
person Anna K    schedule 12.10.2017    source источник

Ответы (1)


arrow_upward
3
arrow_downward

Это потому, что он совместим с Vaadin 6 только так, как указано на странице надстройки:

Совместимость надстройки оверлея Vaadin

Если вы прокрутите до раздела комментариев, кто-то предлагает форк надстройки, совместимой с Vaadin 7, но я не увидел ничего, связанного с 8:

ВСЕМ ПРИВЕТ! Вы можете найти версию 1.1.3 для Vaadin 7.6 здесь: https://github.com/Haulmont/vaadin-overlays/releases

ЮРИЙ АРТАМОНОВ

Надстройки, совместимые с несколькими версиями Vaadin, указывают это явно и обычно (но не обязательно... по выбору разработчика) имеют разные номера версий, например: 1.x для Vaadin 6, 2.x для Vaadin 7, 3. x для Vaadin 8 и т. д.:

Дополнение для множественной совместимости Vaadin

В любом случае, щелкнув ссылку для конкретной версии Vaadin, вы выберете последнюю версию надстройки, совместимую с ней. Или, если вы выберете выпуск надстройки из раскрывающегося списка, совместимая с ним версия Vaadin будет соответствующим образом обновлена.

Изменить после обновления

Вы можете использовать обычную кнопку + предустановленную BUTTON_ICON_ALIGN_RIGHT в стиле Вало. Из 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";

Please note that for the best UI result, I've used 24x24 icons, but depending on your requirements you can tweak your theme for the size you need. Also if you don't have icons and don't want to spend money or time buying or creating your own icons, you can use the existing Vaadin Font Icons (list of icons and matching java enum)

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);
    }
}

button-with-icon-alligned-to-right

person Morfic    schedule 12.10.2017
comment
спасибо за помощь. Знаете ли вы какие-либо другие решения vaadin, подобные этому? - person Anna K; 12.10.2017
comment
@AnnaK, если вы можете описать свой вариант использования, возможно, мы сможем найти некоторые альтернативы или обходные пути, используя только стандартные стили Valo. - person Morfic; 12.10.2017
comment
спасибо :) Я обновил свой вопрос и отправил изображение, чего я хотел бы достичь! - person Anna K; 12.10.2017
comment
@AnnaK смотрите нижнее обновление, используя обычную кнопку и предопределенный стиль Вало, без каких-либо надстроек. - person Morfic; 12.10.2017
comment
Выглядит отлично спасибо. Но мне нужно что-то, что я нажимаю, когда я получаю значок на кнопке, если я нажимаю еще раз, у меня нет значка - person Anna K; 12.10.2017
comment
@AnnaK Я использовал несколько значков, чтобы показать, как и что вы можете изменить значок кнопки. Если вам больше не нужна иконка, она должна быть такой же простой, как button.setIcon(null) :-) - person Morfic; 12.10.2017
comment
Я думаю, что не понимаю, как работает прослушиватель кнопок :( Как я могу определить, когда кнопка была нажата? Button buttonBig = new Button(Neue ASE, event -> event.getButton().setIcon(resource)); Нет, он всегда показывает значок когда я нажимаю на это - person Anna K; 12.10.2017
comment
Давайте продолжим это обсуждение в чате. - person Morfic; 12.10.2017
comment
@Morfic, как всегда, отличный ответ! - person petey; 13.10.2017