类似 Opera 的 UI - Vaadin答案

【问题标题】：Opera-like UI - Vaadin类似 Opera 的 UI - Vaadin
【发布时间】：2015-01-17 11:03:59
【问题描述】：

对于带有 neo4j 数据库的 vaadin 应用程序，我使用 Match (u:User{_id:<his id>})-[:OWNS]->(s:Site) 获取我的用户的所有网站并返回所有网站。

在我的 UI 中，我想使用 gridlayout 来做类似 Opera 的主页。

这是我的做法：

    GridLayout grid = new GridLayout(5, 2);
    grid.setCaption("Liste des Sites");
    grid.setSizeFull();
    grid.setMargin(new MarginInfo(false, true, true, true));

    Button addSite = new Button(FontAwesome.PLUS);
    addSite.setStyleName(ValoTheme.BUTTON_HUGE);
    addSite.addStyleName(ValoTheme.BUTTON_QUIET);
    addSite.setSizeFull();

    addSite.addClickListener(new ClickListener() {
        @Override
        public void buttonClick(ClickEvent event) {
            new SiteCreation(); //this shows a modal window
        }
    });

然后我想在 addSite 按钮之前添加所有用户的网站，就像您在 Opera 的 UI 上看到的那样。

但问题是，我如何创建一个可点击的布局来设置一些标签？我希望用户有一些可点击的方块，他可以在其中看到相应网站的信息，当他点击它时，他会转到另一个视图。

【问题讨论】：

标签： jakarta-ee vaadin

【解决方案1】：

要呈现一个网站，请使用Panel 并使用addClickListener 添加MouseEvents.ClickListener 来处理点击。面板允许您添加更多组件（setContent 例如VerticalLayout 并添加一些图像、标签……，提供一些 HTML 描述，并相应地设置它们的样式）。

【讨论】：