Articles in this section
Category / Section

How to load items in WPF HierarchyNavigator (Breadcrumb) control in on-demand?

1 min read

This article describes how to dynamically load next level items (on-demand loading) in WPF HierarchyNavigator (Breadcrumb) when item is selected.

In this example, files in the system drive are load as next level items in on-demand using the HierarchyNavigatorSelectedItemChanged event.

The following code example demonstrates the same.

XAML

MainWindow.xaml

<Grid>
    <syncfusion:HierarchyNavigator ItemsSource = "{Binding HierarchyItems}" x:Name="hierarchy" Height="50" Width="500" HierarchyNavigatorSelectedItemChanged="Hierarchy_HierarchyNavigatorSelectedItemChanged">
        <syncfusion:HierarchyNavigator.ItemTemplate>
            <HierarchicalDataTemplate ItemsSource = "{Binding FileItems}" >
                <TextBlock Text="{Binding Content}"/>
            </HierarchicalDataTemplate>
        </syncfusion:HierarchyNavigator.ItemTemplate>
    </syncfusion:HierarchyNavigator>
</Grid>

 

In the below code, next level items are added to the collection in HierarchyNavigatorSelectedItemChanged in on-demand.

C#

MainWindow.xaml.cs

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
    }
 
    private void Hierarchy_HierarchyNavigatorSelectedItemChanged(object sender, Syncfusion.Windows.Tools.Controls.HierarchyNavigatorSelectedItemChangedEventArgs e)
    {
        if (hierarchy.SelectedItem == null)
            return;
        HierarchicalModel selectedItem = hierarchy.SelectedItem as HierarchicalModel;
        string[] dirs = Directory.GetDirectories(selectedItem.Content, "*", SearchOption.TopDirectoryOnly);
        foreach (string dir in dirs)
        {
            selectedItem.FileItems.Add(new HierarchicalModel(dir));
        }
    }
}

 

HierarchicalModel.cs

public class HierarchicalModel
{
    public HierarchicalModel(string content, params HierarchicalModel[] items)
    {
        Content = content;
        fileItems = new ObservableCollection<HierarchicalModel>();
        foreach (var item in items)
        {
            fileItems.Add(item);
        }
    }
 
    private ObservableCollection<HierarchicalModel> fileItems;
 
    public ObservableCollection<HierarchicalModel> FileItems
    {
        get { return fileItems; }
        set
        {
            if (fileItems != value)
            {
                fileItems = value;
            }
        }
    }
 
    public string Content { get; set; }
}

 

HierarchicalViewModel.cs

public class HierarchicalViewModel
{
    public HierarchicalViewModel()
    {
        hierarchyItems = new ObservableCollection<HierarchicalModel>();
        this.hierarchyItems.Add(
            new HierarchicalModel("My Files",
            new HierarchicalModel("D:\\"),
            new HierarchicalModel("C:\\"))
            );
    }
 
    private ObservableCollection<HierarchicalModel> hierarchyItems;
 
    public ObservableCollection<HierarchicalModel> HierarchyItems
    {
        get { return hierarchyItems; }
        set { hierarchyItems = value; }
    }
}

 

 

The output for the above code is shown below:

 

Output


 

 

 

 

 

 

 

 

 

View sample in GitHub

 

Did you find this information helpful?
Yes
No
Help us improve this page
Please provide feedback or comments
Comments (0)
Please  to leave a comment
Access denied
Access denied