如何在Syncfusion的TreeView上触发点击事件

时间:2019-11-04 03:33:43

标签: xamarin.forms treeview syncfusion

Menu.xaml

<MasterDetailPage.Master>
    <ContentPage Title="Menu" Padding="0">
        <ContentPage.Content>
            <StackLayout>
                <Grid BackgroundColor="LightGreen">
                    <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="10"/>
                            <ColumnDefinition Width="*"/>
                            <ColumnDefinition Width="10"/>
                        </Grid.ColumnDefinitions>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="30"/>
                            <RowDefinition Height="80"/>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="10"/>
                        </Grid.RowDefinitions>
                        <Label Grid.Column="1"
                               Grid.Row="2"
                               Text="DEC App"
                               TextColor="White"
                               FontSize="Large"/>
                    </Grid>
                    <syncfusion:SfTreeView x:Name="treeView">
                        <syncfusion:SfTreeView.Nodes>
                            <!--1st Menu-->
                            <treeviewengine:TreeViewNode Content="Menu 1">
                                <treeviewengine:TreeViewNode.ChildNodes>
                                    <treeviewengine:TreeViewNode Content="Menu 1.1">
                                        <!--SubMenu 1-->
                                    </treeviewengine:TreeViewNode>
                                    <treeviewengine:TreeViewNode Content="Menu 1.2">
                                        <!--SubMenu 2-->
                                        <treeviewengine:TreeViewNode.ChildNodes>
                                            <treeviewengine:TreeViewNode Content="Menu 1.2.1"/>
                                            <!--SubMenu 2.1-->
                                            <treeviewengine:TreeViewNode Content="Menu 1.2.2"/>
                                            <!--SubMenu 2.2-->
                                        </treeviewengine:TreeViewNode.ChildNodes>
                                    </treeviewengine:TreeViewNode>
                                </treeviewengine:TreeViewNode.ChildNodes>
                            </treeviewengine:TreeViewNode>
                        </syncfusion:SfTreeView.Nodes>
                    </syncfusion:SfTreeView>
                </StackLayout>
            </ContentPage.Content>
        </ContentPage>
    </MasterDetailPage.Master>
</MasterDetailPage>

Menu.xaml.cs

using Xamarin.Forms;
using Xamarin.Forms.Xaml;

namespace MasterDetailDemo
{
     [XamlCompilation(XamlCompilationOptions.Compile)]
     public partial class Menu : MasterDetailPage
{
    public Menu()
    {
        InitializeComponent();
        Detail = new NavigationPage(new MenuDetail());
    }

我使用Syncfusion的SfTreeView在此处创建此菜单

TreeView in Master Page Demo

但是我不知道如何在其上创建单击事件,我尝试通读Syncfusion的所有文档,但并没有太大帮助。预先感谢

3 个答案:

答案 0 :(得分:0)

答案 1 :(得分:0)

我们想通知您,当在视图中单击树视图节点时,可以使用TreeView的ItemTapped事件或TapCommand来获取通知。我们随附了示例和代码段,供您在下面参考。

示例链接:https://www.syncfusion.com/downloads/support/directtrac/254006/ze/TreeviewMasterDetail-384415166

要了解有关TapCommand和ItemTapped事件的更多信息,请参阅我们的文档。

https://help.syncfusion.com/xamarin/treeview/mvvm#tap-command https://help.syncfusion.com/xamarin/treeview/interactivity#tapped-eventhttps://help.syncfusion.com/xamarin/treeview/interactivity#tapped-event

public class ContentPageBehavior : Behavior<ContentPage>
{
        protected override void OnAttachedTo(ContentPage bindable)
        {
            TreeView = bindable.FindByName<SfTreeView>("treeView");
            TreeView.ItemTapped += TreeView_ItemTapped;
            base.OnAttachedTo(bindable);
        }

        private void TreeView_ItemTapped(object sender, Syncfusion.XForms.TreeView.ItemTappedEventArgs e)
        {
            var TappedNode = e.Node as TreeViewNode;
            App.Current.MainPage.DisplayAlert("Message","Tapped Item : "+ TappedNode.Content, "Ok");
        }

}

答案 2 :(得分:0)

首先,将ItemTapped事件添加到syncfusion:SfTreeView

  <syncfusion:SfTreeView x:Name="treeView" ItemTapped="treeView_ItemTapped">
                        <syncfusion:SfTreeView.Nodes>
                            <!--1st Menu-->
                            <treeviewengine:TreeViewNode Content="Menu 1">
                                //...
                            </treeviewengine:TreeViewNode>
                        </syncfusion:SfTreeView.Nodes>
                    </syncfusion:SfTreeView>

然后在treeView_ItemTapped中,您可以知道要单击哪个node并导航到相应的页面:

private void treeView_ItemTapped(object sender, Syncfusion.XForms.TreeView.ItemTappedEventArgs e)
{

    var TappedNode = e.Node as TreeViewNode;

    Console.WriteLine(TappedNode.Content);


    if (TappedNode.Content is "Menu 1")
    {
        Detail = new NavigationPage(new ItemsPage());
        IsPresented = false;
    }
    else if (TappedNode.Content is "Menu 1.1")
    {
        Detail = new NavigationPage(new AboutPage());
        IsPresented = false;
    }
    else if (TappedNode.Content is "Menu 1.2")
    {
        //...
    }
    else
    {
        //...
    }
}

如果需要,我可以与您分享样品。如果您有任何问题,请告诉我。