Articles in this section
Category / Section

How to do conditional navigation in Xamarin.Forms TreeView (SfTreeView)

1 min read

You can skip navigation for nodes on a particular level in Xamarin.Forms SfTreeView.

XAML

Bind the SfTreeView.TapCommand to navigate to another page. By default, the TreeViewNode is the command parameter for the TapCommand.

<syncfusion:SfTreeView x:Name="treeView" 
                    ChildPropertyName="SubFiles"
                    ItemTemplateContextType="Node"
                    AutoExpandMode="AllNodesExpanded"
                    ItemsSource="{Binding ImageNodeInfo}"
                    TapCommand="{Binding TreeViewTapCommand}">
    <syncfusion:SfTreeView.ItemTemplate>
        <DataTemplate>
            <Grid x:Name="grid" RowSpacing="0" >
                ...
            </Grid>
        </DataTemplate>
    </syncfusion:SfTreeView.ItemTemplate>
</syncfusion:SfTreeView>

C#

In the command execution method, skip the navigation for nodes based on TreeViewNode.Level.

public class FileManagerViewModel
{
    public FileManagerViewModel()
    {
        TreeViewTapCommand = new Command<object>(OnTapped);
    }
 
    public Command<object> TreeViewTapCommand { get; set; }
 
    private void OnTapped(object obj)
    {
        var node = obj as Syncfusion.TreeView.Engine.TreeViewNode;
 
        if (node.Level == 0) return;
 
        var newPage = new Views.NewPage();
        newPage.BindingContext = node;
        App.Current.MainPage.Navigation.PushAsync(newPage);
    }
}

View sample in GitHub

Conditional navigation Xamarin.Forms SfTreeView

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