Getting element of listview loaded by control template - wpf

Question

<ListView x:Name="CustomWorkoutListView" ItemsSource="{Binding WorkoutTypeDTO}" ScrollViewer.HorizontalScrollBarVisibility="Disabled" ScrollViewer.VerticalScrollBarVisibility="Auto" Style="{DynamicResource ListViewStyle1}" Width="400" Height="119" SelectionChanged="CustomWorkoutSelectionChanged">
<ListView.ItemContainerStyle>
<Style TargetType="ListBoxItem">
<Setter Property="Margin" Value="0"/>
<Setter Property="Padding" Value="0"/>
<Setter Property="BorderThickness" Value="0"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ListBoxItem}">
<StackPanel>
<StackPanel Margin="0,0,10,8" Name="WorkoutTypeBackground" Visibility="{Binding IsEditable,Converter={StaticResource NegBooleanToVisibilityConverter}}">
<StackPanel.Background>
<ImageBrush ImageSource="/Assets/Images/workout_type_back_unselected.png"/>
</StackPanel.Background>
<TextBlock Name="TextBlockName" Text="{Binding WorkoutTypeName}" Style="{StaticResource WorkoutTypeNameText}"/>
</StackPanel>
<StackPanel Margin="0,0,10,8" Orientation="Horizontal" Visibility="{Binding IsEditable,Converter={StaticResource BooleanToVisibilityConverter}}">
<StackPanel.Background>
<ImageBrush ImageSource="/Assets/Images/workout_type_back_edit.png"/>
</StackPanel.Background>
<TextBlock Text="{Binding WorkoutTypeName}" Style="{StaticResource WorkoutTypeNameText}"/>
<Button BorderThickness="0" Template="{DynamicResource ButtonBaseControlTemplate1}" Name="CrossButton" Width="20" Height="20" Click="DeleteWorkoutType">
<Button.Background>
<ImageBrush ImageSource="/Assets/Images/workout_type_X.png"/>
</Button.Background>
</Button>
</StackPanel>
</StackPanel>
<ControlTemplate.Triggers>
<Trigger Property="IsSelected" Value="true">
<Setter TargetName="WorkoutTypeBackground" Property="Background">
<Setter.Value>
<ImageBrush ImageSource="/Assets/Images/workout_type_back_selected.png"/>
</Setter.Value>
</Setter>
<Setter TargetName="TextBlockName" Property="FontSize" Value="48"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ListView.ItemContainerStyle>
<ListView.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel Orientation="Horizontal"/>
</ItemsPanelTemplate>
</ListView.ItemsPanel>
</ListView>
In the above code, the listviewitems consists of Stackpanel which itself has a textblock and a button. Now when i click the button, how would i know which listviewitem is clicked so that i can do some manipulation?

Answer 1

If you want to handle this in codebehind, then you can use VisualTreeHelper to get to the parent of the Button clicked. You can use the method below to get to ti
public T GetParent<T>(DependencyObject child) where T : DependencyObject
{
var parent = VisualTreeHelper.GetParent(child);
if(parent != null)
{
if(parent is T)
{
return parent as T;
}
return GetParent<T>(parent);
}
else
{
return null;
}
}
and from Button Click hanlder, you can call
ListViewItem item = GetParent<ListViewItem>(sender);
and item.DataContext will give you the Data backing your item.
But i will suggest you to handle this MVVM way, by defining the Command in your ViewModel and send the current item as its CommandParameter
<Button Command="{Binding DataContext.MyCommand, RelativeSource={RelativeSource AncestorType={x:Type ListView}}}" CommandParameter="{Binding}" BorderThickness="0" Template="{DynamicResource ButtonBaseControlTemplate1}" Name="CrossButton" Width="20" Height="20" Click="DeleteWorkoutType">
This will give you the current item backing your ListViewItem in your command handler