Articles in this section
Category / Section

How to add or remove nodes to unbound mode TreeView in Xamarin.Forms?

1 min read

You can add or remove nodes to the UnBoundMode TreeView in Xamarin.Forms TreeView.

XAML

To update collection changes to the UI, use NotificationSubscriptionMode as CollectionChange.

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:syncfusion="clr-namespace:Syncfusion.XForms.TreeView;assembly=Syncfusion.SfTreeView.XForms"
             xmlns:treeviewengine="clr-namespace:Syncfusion.TreeView.Engine;assembly=Syncfusion.SfTreeView.XForms"
             xmlns:behavior="clr-namespace:TreeViewXamarin.Helper"
             x:Class="TreeViewXamarin.MainPage" Padding="{OnPlatform iOS='0,40,0,0'}">
    <ContentPage.Behaviors>
        <behavior:Behavior/>
    </ContentPage.Behaviors>
    <ContentPage.Content>
        <StackLayout>
            <Grid HeightRequest="50" >
                <Button x:Name="addButton" Text="Add Node" />
                <Button x:Name="deleteButton" Text="Delete Node" Grid.Column="1"/>
            </Grid>
            <syncfusion:SfTreeView x:Name="treeView" NotificationSubscriptionMode="CollectionChange">
                <syncfusion:SfTreeView.Nodes>
                    <treeviewengine:TreeViewNode x:Name="australia" Content="Australia" >
                        <treeviewengine:TreeViewNode.ChildNodes>
                            <treeviewengine:TreeViewNode Content="New South Wales">
                                <treeviewengine:TreeViewNode.ChildNodes>
                                    <treeviewengine:TreeViewNode Content="Sydney"/>
                                    <treeviewengine:TreeViewNode Content="Canberra"/>
                                    <treeviewengine:TreeViewNode Content="Newcastle–Maitland"/>
                                </treeviewengine:TreeViewNode.ChildNodes>
                            </treeviewengine:TreeViewNode>
                           ...
                </syncfusion:SfTreeView.Nodes>
            </syncfusion:SfTreeView>
        </StackLayout>
    </ContentPage.Content>
</ContentPage>

C#

In the Button.Clicked events, Add or remove the TreeViewNodes.

namespace TreeViewXamarin.Helper
{
    public class Behavior : Behavior<ContentPage>
    {
        SfTreeView TreeView;
        Button AddButton;
        Button DeleteButton;
 
        protected override void OnAttachedTo(ContentPage bindable)
        {
            TreeView = bindable.FindByName<SfTreeView>("treeView");
            AddButton = bindable.FindByName<Button>("addButton");
            DeleteButton = bindable.FindByName<Button>("deleteButton");
 
            AddButton.Clicked += AddButton_Clicked;
            DeleteButton.Clicked += DeleteButton_Clicked;
 
            base.OnAttachedTo(bindable);
        }
 
        private void AddButton_Clicked(object sender, EventArgs e)
        {
            var india = new TreeViewNode() { Content = "India" };
            var delhi = new TreeViewNode() { Content = "Delhi" };
            var newDelhi = new TreeViewNode() { Content = "New Delhi" };
            delhi.ChildNodes.Add(newDelhi);
            var tamilNadu = new TreeViewNode() { Content = "Tamil Nadu" };
            var chennai = new TreeViewNode() { Content = "Chennai" };
            india.ChildNodes.Add(delhi);
            india.ChildNodes.Add(tamilNadu);
            tamilNadu.ChildNodes.Add(chennai);
 
            TreeView.Nodes.Add(india);
        }
 
        private void DeleteButton_Clicked(object sender, EventArgs e)
        {
            TreeView.Nodes.RemoveAt(1);
        }
    }
}

View sample in GitHub

Demo image to add or remove the nodes to the UnBoundMode TreeView in Xamarin.Forms

Conclusion

I hope you enjoyed learning about how to add or remove nodes to unbound mode in Xamarin.Forms TreeView (SfTreeView).

You can refer to our Xamarin.Forms TreeView feature tour page to know about its other groundbreaking feature representations and documentation, and how to quickly get started for configuration specifications.

For current customers, you can check out our components from the License and Downloads page. If you are new to Syncfusion, you can try our 30-day free trial to check out our other controls.

If you have any queries or require clarifications, please let us know in the comments section below. You can also contact us through our support forumsDirect-Trac, or feedback portal. We are always happy to assist you!

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