Включая стили для vaadin-combo-box-item - PullRequest
0 голосов
/ 14 марта 2019

Я пытаюсь добавить значки флагов в Vaadin Flow Combobox, используя клиента ComponentRenderer:

new ComponentRenderer<>(locale -> {
            HorizontalLayout item = new HorizontalLayout();
            item.setDefaultVerticalComponentAlignment(FlexComponent.Alignment.BASELINE);

            Span langIcon = new Span();
            langIcon.addClassNames("flag-icon", "flag-icon-" + getTranslation("App.Language.Flag", locale));
            item.add(langIcon);

            item.add(new Span(locale.getDisplayLanguage(locale)));

            return item;
        });

Значки получены из flag-icon-css (см. здесь ) включены через зависимость компиляции gradle "org.webjars.bowergithub.lipis: flag-icon-css: 3.3.0" и аннотацию @StyleSheet("frontend://bower_components/flag-icon-css/css/flag-icon.min.css") в моем основном классе макета.В другом месте с компонентом ListBox значки отображаются, как и ожидалось.Однако при использовании через ComponentRenderer в выпадающем списке ничего не появляется.

Изучая HTML, я вижу, что <vaadin-combo-box-item> в ComboBox отрисовывает все под своим теневым корнем в отличие от <vaadin-item> в ListBox, который отображаетэто как <slot>. Почему это?И как я могу использовать стили CSS с иконками флага в элементах комбинированного списка?

...