Ваадин 14: Как обновить стиль css для компонента из другого потока? - PullRequest
Новая
       57

Ваадин 14: Как обновить стиль css для компонента из другого потока?

2 голосов
/ 05 апреля 2020

Итак, у меня есть проблема с Vaadin Flow 14, у меня есть компонент, который использует position: static и position: absolute в CSS. У него также есть классная анимация, и мне нужно было использовать обе позиции, чтобы она не выглядела странно, могла занимать весь экран, а также могла быть прокручиваемой.

Это поведение следующее:

  1. Компонент начинается с position: static в его файле CSS (можно прокручивать)
  2. Нажмите на компонент и установите position: absolute с помощью метода getStyle (). Set (), и он займет все window
  3. Закройте компонент, и он вернется к position: static, чтобы он мог находиться внутри родительского элемента и иметь возможность прокрутки

Проблема в шаге 3. Я установил position: static удалив абсолют с помощью getStyle (). remove (). Я делаю это из другого потока, так что я могу удалить стиль после завершения анимации, таким образом, он не выглядит странно, имеет тот же поток, что и при открытии компонента, и не имеет этого прыжка в нем .

Стиль удален из компонента, однако он не обновляется мгновенно, и компонент не может быть прокручен, потому что его позиция все еще абсолютна. Однако, если я нажму на ссылку go на другую новую вкладку и go вернусь на главную вкладку, она будет обновлена, и компонент находится в состоянии c.

Я попытался разрешить это добавление @ Pu sh в мой основной класс, но это не работает, потому что у меня есть представления внутри представлений, и это пользовательский компонент из одного из вложенных представлений, которого нет в основном классе. Я должен иметь возможность обновить его из самого компонента так же, как я удаляю стиль. Я просто хочу, чтобы компонент дождался воспроизведения анимации, а затем удалил свою позицию, и это единственный способ, который я смог найти. Любые другие попытки не дожидались воспроизведения анимации и просто мгновенно обновлялись.

Это код потока, который я использовал для удаления стиля. 

new Thread(() -> {
            try {
                Thread.sleep(500);
            } catch (InterruptedException e) {
                e.printStackTrace();
            }
            this.getUI().get().access(() -> {
                getContent().getStyle().remove("position");
            });
        }).start();

1 Ответ

0 голосов
/ 08 апреля 2020

Решено!

Взятие текущего пользовательского интерфейса в экземпляр и ручная настройка для него конфигурации pu sh. 

UI currentUI = UI.getCurrent();
currentUI.getPushConfiguration().setPushMode(PushMode.MANUAL);

И добавление этого в конце кода в нить: 

currentUI.push();

Работает так же, как и предполагалось.

...