在PrimeFaces 6.0的根子菜單上支持用戶圖標PanelMenu

Question

我做了一個PanelMenu，我試圖給根子菜單添加一個圖標，但它不工作。

<p:panelMenu> 
    <p:submenu label="Üye işlemleri" icon="fa fa-user-plus"> 
     <p:menuitem value="Üye Kayıt" icon="fa fa-user-plus" 
      action="#{redirect.toRegister()}" /> 
     <p:menuitem value="Üye Düzenle" icon="fa fa-pencil" /> 
    </p:submenu> 
    <p:submenu label="Kullanıcı işlemleri" icon="ui-icon-extlink"> 
     <p:menuitem value="Anasayfa" icon="fa fa-home" 
      action="#{redirect.toMainPage()}" /> 
     <p:menuitem value="Üye Kayıt" icon="fa fa-user-plus" 
      action="#{redirect.toRegister()}" /> 
     <p:menuitem value="Üye Düzenle" icon="fa fa-pencil" /> 
    </p:submenu> 
</p:panelMenu> 

你有什麼想法？我也嘗試用ui-icon（不是fontawesome）。我不想更改默認子菜單圖標。我想添加到默認圖標旁邊，如this page。你可以看例子，特別是在Navigation> Link。正如你所看到的，鏈接是一個子菜單。它是否真的必須是2個子菜單​​才能添加圖標？

編輯------

我呈現類坐上 「PanelMenuRenderer」 延伸，我faces-config.xml中的;

<render-kit> 
    <renderer> 
     <component-family>org.primefaces.component</component-family> 
     <renderer-type>org.primefaces.component.PanelMenuRenderer</renderer-type> 
     <renderer-class>denemeExample.my</renderer-class> 
    </renderer> 
</render-kit> 

當我嘗試運行它時出現錯誤。

An Error Occurred: 

javax/servlet/jsp/jstl/core/Config 
- Stack Trace 

java.lang.NoClassDefFoundError: javax/servlet/jsp/jstl/core/Config 
    at com.sun.faces.application.view.JspViewHandlingStrategy.executePageToBuildView(JspViewHandlingStrategy.java:344) 
    at com.sun.faces.application.view.JspViewHandlingStrategy.buildView(JspViewHandlingStrategy.java:153) 
    at com.sun.faces.lifecycle.RenderResponsePhase.execute(RenderResponsePhase.java:99) 
    at com.sun.faces.lifecycle.Phase.doPhase(Phase.java:101) 
    at com.sun.faces.lifecycle.LifecycleImpl.render(LifecycleImpl.java:219) 
    at javax.faces.webapp.FacesServlet.service(FacesServlet.java:647) 
    at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:291) 
    at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206) 
    at org.apache.tomcat.websocket.server.WsFilter.doFilter(WsFilter.java:52) 
    at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:239) 
    at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206) 
    at org.netbeans.modules.web.monitor.server.MonitorFilter.doFilter(MonitorFilter.java:393) 
    at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:239) 
    at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206) 
    at org.apache.catalina.core.StandardWrapperValve.invoke(StandardWrapperValve.java:217) 
    at org.apache.catalina.core.StandardContextValve.invoke(StandardContextValve.java:106) 
    at org.apache.catalina.authenticator.AuthenticatorBase.invoke(AuthenticatorBase.java:502) 
    at org.apache.catalina.core.StandardHostValve.invoke(StandardHostValve.java:142) 
    at org.apache.catalina.valves.ErrorReportValve.invoke(ErrorReportValve.java:79) 
    at org.apache.catalina.valves.AbstractAccessLogValve.invoke(AbstractAccessLogValve.java:616) 
    at org.apache.catalina.core.StandardEngineValve.invoke(StandardEngineValve.java:88) 
    at org.apache.catalina.connector.CoyoteAdapter.service(CoyoteAdapter.java:518) 
    at org.apache.coyote.http11.AbstractHttp11Processor.process(AbstractHttp11Processor.java:1091) 
    at org.apache.coyote.AbstractProtocol$AbstractConnectionHandler.process(AbstractProtocol.java:673) 
    at org.apache.tomcat.util.net.NioEndpoint$SocketProcessor.doRun(NioEndpoint.java:1500) 
    at org.apache.tomcat.util.net.NioEndpoint$SocketProcessor.run(NioEndpoint.java:1456) 
    at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1142) 
    at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:617) 
    at org.apache.tomcat.util.threads.TaskThread$WrappingRunnable.run(TaskThread.java:61) 
    at java.lang.Thread.run(Thread.java:745) 

我試圖解決內部WEB-INF/lib目錄，但不解決，服務器開始工作unlogical這將JSTL-1.2.jar和jsp-api.jar文件。它不像x：p：outputLabel或h：outputLabel中的任何代碼。我認爲tomcat不運行。最後我使用PrimeFaces 6.0和jsf 2.2。那麼你有什麼想法我該怎麼做？

Answer 1

是否真的必須是2個子菜單​​才能添加圖標？

只是對。如PrimeFaces Documentation中所述：

第一級子菜單呈現爲手風琴板，後代子菜單呈現爲樹節點。

如果你看一下source code，你會看到在根子菜單用戶圖標將不被考慮encodeRootSubmenu()。另一方面，在encodeDescendantSubmenu()中將考慮後代子菜單用戶圖標。

一個可能的解決方案以獲取根的子菜單用戶圖標支持PanelMenus，是基於PanelMenuRenderer和覆蓋encodeRootSubmenu()創建一個自定義渲染器。也許this question可以幫助你作爲一個起點。

Answer 2

此解決方案由irieill的帖子主宰。其實它不是我所做的，而是我認爲應該發佈的每一種方式。

這是customPanelMenuRenderer（它的包是 「COM」）

public class customPanelMenuRenderer extends BaseMenuRenderer { 

@Override 
protected void encodeScript(FacesContext context, AbstractMenu abstractMenu) throws IOException { 
    PanelMenu menu = (PanelMenu) abstractMenu; 
    String clientId = menu.getClientId(context); 
    WidgetBuilder wb = getWidgetBuilder(context); 
    wb.initWithDomReady("PanelMenu", menu.resolveWidgetVar(), clientId).attr("stateful", menu.isStateful()); 
    wb.finish(); 
} 

@Override 
protected void encodeMarkup(FacesContext context, AbstractMenu abstractMenu) throws IOException { 
    ResponseWriter writer = context.getResponseWriter(); 
    PanelMenu menu = (PanelMenu) abstractMenu; 
    String clientId = menu.getClientId(context); 
    String style = menu.getStyle(); 
    String styleClass = menu.getStyleClass(); 
    styleClass = styleClass == null ? PanelMenu.CONTAINER_CLASS : PanelMenu.CONTAINER_CLASS + " " + styleClass; 

    writer.startElement("div", menu); 
    writer.writeAttribute("id", clientId, "id"); 
    writer.writeAttribute("class", styleClass, "styleClass"); 
    if (style != null) { 
     writer.writeAttribute("style", style, "style"); 
    } 
    writer.writeAttribute("role", "menu", null); 

    if (menu.getElementsCount() > 0) { 
     List<MenuElement> elements = menu.getElements(); 

     for (MenuElement element : elements) { 
      if (element.isRendered() && element instanceof Submenu) { 
       encodeRootSubmenu(context, menu, (Submenu) element); 
      } 
     } 
    } 

    writer.endElement("div"); 
} 

protected void encodeRootSubmenu(FacesContext context, PanelMenu menu, Submenu submenu) throws IOException { 
    ResponseWriter writer = context.getResponseWriter(); 
    String style = submenu.getStyle(); 
    String icon = submenu.getIcon(); 
    String styleClass = submenu.getStyleClass(); 
    styleClass = styleClass == null ? PanelMenu.PANEL_CLASS : PanelMenu.PANEL_CLASS + " " + styleClass; 
    boolean expanded = submenu.isExpanded(); 
    String headerClass = expanded ? PanelMenu.ACTIVE_HEADER_CLASS : PanelMenu.INACTIVE_HEADER_CLASS; 
    String headerIconClass = expanded ? PanelMenu.ACTIVE_TAB_HEADER_ICON_CLASS : PanelMenu.INACTIVE_TAB_HEADER_ICON_CLASS; 
    System.out.println("headerIconClass = " + headerIconClass); 
    System.out.println("icon = " + icon); 
    boolean hasIcon = (icon != null); 
    String contentClass = expanded ? PanelMenu.ACTIVE_ROOT_SUBMENU_CONTENT : PanelMenu.INACTIVE_ROOT_SUBMENU_CONTENT; 

    //wrapper 
    writer.startElement("div", null); 
    writer.writeAttribute("class", styleClass, null); 
    if (style != null) { 
     writer.writeAttribute("style", style, null); 
    } 

    //header 
    writer.startElement("h3", null); 
    writer.writeAttribute("class", headerClass, null); 
    writer.writeAttribute("role", "tab", null); 
    writer.writeAttribute("tabindex", "0", null); 

    //icon 
    writer.startElement("span", null); 
    writer.writeAttribute("class", headerIconClass, null); 
    writer.endElement("span"); 

    //user icon 
    if (hasIcon) { 
     writer.startElement("span", null); 
     writer.writeAttribute("class", "ui-icon " + icon, null); 
     writer.endElement("span"); 
    } 

    writer.startElement("a", null); 
    writer.writeAttribute("href", "#", null); 
    writer.writeAttribute("tabindex", "-1", null); 
    writer.writeText(submenu.getLabel(), null); 
    writer.endElement("a"); 

    writer.endElement("h3"); 

    //content 
    writer.startElement("div", null); 
    writer.writeAttribute("class", contentClass, null); 
    writer.writeAttribute("role", "tabpanel", null); 
    writer.writeAttribute("id", menu.getClientId(context) + "_" + submenu.getId(), null); 
    writer.writeAttribute("tabindex", "0", null); 

    if (submenu.getElementsCount() > 0) { 
     List<MenuElement> elements = submenu.getElements(); 

     writer.startElement("ul", null); 
     writer.writeAttribute("class", PanelMenu.LIST_CLASS, null); 

     for (MenuElement element : elements) { 
      if (element.isRendered()) { 
       if (element instanceof MenuItem) { 
        MenuItem menuItem = (MenuItem) element; 
        String containerStyle = menuItem.getContainerStyle(); 
        String containerStyleClass = menuItem.getContainerStyleClass(); 
        containerStyleClass = (containerStyleClass == null) ? Menu.MENUITEM_CLASS : Menu.MENUITEM_CLASS + " " + containerStyleClass; 

        writer.startElement("li", null); 
        writer.writeAttribute("class", containerStyleClass, null); 
        if (containerStyle != null) { 
         writer.writeAttribute("style", containerStyle, null); 
        } 
        encodeMenuItem(context, menu, menuItem); 
        writer.endElement("li"); 
       } else if (element instanceof Submenu) { 
        encodeDescendantSubmenu(context, menu, (Submenu) element); 
       } 
      } 
     } 

     writer.endElement("ul"); 
    } 

    writer.endElement("div"); //content 

    writer.endElement("div"); //wrapper 
} 

protected void encodeDescendantSubmenu(FacesContext context, PanelMenu menu, Submenu submenu) throws IOException { 
    ResponseWriter writer = context.getResponseWriter(); 
    String icon = submenu.getIcon(); 
    String style = submenu.getStyle(); 
    String styleClass = submenu.getStyleClass(); 
    styleClass = styleClass == null ? PanelMenu.DESCENDANT_SUBMENU_CLASS : PanelMenu.DESCENDANT_SUBMENU_CLASS + " " + styleClass; 
    boolean expanded = submenu.isExpanded(); 
    String toggleIconClass = expanded ? PanelMenu.DESCENDANT_SUBMENU_EXPANDED_ICON_CLASS : PanelMenu.DESCENDANT_SUBMENU_COLLAPSED_ICON_CLASS; 
    String listClass = expanded ? PanelMenu.DESCENDANT_SUBMENU_EXPANDED_LIST_CLASS : PanelMenu.DESCENDANT_SUBMENU_COLLAPSED_LIST_CLASS; 
    boolean hasIcon = (icon != null); 
    String linkClass = (hasIcon) ? PanelMenu.MENUITEM_LINK_WITH_ICON_CLASS : PanelMenu.MENUITEM_LINK_CLASS; 

    writer.startElement("li", null); 
    writer.writeAttribute("id", submenu.getClientId(), null); 
    writer.writeAttribute("class", styleClass, null); 
    if (style != null) { 
     writer.writeAttribute("style", style, null); 
    } 

    writer.startElement("a", null); 
    writer.writeAttribute("class", linkClass, null); 

    //toggle icon 
    writer.startElement("span", null); 
    writer.writeAttribute("class", toggleIconClass, null); 
    writer.endElement("span"); 

    //user icon 
    if (hasIcon) { 
     writer.startElement("span", null); 
     writer.writeAttribute("class", "ui-icon " + icon, null); 
     writer.endElement("span"); 
    } 

    //submenu label 
    writer.startElement("span", null); 
    writer.writeAttribute("class", PanelMenu.MENUITEM_TEXT_CLASS, null); 
    writer.writeText(submenu.getLabel(), null); 
    writer.endElement("span"); 

    writer.endElement("a"); 

    //submenu children 
    if (submenu.getElementsCount() > 0) { 
     List<MenuElement> elements = submenu.getElements(); 

     writer.startElement("ul", null); 
     writer.writeAttribute("class", listClass, null); 

     for (MenuElement element : elements) { 
      if (element.isRendered()) { 
       if (element instanceof MenuItem) { 
        writer.startElement("li", null); 
        writer.writeAttribute("class", Menu.MENUITEM_CLASS, null); 
        encodeMenuItem(context, menu, (MenuItem) element); 
        writer.endElement("li"); 
       } else if (element instanceof Submenu) { 
        encodeDescendantSubmenu(context, menu, (Submenu) element); 
       } 
      } 
     } 

     writer.endElement("ul"); 
    } 

    writer.endElement("li"); 
} 
} 

這是faces-config.xml中

<render-kit> 
    <renderer> 
     <component-family>org.primefaces.component</component-family> 
     <renderer-type>org.primefaces.component.PanelMenuRenderer</renderer-type> 
     <renderer-class>com.customPanelMenuRenderer</renderer-class> 
    </renderer> 
</render-kit> 

有了這些代碼，我們做了一個自定義的呈現，我們註冊的面孔-config.xml。最後，我們都應該重寫CSS代碼，在我的情況正好覆蓋到這個類（這可能是在您的項目變化）

.ui-panelmenu .ui-panelmenu-header .ui-icon.fa{} 

最後，你有圖標rootSubmenu。