[zTree] [zTree]how to change custom icon

Forge Component
(20)
Published on 2019-10-03 by Eduardo Luís
20 votes
Published on 2019-10-03 by Eduardo Luís

Hello everyone

let me ask any question.

How can I change custom icon of zTree widget.

I only want parent is icon(look like head of arrow).

no need child icon.

How can I achieve this.

Thanks

Hi May,

just assign the URL of your icon to the icon attribute in the structure of zTree:

"URL path of node's custom icon.
1. If you only set the 'icon' attribute to a parent node, the node will only show one icon when it is expanded or collapsed.
2. If you need to show two icons when it is expanded or collapsed, please set the 'iconOpen' and 'iconClose' attributes.
3. If you need to use css to set the custom icon, please set the 'iconSkin' attribute."

hope it helps!

Joao

May Zin Linn wrote:

Hello everyone

let me ask any question.

How can I change custom icon of zTree widget.

I only want parent is icon(look like head of arrow).

no need child icon.

How can I achieve this.

Thanks



Joao Duro wrote:

Hi May,

just assign the URL of your icon to the icon attribute in the structure of zTree:

"URL path of node's custom icon.
1. If you only set the 'icon' attribute to a parent node, the node will only show one icon when it is expanded or collapsed.
2. If you need to show two icons when it is expanded or collapsed, please set the 'iconOpen' and 'iconClose' attributes.
3. If you need to use css to set the custom icon, please set the 'iconSkin' attribute."

hope it helps!

Joao

May Zin Linn wrote:

Hello everyone

let me ask any question.

How can I change custom icon of zTree widget.

I only want parent is icon(look like head of arrow).

no need child icon.

How can I achieve this.

Thanks

Thanks Joao

Please explain me with example because I don't know URL path of node's custom icon.

I means I need to create my own custom icon and then pass it as the icon attribute to ztreedata.

Please point out me .

Thanks. 




Hi May,

I think all you need should be available in the Demo espace from Ztree? Anyways:

you need to add an image to a espace in the Images section, 

then when assigning your tree nodes, you can assign to the icon property (ZtreeData.icon) something like:

where Espace_Theme is your espace name:

"/Espace_Theme/img/IconImage.png"

Hope it helps!

Joao