Hello, 

I use the Telerik TreeListView. I would like to implement auto resizing for the header cells. In my app, there is the possibility to change the language. Some of the header texts may be changed by this action.

If a text becomes longer after changing the language (e. g. the German word "Haus" is replaced by the English word "House"), the width of the column gets bigger. That means, auto resizing to a bigger width exists..

But after changing back to German (the header content becomes shorter), there is no auto resizing to a smaller width.

Is there an event I can check or a property for the TreeListView?

Thank you very much.

Best regards,

Alex

Hi Telerik Team,

I am currently using the RadTreeListView in a WPF project and have encountered the following issues that I am unable to resolve:

1. Unwanted Border Around Column Headers:
   Despite setting BorderBrush and BorderThickness to Transparent or 0 for the headers, there is still a faint border around the header cells. I tried modifying the control templates based on the Telerik documentation but haven't been able to remove it.

2. Row Hover Color Changes to Orange/Golden:
   When I hover over any row, its background color changes to an orange/golden shade, even though I have explicitly set the IsMouseOver trigger to make the row background transparent.

3. Customizing the Toggle Button Icon from Triangle to Arrow:
   I want to replace the default triangular toggle icon (used to expand/collapse rows) with a simple arrow icon, but I’m not sure how to modify the toggle button template correctly.
   Below is a simplified version of my current RadTreeListView XAML:
   

   <telerik:RadTreeListView ItemsSource="{Binding Files}"  
                            Name="fileViewer"  
                            AutoGenerateColumns="False"  
                            Background="Transparent"  
                            Foreground="White"  
                            BorderThickness="0"  
                            RowIndicatorVisibility="Collapsed"  
                            CanUserSortColumns="False">  
   
     <telerik:RadTreeListView.Resources>  
       <Style TargetType="telerik:GridViewHeaderCell">  
         <Setter Property="BorderBrush" Value="Transparent" />  
         <Setter Property="BorderThickness" Value="0" />  
         <Setter Property="Background" Value="Transparent" />  
       </Style>  
   
       <Style TargetType="telerik:TreeListViewRow">  
         <Setter Property="Background" Value="Transparent" />  
         <Style.Triggers>  
           <Trigger Property="IsMouseOver" Value="True">  
             <Setter Property="Background" Value="Transparent" />  
           </Trigger>  
         </Style.Triggers>  
       </Style>  
     </telerik:RadTreeListView.Resources>  
   
     <telerik:RadTreeListView.Columns>  
       <telerik:GridViewDataColumn Header="Name" Width="*" DataMemberBinding="{Binding Name}" />  
       <telerik:GridViewDataColumn Header="Classification" Width="*" DataMemberBinding="{Binding Classifications}" />  
     </telerik:RadTreeListView.Columns>  
   </telerik:RadTreeListView>  
   

Hello,

I am working with GridViewColumnGroups in RadTreeListView. The first steps and styling worked pretty well. 

This morning, I stumbled upon an issue which I am trying to fix now - so far, without success:

I need to implement the "Thumb" and resizing for a GridViewColumnGroup by dragging it with the mouse (the same behavior as it already exists for plain columns). The reason I want to implement this is that I want to "fake" a certain behavior: There are alternating GridViewColumnGroups which each contain only one column. But the user of the application should be under the illusion that the column header cell and the column group are one cell - as if the two "melted together".

By styling the column group, I can make it look like that (I changed the background colour and set the bottom border to thickness zero - that's it). But I also need to implement the Thumb that not only the appearance but also the behavior are the same.

This leads me to the issue that a two-way binding between the column width and the column group width has to be implemented.

Any help here or someone with experience / a solution to this issue?

Any help is appreciated! Thanks a lot in adavance!

Alex

Hi,

I am using the TreeListView control and I've come along with it pretty well. A few days ago, I stumbled upon a small problem which I couldn't solve so far.

The bottom and right border of the TreeListView control appear to be thicker than the left and top border. This is caused by the interior cell borders: each cell seems to have a border on the bottom and right.

As soon as the cell border and the TreeListView border are directly next to each other, there's an 'illusion' created that the overall border is double in thickness.

E.g., as soon as I scroll to the bottom of the table, the border of the last cell will 'connect' with the overall table border:

In the attached screenshot, each border has a thickness of 1. But two borders which are layouted directly next to each other will make it look like the border has a thickness of 2.

The same problem appears on the right side of the table. I have some table rows which do not show borders at all, which is solved with a style selector (red arrow in the screenshot). This leads to a different thickness of the right border in comparison to a 'normal' row (blue arrow in the screenshot).

How could I solve this issue? My suggestion would be to use a style / template which is only applied to the last row / column. In the last row, the bottom border would have a thickness of 0; in the last column, the right border would have a thickness of 0. The bottom right cell would have no own borders at all because its optical borders are provided by the left and upper cell and the overall table border.

But I have no idea how to apply this. I have seen such solutions in other projects but I can't manage to apply it to the Telerik TreeListView. I Imagine it could be implemented by a mechanism which automatically determines the last row and cell and then applies a different template.

Thanks a lot in advance! Any help is highly appreciated.

I want to set backgound of selected row in RadTreeListView. I tried below, but it does not work. 

I'm applying a theme to my application using no-xaml. When using a theme, is it not possible to change the background?

            <Style TargetType="telerik:TreeListViewRow" BasedOn="{StaticResource TreeListViewRowStyle}">
                <Style.Triggers>
                    <Trigger Property="IsSelected" Value="True">
                        <Setter Property="SelectedBackground" Value="#FFFFBB00" />
                        <Setter Property="Background" Value="#FFFFBB00"/>
                    </Trigger>
                </Style.Triggers>
            </Style>

I want to save the expansion state of my TreeListView before I reload the data and I use the following code:

foreach (var item in _currentTreeListView.Items)
{
    if (_currentTreeListView.IsExpanded(item))
    {
        expandedItems.Add(item);
    }
}

// Data update and TreeListView reload

foreach (var item in expandedItems)
{
    _currentTreeListView.ExpandHierarchyItem(item);
}

But _currentTreeListView.IsExpanded(item) returns false no matter if the corresponding item is expanded in the TreeListView. What's the problem?

I have the following XAML code:

<telerik:RadLayoutControl >
    <telerik:RadTabControl>
        <telerik:RadTabItem Header="Admin">
            <telerik:RadTabItem.Content>
                <telerik:RadLayoutControl>
				
                    <!-- Left Side -->
                    <telerik:RadTreeListView Name="TreeListView" ItemsSource="{Binding Arguments}">
                        <telerik:RadTreeListView.ChildTableDefinitions>
                            <telerik:TreeListViewTableDefinition ItemsSource="{Binding Children}" />
                        </telerik:RadTreeListView.ChildTableDefinitions>
                    </telerik:RadTreeListView>
					
                    <telerik:LayoutControlSplitter />

                    <!-- Right Side -->
                    <telerik:RadTabControl Width="Auto">
                        <telerik:RadTabItem Header="Tab 1">
                            <telerik:RadGridView></telerik:RadGridView>
                        </telerik:RadTabItem>
                        <telerik:RadTabItem Header="Tab 2">
                            <telerik:RadGridView></telerik:RadGridView>
                        </telerik:RadTabItem>
                    </telerik:RadTabControl>

                </telerik:RadLayoutControl>
            </telerik:RadTabItem.Content>
        </telerik:RadTabItem>
    </telerik:RadTabControl>
</telerik:RadLayoutControl>

The problem is that when I populate the TreeListView with big number of items, it stretches the topmost RadLayoutControl parent (look at the scrollbar position on the far right). The behavior I expect is that the TreeListView itself gets a vertical scrollbar like when I set it to a fixed Height. But I want it to be resizable with the window.

How can I achieve such behavior?

I want to use a RadTreeListView but the hierarchy does not contain children of the same type. Can I achieve this using RadTreeListView and have different properties at each hierarchy level?

Thank you!