Поддержка RTL с использованием Vaddin 14 - PullRequest
0 голосов
/ 29 сентября 2019

Я пытаюсь создать веб-приложение на иврите.но все компоненты или Navbar являются LTR.Как мне сделать мой NavBar или весь мой сайт RTL?

Еще один вопрос, можно ли изменить стиль панели навигации?

@Viewport("width=device-width, minimum-scale=1, initial-scale=1, user-scalable=yes, viewport-fit=cover")
@Theme(Lumo.class)
@Route
@PWA(name = "SimpleIT", shortName = "SimpeIT")
public class MainView extends AppLayout {
    public static final String ITM_DASHBOARD = "DashBoard";
    private Map<Tab, Component> tab2Workspace = new HashMap<>();

    public MainView() {
       // setPrimarySection(Section.DRAWER);
        Image img = new Image("https://i.imgur" +
                ".com/GPpnszs.png", "Vaadin Logo");
        img.setHeight("75px");
        addToNavbar(new MenuBar(), img);
    Tabs menu = new Tabs(dashBoard()
            ,new Tab("Customers"),new Tab("Todo"),new Tab("Tickets"));
    menu.setOrientation(Tabs.Orientation.HORIZONTAL);
        menu.addSelectedChangeListener(event -> {
            final Tab selectedTab = event.getSelectedTab();
            final Component component = tab2Workspace.get(selectedTab);
            setContent(component);
        });

        addToNavbar(menu);
        this.setPrimarySection(Section.NAVBAR);
        setContent(new Span("click in the menu ;-) , you will see me never again.."));





    }

    private Tab dashBoard() {
        final Span label = new Span("DashBoard");
        final Icon icon  = DASHBOARD.create();
        final Tab  tab   = new Tab(new HorizontalLayout(icon,label));
        tab2Workspace.put(tab, new DashBoardView());
        return tab;

    }
}

1 Ответ

1 голос
/ 29 сентября 2019

Вы можете включить RTL, добавив правило CSS direction:rtl в тело.В качестве альтернативы вы можете использовать надстройку режима RTL, которая сделает это за вас: https://vaadin.com/directory/component/rtl-mode/discussions

Многие компоненты работают в режиме RTL, но у некоторых все еще есть некоторые проблемы.Надеемся, что они будут исправлены в первой половине 2020 года.

...