RadBusyIndicator on TreeView

[Vidyadhar]

Hi,

Am trying to implement the BusyIndicator on a RadTreeView. I have a TreeView which am populating from the result of a WCF Service call. Some of the nodes in the Tree have more than 1000 child nodes. The TreeView also has a context menu with the "ExpandAll" menu item, clicking which calls the RadTreeView's ExpandAll method and expands the whole tree recursively till the leaf nodes.
I set the IsBusy property of the BusyIndicator to true just before I make the service call and set it to false in the Service's Callback method.It works fine when the tree initially loads. Now I want to do the same thing when I click the "ExpandAll" menu item. So I set the IsBusy property of Indicator to true in my MenuItem Click event handler, before calling the TreeView's ExpandAll method. I set it back to false after the ExpandAll method is executed. But I do not see the busy indicator at all. It just hangs the UI.
I would also like to achieve the same, on expanding each individual node of the TreeView such that the Indicator's IsBusy property is set to true in the PreviewExpanded event and to false in the Expanded event..

Can you help me with this.

XAML

<UserControl x:Class="SimpleMvvmSilverlight1.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
    xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
    xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions"
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400">


    <UserControl.Resources>

        <telerik:HierarchicalDataTemplate x:Key="AssetTree_NodeTemplate" ItemsSource="{Binding ChildNodes}" >
           <StackPanel Name="AssetTreeNode_Panel" Orientation="Horizontal">
                <TextBlock Name="TreeNode_txt" Text="{Binding Name}" HorizontalAlignment="Stretch" VerticalAlignment="Center" />
            </StackPanel>
        </telerik:HierarchicalDataTemplate>
         </UserControl.Resources>

    <Grid x:Name="LayoutRoot" Background="White">
        <Grid.RowDefinitions>
            <RowDefinition />
            <RowDefinition />
        </Grid.RowDefinitions>

        <telerik:RadTreeView Name="RadTree" Grid.Row="0" ItemTemplate="{StaticResource AssetTree_NodeTemplate}"
                             BorderThickness="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="3,5" Grid.RowSpan="2">
            <telerik:RadContextMenu.ContextMenu>
                <telerik:RadContextMenu Name="MyMenu">
                    <telerik:RadMenuItem Name="MenuItem_ExpandAll" Header="Expand All" Click="MenuItem_ExpandAll_Click" />
                </telerik:RadContextMenu>
            </telerik:RadContextMenu.ContextMenu>
        </telerik:RadTreeView>


        <telerik:RadBusyIndicator x:Name="radBusyIndicator" Grid.Row="1"
                                  Background="White" Foreground="#155053" BorderThickness="0" HorizontalAlignment="Center" VerticalAlignment="Center" />
           
    </Grid>
</UserControl>

CodeBehind

using System;
using System.Windows.Controls;
using System.Collections.ObjectModel;
using Telerik.Windows;
using Telerik.Windows.Controls;
using SimpleMvvmSilverlight1.AssetTreeServiceReference;


namespace SimpleMvvmSilverlight1
{
    public partial class MainPage : UserControl
    {
        public MainPage()
        {
            InitializeComponent();
            RegistryTreeServiceClient client = new RegistryTreeServiceClient();
            client.GetATNodesCompleted += new EventHandler<GetATNodesCompletedEventArgs>(client_GetTreeNodesCompleted);
            client.GetATNodesAsync();
            this.radBusyIndicator.IsBusy = true;
 }

        void client_GetTreeNodesCompleted(object sender,GetATNodesCompletedEventArgs e)
        {
            this.radBusyIndicator.IsBusy = false;
            this.RadTree.ItemsSource = e.Result;
        }

        public void OnNodePreviewExpand(object sender, RadRoutedEventArgs e)
        {          
            this.radBusyIndicator.IsBusy = true;
        }


        public void OnNodeExpanded(object sender, RadRoutedEventArgs e)
        {           
           this.radBusyIndicator.IsBusy = false;
        }

        private void MenuItem_ExpandAll_Click(object sender, RadRoutedEventArgs e)
        {
            RadMenuItem menuItem = sender as RadMenuItem;
            RadTreeViewItem treeViewItem = (menuItem.Menu as RadContextMenu).GetClickedElement<RadTreeViewItem>();
            this.radBusyIndicator.IsBusy = true;
            ExpandAll(treeViewItem, true);
        }

        private void ExpandAll(RadTreeViewItem myTreeItem, bool bExpandOrContract)
        {
           if (bExpandOrContract)
                myTreeItem.ExpandAll();
            else
                myTreeItem.CollapseAll();

           this.radBusyIndicator.IsBusy = false;
        }
    }
}

Thanks,
Viddy.

[Petar Mladenov]

Hi Vidyadhar,

 By default ExpandAll() is very expensive operation and it is normal to block your UI thread when you have thousands of Items, furthermore you have animations on every expansion and on the separate BusyIndicator.
But we found it strange that you don't use virtualization feature of the RadTreeView. Have you considered using it? You can check this demo and examine its documentation here. When using the virtualization , your busy indicator may become useless - it may even don't have enough time to work.
On a side note, when expanding a particular item, you can use the LoadOnDemand feature of the RadTreeView. This way the expander of the RadTreeViewItem imitates a busy indicator when the child items are being loaded.

All the best,
Petar Mladenov
the Telerik team