custom skin for treeview

[Jean-Marc Windholz]

Hello Folks!

 

I’m getting troubles creating my treeview skin for my web application.

At the end it should look like this (see image), I don’t have a clue how to work it out.

 

Exploding nodes should have an icon, those with no sons another icon.

And I should put a line separating  a node from another

I tried deriving default skin with no good result.

 

Anyone can help?

Thanks

[Schlurk]

Whenever I try to completely revamp a skin I try to use the Visual Style Builder first, it's a pretty neat tool :) Have you looked into using it? Perhaps it'll be a bit easier to set up the skin in this case.

[Jean-Marc Windholz]

yes, I just tried to use Visual Style Builder but I can not get what I want..
Particulary,how can I put the line between the nodes??
Thanks!

[Jean-Marc Windholz]

However,
How Can I align all nodes to the left? Without any margins?

thanks!

[Kamen Bundev]

Hello Jean-Marc,

Basically you can set border-style of .rtTop/.rtMid/.rtBot to dashed to get dashed borders:

div.RadTreeView .rtLines .rtTop,
div.RadTreeView .rtLines .rtMid,
div.RadTreeView .rtLines .rtBot
{

    border-bottom-style: dashed;

    border-width: 1px;

}

You will also need to remove the padding of .rtUL and move it to .rtLI:

div.RadTreeView .rtUL .rtLI .rtUL
{

    padding-left: 0;

}

div.RadTreeView .rtLI .rtLI
{

    padding-left: 20px;

}

Let me know if this helps.

If you can't do it yourself, you can also send me your custom skin in a support ticket and I will try to help you fix it.

Regards,
Kamen Bundev
the Telerik team

Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
Follow the status of features or bugs in PITS and vote for them to affect their priority.

[André Freitas]

Give it a try.

http://www.telerik.com/help/aspnet-ajax/tree_appearancecustomskintutorial.html