How to add a static child node

3 posts, 1 answers
  1. Rajesh
    Rajesh avatar
    15 posts
    Member since:
    Jan 2013

    Posted 20 Jan 2013 Link to this post

    Hi there,

      My customer would like to have a "HardCoded" text as one of the child node.

    I have a RadTreeview with 3 to 4 level deep of treeview items. First 3 levels are dynamically populated. At the end I would like to have
    "HardCoded" text as another treeview item. Something like this.

    AccountWkb -> AccountInformation -> Balances (My ViewModel has a observable collection of property for each Items.)
    AccountWkb -> OtherOrders -> MutualFund

    Now I would like to add a "HardCoded" text as another treeview item.
    For E.g Output should be

    AccountWkb -> AccountInformation -> Balances -> Fields
    AccountWkb -> OtherOrders -> MutualFund -> Fields
            <Style x:Key="RADTreeViewItemStyle" TargetType="telerik:RadTreeViewItem">
                <Setter Property="HorizontalAlignment" Value="Left"/>
                <Setter Property="HorizontalContentAlignment" Value="Left" />
                <Setter Property="VerticalContentAlignment" Value="Center" />
                <Setter Property="CheckState" Value="Off" />
                <Setter Property="BorderThickness" Value="1" />
                <Setter Property="Padding" Value="1 0 5 0" />
                <Setter Property="IsDropAllowed" Value="True" />
                <Setter Property="ItemsOptionListType" Value="Default" />
                <Setter Property="IsEnabled" Value="True" />
                <Setter Property="MinHeight" Value="24" />               
                <Setter Property="Template" Value="{StaticResource TreeViewItemDefaultTemplate}" />
                <Setter Property="ItemsPanel">
                            <telerik:TreeViewPanel VerticalAlignment="Bottom" />
            <telerik:ContainerBindingCollection x:Name="BindingsCollections">
                <telerik:ContainerBinding PropertyName="IsSelected" Binding="{Binding IsSelected, Mode=TwoWay}"/>
                <telerik:ContainerBinding PropertyName="IsExpanded" Binding="{Binding IsExpanded, Mode=TwoWay}"/>
                <telerik:ContainerBinding PropertyName="IsLoadOnDemandEnabled" Binding="{Binding IsLoadOnDemandEnabled, Mode=TwoWay}"/>
            <telerik:HierarchicalDataTemplate x:Key="AvailableFieldTemplate">
                <TextBlock Text="{Binding Name}"/>
            <telerik:HierarchicalDataTemplate x:Key="FunctionTemplate"
                                          telerik:ContainerBinding.ContainerBindings="{StaticResource BindingsCollections}"
                                          ItemTemplate="{StaticResource AvailableFieldTemplate}"
                                          ItemsSource="{Binding AvailableFields}" >
                <TextBlock Text="{Binding Name}"/>
            <telerik:HierarchicalDataTemplate x:Key="FeatureTemplate"
                                          telerik:ContainerBinding.ContainerBindings="{StaticResource BindingsCollections}"
                                          ItemTemplate="{StaticResource FunctionTemplate}"
                                          ItemsSource="{Binding Functions}" >
                <TextBlock Text="{Binding Name}"/>
            <telerik:HierarchicalDataTemplate x:Key="ApplicationTemplate"
                                          telerik:ContainerBinding.ContainerBindings="{StaticResource BindingsCollections}"
                                          ItemTemplate="{StaticResource FeatureTemplate}"
                                          ItemsSource="{Binding Features}">
                <TextBlock Text="{Binding Name}"/>
    <Grid x:Name="LayoutRoot" >
                <RowDefinition Height="*"/>
                <telerik:RadTreeView x:Name="LocationsView_RadTreeView" VerticalAlignment="Top" ItemContainerStyle="{StaticResource RADTreeViewItemStyle}"
                                     ItemsSource="{Binding RelativeSource={RelativeSource AncestorType=uc:BaseMainView}, Path=DataContext.FieldEditorViewModel.SelectedProductCatalog, Mode=TwoWay}"
                                     ItemTemplate="{StaticResource ApplicationTemplate}" SelectionMode="Single"
                                     IsLoadOnDemandEnabled="True" LoadOnDemand="LocationsView_RadTreeView_LoadOnDemand"
                                     IsExpandOnSingleClickEnabled="True" SelectedItem="{Binding Path=SelectedItem, Mode=TwoWay}" ScrollViewer.VerticalScrollBarVisibility="Auto">

    (So when I expand the "Balances" node or "MutualFund" node, it should populate "Fields" as its sub node. So that I can populate list of fields for respective location.)

    I have attached my Xaml where I defined my RadTreeview.
    Also I have attached a screen shot of how my location should look like.

    Myself and my customer will highly appreciate your timely help.

    Thanks in advance.

  2. Answer
    Tina Stancheva
    Tina Stancheva avatar
    3299 posts

    Posted 21 Jan 2013 Link to this post

    Hello Rajesh,

    The best approach would be to add the static items the same way you dynamically generate the other items. As you haven't sent your LoadOneDemand event handler implementation, I'm not sure what logic you have set up to load the items in the RadTreeView. However, you can check for the Level of the expanded item. If its value indicates that this is the last dynamically generated level in the hierarchy (for example the 4th level which will be a RadTreeViewItem with Level property of 3 as the Levels are counted from 0), then you can add the static items. For example, if the RadTreeViewItems represent a DataItem object, you can use a similar logic:
    private void LocationsView_RadTreeView_LoadOnDemand(object sender, Telerik.Windows.RadRoutedEventArgs e)
        RadTreeViewItem expandedItem = e.OriginalSource as RadTreeViewItem;
        if (expandedItem != null)
            if (expandedItem.Level < 3)
                DataItem dataItem = expandedItem.Item as DataItem;
                if (dataItem == null) return;
                for (int j = 0; j < 3; j++)
                    DataItem child = new DataItem { Header = String.Format("{0}.{1}", dataItem.Header, j), IsLoadOnDemandEnabled = true };
                DataItem dataItem = expandedItem.Item as DataItem;
                if (dataItem == null) return;
                dataItem.Children.Add(new DataItem("Fields"));
                dataItem.Children.Add(new DataItem("Footers"));

    Or you can use a custom ValueConverter to create the last level of static items as demonstrated in the attached sample. Basically in this approach, you pass an empty collection of business items to the ItemsSource of a HierarchicalDataTemplate and add the items (Fields, Footers) in it in the Convert() method in the converter class.

    The approach you choose to implement should really be based on the requirements and specifics of your application. You only need to have in mind that the RadTreeView and the RadTreeViewItems expect hierarchical data and you need to pass a collection of business items to display the children of any level. So even if your real data doesn't contain a collection of children for the last level, you'll need to create a one (even if it is a mock-up/temp collection) to display one more level of items.

    Tina Stancheva
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

  3. Rajesh
    Rajesh avatar
    15 posts
    Member since:
    Jan 2013

    Posted 24 Jan 2013 Link to this post

    Thanks much!

    Your sample code really helped me to understand to take a direction.

    I used the Value converter approach to solve my issue.

    Your suggestion really helped me.

Back to Top