p：treeNode：自定义TreeNode类型的图标

我正在运行Primefaces 5.3.10，Mojarra 2.2.13，Java8和Tomcat8。p：treeNode：自定义TreeNode类型的图标

我想有不同类型的树节点的primefaces树。应该使用相应的自定义图标呈现每种类型的TreeNode。

我在网上学习了一些例子，但找不到工作解决方案。

我有一个Java类TreeModel.java它提供了一个树节点：

public class TreeModel { 

    TreeNode root = new DefaultTreeNode("Root", null); 

    public TreeNode getRoot(){ 
     return root; 
    } 

    public void populizeTree(){ 
     TreeNode node = new DefaultTreeNode("customType1", "nodeName", root); 
     TreeNode subNode = new DefaultTreeNode("customType2", "subNodeName", node); 
     TreeNode subNode2 = new DefaultTreeNode("customType3", "subNode2Name", node); 
    } 
}

而一个CustomTree.xhtml它描述了我的树：

<p:tree value="#{TreeModel.root}" 
    var="node" 
    highlight="true" 
    dynamic="true" 
    selectionMode="single" 
    id="modultree" 
    style="width: 980px;"> 
     <p:treeNode type="customType1" icon="icon-modul"> 
      <h:outputText value="#{node}"/> 
     </p:treeNode> 
     <p:treeNode type="customTyp2" icon="icon-konto"> 
      <h:outputText value="#{node}"/> 
     </p:treeNode> 
     <p:treeNode type="customType3" icon="icon-exam"> 
      <h:outputText value="#{node}"/> 
     </p:treeNode> 
</p:tree>

为了针对不同显示不同的图标TreeNode类型我也创建了名为TreeNode.css的css文件：

.icon-modul { 
    background: transparent url("#{resource['images:hio-modul.png']}")!important; 
    height: 16px; 
    width: 16px; 
} 

.icon-konto { 
    background: transparent url("#{resource['images:hio-konto.png']}")!important; 
    height: 16px; 
    width: 16px; 
} 

.icon-exam { 
    background: transparent url("#{resource['images:hio-pruefung.png']}")!important; 
    height: 16px; 
    width: 16px; 
}

并且还放置了th在目录/ myApp/resources/images /下的e png文件。

我尝试了一些变化，但无论哪种方式，自定义图标将不会被渲染。

我在做什么错了？

来源

2016-05-30 Jan Heidrich

我认为你必须在图标=错误’SOME_CSS”，我建议使用的styleClass =‘SOME_CSS’。 –

我相信你可以提供更多的信息，然后'自定义图标将不会呈现'...浏览器developertool是你的朋友！ – Kukeltje

Kukeltje的提示解决了我的问题。用Firebug我可以看到，该CSS的应该是像

.ui-widget-content .icon-exam { 
    background-image: url("../images/hio-pruefung.png") !important; 
    height: 16px; 
    width: 16px; 
}

我不能找到一种方法来引用的语法的图像： URL（“＃{资源['图片：HIO-pruefung巴纽“]}‘）

来源

2016-05-31 09:22:46

p：treeNode：自定义TreeNode类型的图标

回答

相关问题