Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Accessing WPF component inside DataTemplate with Data Binding

I have several UI elements in a DataTemplate bound to an ObservableCollection of Video objects. I want to call a method of a Video object when I click on the ContextMenuItem [Test] of the corresponding UI element.

Here is my XAML:

            <ItemsControl Name="VideoUIElment" >
                <ItemsControl.ItemTemplate>
                    <DataTemplate x:Uid="videoTemplate">
                        <Border CornerRadius="10" Padding="10, 10" Background="Silver" >
                            <TextBlock Name="label" Text="{Binding Name}" FontSize="30" Foreground="Black" VerticalAlignment="Center" HorizontalAlignment="Center">
                                <TextBlock.ContextMenu>
                                    <ContextMenu>
                                        <MenuItem Header="[TEST]" Name="Test" Click="Test_Click"/>
                                    </ContextMenu>
                                </TextBlock.ContextMenu>
                            </TextBlock>                              
                        </Border>
                    </DataTemplate>
      </ItemsControl.ItemTemplate>
                </ItemsControl>

Here is the collection:

    public MainWindow()
    {
        //ctor
        InitializeComponent();
        pathToLauncher = string.Empty;
        videos = new ObservableCollection<Video>();
        VideoUIElment.ItemsSource = videos;
    }

I know that, to do this, I have to identify which Video object inside the collection is bound to the specific UI element I click on, and I could come up with some trick to achieve this, but I would like to do it in a graceful and intelligent way. I've seen some suggestions already, but none of them seemed to have been applicable here. I guess, it is supposed to be something easy, but I'm not very versed in WPF yet.

like image 801
oneManArmin Avatar asked Feb 20 '26 01:02

oneManArmin


1 Answers

Try this:

MainWindow:

public partial class MainWindow : Window
{
    ObservableCollection<Video> videos { get; set; }

    public MainWindow()
    {
        InitializeComponent();

        videos = new ObservableCollection<Video>
        {
            new Video {Name = "Video 1"},
            new Video {Name = "Video 2"},
            new Video {Name = "Video 3"}
        };

        VideoUIElment.ItemsSource = videos;
    }

    private void Test_Click(object sender, RoutedEventArgs e)
    {
        MenuItem item = (MenuItem)sender;

        Video video = (Video)item.DataContext;

        MessageBox.Show(video.VideoMethod());
    }
}

Video:

public class Video
{
    public string Name { get; set; }

    public string VideoMethod()
    {
        return string.Format(" Clicked {0}", Name);
    }
}

enter image description here

like image 84
jsanalytics Avatar answered Feb 21 '26 17:02

jsanalytics



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!