This is a migrated thread and some comments may be shown as answers.

RadTreeView Control Skinned Like a Menu

1 Answer 73 Views
TreeView
This is a migrated thread and some comments may be shown as answers.
Timothy Kruszewski
Top achievements
Rank 1
Timothy Kruszewski asked on 09 Apr 2010, 12:25 AM
I have an ComponentArt treeview control that is skinned to look like a menu control per my clients request.  It looks and work perfect except for that fact it is not a Telerik control.  I would love to use the RadTreeView control but I cannot figure out all of the css components needed to make it work properly.  Please see the attached image of the two controls side by side and you will see what I am trying to accomplish.  I followed the example of how to create your own skin which was very useful but I just can't figure out what I'm missing.

 

.RadTreeView_Skins,  
.RadTreeView_Skins a.rtIn,  
.RadTreeView_Skins .rtEdit .rtIn input  
{  
        background-image: url(TreeView/item_bg.gif);  
 
    background-color:#666666;  
    border: 1px solid #666666;   
    font-family: arial, verdana;   
    font-size: 10px;   
    font-weight: bold;   
}  
 
.RadTreeView_Skins .rtPlus,   
.RadTreeView_Skins .rtMinus  
{  
    background-image: url('TreeView/plusminus.png');  
}  
 
.RadTreeView_Skins .rtChecked,  
.RadTreeView_Skins .rtUnchecked,  
.RadTreeView_Skins .rtIndeterminate  
{  
    background-image: url('TreeView/TriState.png');  
}  
 
.RadTreeView_Skins .rtHover .rtIn   
{  
    background-image: url(TreeView/item_Expanded_bg.gif);  
    border: 1px solid white;  
    font-family: arial, verdana;   
    font-size: 10px;   
    font-weight: bold;   
    cursor:hand;  
    color:#000;  
    width:350px;  
}  
 
.RadTreeView_Skins .rtSelected .rtIn  
{  
    background-image: url(TreeView/item_expanded_bg.gif);  
    border: 1px solid white;  
    font-family: arial, verdana;   
    font-size: 10px;   
    font-weight: bold;   
    cursor:hand;  
    color:#000;  
    width:350px;  
}  
 
.RadTreeView_Skins .rtSelected .rtLoadingBefore,  
.RadTreeView_Skins .rtSelected .rtLoadingAfter,  
.RadTreeView_Skins .rtSelected .rtLoadingBelow  
{  
    color: #333;  
}  
 
.RadTreeView_Skins .rtLoadingIcon  
{  
    background-image: url('TreeView/LoadingIcon.gif');  
}  
 
.RadTreeView_Skins .rtLI .rtEdit .rtIn  
{  
    border-color: #6c6c6c;  
    background: #fff;  
}  
 
.RadTreeView_Skins_disabled .rtIn,  
.RadTreeView_Skins .rtDisabled .rtIn  
{  
    color: #ccc;  
      

1 Answer, 1 is accepted

Sort by
0
Peter
Telerik team
answered on 09 Apr 2010, 10:19 AM
Hello Timothy,

I am not familiar with the ComponentArt treeview control, but looking at the screenshot your sent, it resembles very much our RadPanelBar control. My recommendation is you consider using RadPanelBar and create a custom skin with our visual style builder tool. I believe this would be a neater solution to your requirement.


Kind regards,
Peter
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
Tags
TreeView
Asked by
Timothy Kruszewski
Top achievements
Rank 1
Answers by
Peter
Telerik team
Share this question
or