WinUI 3 TreeView Item Context Flyout

Question

I have TreeView with binded collection. How can I get object from TreeViewItem Context Flyout with Button in this Flyout by Click event? Can't use selected item because right clicking don't set item as selected. Thanks, I'm new with WinUI 3. Here's my code:

<DataTemplate x:Key="TreeViewPalleteItemTemplate" x:DataType="local:PalleteItem">
            <TreeViewItem>
                <TreeViewItem.ContextFlyout>
                    <Flyout Placement="BottomEdgeAlignedLeft">
                        <StackPanel Orientation="Horizontal">
                            <Button Width="60" Height="60" Click="DeletePalleteItem_Click">
                                <SymbolIcon Symbol="Delete"/>
                            </Button>
                            <Button Width="60" Height="60">
                                <SymbolIcon Symbol="Setting"/>
                            </Button>
                        </StackPanel>
                    </Flyout>
                </TreeViewItem.ContextFlyout>
                <StackPanel Orientation="Vertical">
                    <StackPanel Orientation="Horizontal">
                        <Image Source="Graphics/part.png" Margin="0,0,5,0" Stretch="Uniform" MaxHeight="20"/>
                        <TextBlock Text="{Binding Item.DrawingNumber}" FontSize="18" />
                        <TextBlock Text=" - " FontSize="18" />
                        <TextBlock Text="{Binding Item.DrawingName}" FontSize="18" />
                    </StackPanel>
                    <StackPanel Orientation="Horizontal" Margin="30,0,0,0">
                        <TextBlock Text="{Binding EmployeeName}"  FontSize="16"/>
                        <TextBlock Text=" - ("  FontSize="16"/>
                        <TextBlock Text="{Binding CountString}"  FontSize="16"/>
                        <TextBlock Text=")"  FontSize="16"/>
                    </StackPanel>
                </StackPanel>
            </TreeViewItem>
        </DataTemplate>

private void DeletePalleteItem_Click(object sender, RoutedEventArgs e)
{
      here get clicked object (PalleteItem).....
}

score 1 · Answer 1 · answered Dec 20 '22 at 01:32

This is another option:

<Grid>
    <TreeView
        x:Name="TreeViewControl"
        ItemsSource="{x:Bind Items}">
        <TreeView.ItemTemplate>
            <DataTemplate x:DataType="local:Item">
                <TreeViewItem Content="{x:Bind Id}">
                    <TreeViewItem.ContextFlyout>
                        <Flyout>
                            <Button
                                Click="Button_Click"
                                Content="Click" />
                        </Flyout>
                    </TreeViewItem.ContextFlyout>
                </TreeViewItem>
            </DataTemplate>
        </TreeView.ItemTemplate>
    </TreeView>
</Grid>

public class Item
{
    public string Id { get; set; } = string.Empty;
}

public sealed partial class MainWindow : Window
{
    public MainWindow()
    {
        this.InitializeComponent();
    }

    public ObservableCollection<Item> Items { get; } = new()
    {
        new Item() { Id = "A" },
        new Item() { Id = "B" },
        new Item() { Id = "C" },
    };

    private void Button_Click(object sender, RoutedEventArgs e)
    {
        if (sender is Button button &&
            button.DataContext is Item item)
        {
            // Do something here...
        }
    }
}

score 0 · Answer 2 · answered Dec 14 '22 at 16:37

OK. finally I get solution by adding RightTapped event and set TreeViewItem as selected. But is there another (better) solution to get object ?

private void TreeViewItem_RightTapped(object sender, RightTappedRoutedEventArgs e)
    {
        if (sender is TreeViewItem item)
        {
            item.IsSelected = true;
        }
    }

WinUI 3 TreeView Item Context Flyout

2 Answers2