类似Opera的UI - Vaadin

Question

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

在我的用户界面中，我想使用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的用户界面看到。

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

Answer 1

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