類似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說明，並相應地設置它們的樣式）。