Tree Icon and Open Close

28 May, 2008 - 12:38 — reececox

I was wondering how to make the tree look like it used to in Backbase 3... but don't have a clue how to do it.

You can see an example of what I mean in the Backbase Client Framework 4.2.0 Reference under 'tree'. You have the expand or minus icons with the dotted lines - and you also have separate icons with the folder and document icon. This is also the same as Microsoft Outlook etc...

At the moment, my tree has one icon (which I can change fine) but I want an expand/minus icon and also another icon to go with it (like a folder...).

I believe this was able to be done in Backbase 3 - but I cannot work out how to do it in the latest releases. If this feature has been removed then, I think, that was a big mistake.

Thanks in advance.

TreeIcon and Open Close

29 May, 2008 - 15:46 — andys

Hi reececox,

There is a flexibility to define your own icon in expanding and closing the treeBranch windget.
You can define @icon and @iconOpen in your b:treeBranch

@icon specifies the icon to be displayed when item is closed.
@iconOpen specifies the icon to be displayed when item is open.

this is the example code

<b:treeBranch label="Program Files" icon="../images/act_close.gif" iconOpen="../images/calender.gif">

...

</b:treeBranch>

For further information, you can read it in our reference.chm under the element/treeBranch

Hope this helps

Andys

Thank you. I know how to add

29 May, 2008 - 16:17 — reececox

Thank you.

I know how to add the icon and iconOpen - I have already done that bit - sorry if I did not explain that.

What I wanted to do is have both the open and close (plus minus) buttons with a custom icon. Like in Outlook '07.

There was an example image in the reference.chm - I have labeled which bits I mean in this image: http://tenetics.co.uk/bb/good_tree.gif. I wanted exactly that but the ability to add custom icons where the folder and file icons are.

This would mean that the plus and minus buttons are separate from the folder/file icons. Plus the lines that go between (these are not so important). I think I saw a backbase 3 version of the tree which had this feature - just without the custom icons.

Many thanks, Reece

Work around

2 June, 2008 - 10:05 — reececox

To solve this I just used one image that had both the icon and the plus/minus sign. I made two for each icon (like a folder had two images, one with a plus and the other a minus)...

I just added this CSS to create a larger area for it

.btl-treeBranch .btl-treeBranch-div,

.btl-treeBranch .btl-treeLeaf-label-container { padding-left:33px; }

Not sure if there was a better way of doing this without completely changing the widget - so for now this should be OK.

Plus and Minus

2 June, 2008 - 22:58 — MichaelSimonson

Another option is to change change the binding to use the system version of the tree:

Go into the config.xhtml_btl.chameleon.xml file and find this line:

<uses element="tree treeBranch treeLeaf" src="tree/chameleon/tree.xml"/

and change it to:

<uses element="tree treeBranch treeLeaf" src="tree/system/tree.xml"/>

then you will have the other style of tree.

Many thanks!

3 June, 2008 - 10:18 — reececox

Very good - I did not know the system one did exactly what I wanted - thank you very much, that is perfect!

No Problem

5 June, 2008 - 17:23 — MichaelSimonson

You are welcome!

Problem With Tree Icon

29 July, 2008 - 06:47 — Simondrop

Still I have the problem, even though I changed the follwoing, I want a tree
structure as given in this url http://tenetics.co.uk/bb/good_tree.gif

<uses element="tree treeBranch treeLeaf" src="tree/chameleon/tree.xml"/> 

this to

<uses element="tree treeBranch treeLeaf" src="tree/system/tree.xml"/>

But am still getting a normal tree with an arrow open and close icon but I want folder icons with these arrows and the dotted lines for where to where the folder is expanded,

Please help me for the same.

This should be it... As long

29 July, 2008 - 09:50 — reececox

This should be it... As long as you have the chameleon skin set in your config.xml file - AND - you are changing the correct file config.xhtml_btl.chameleon.xml. Have you tried clearing your cache?

If you have firebug installed you can go look at the console and see what is loaded: "GET http://localhost/infowire/htdocs/public/js/Backbas...ngs/www.backbase.com.2006.btl/tree/system/tree.xml" If it isn't system then you can't have changed the correct file - OR - your cache needs clearing...

Client Framework