ItemClicked event is not supported as an EventTriggerBehavior within ListItemTemplate

I’ve been working on writing some code samples for our Universal Windows Platform, they really are pretty neat how they enable a single app to run across Windows desktop, phone, Xbox One, and even HoloLens eventually. We’ll have the code sample released in the near future, but for now I wanted to blog about some small issues I’ve run into, couldn’t find any relevant documentation or stackoverflow answers, and I ended up figuring out the solutions on my own.
In this case, we were creating a listview and each item we wanted to be clickable to navigate to a detail page regarding that item. The listview control does have a selected item functionality built in, but we didn’t want to use that. A simple command to execute when one of the items is clicked is exactly what we wanted.
<DataTemplate x:Key="ListItemTemplate"> <interactivity:Interaction.Behaviors>
  <core:EventTriggerBehavior EventName="ItemClick">
    <core:InvokeCommandAction
      Command="{Binding DataContext.FooCommand, ElementName=LayoutRoot}"
      CommandParameter="{Binding}" />
    </core:EventTriggerBehavior>
  </interactivity:Interaction.Behaviors>
</DataTemplate>

<ListView ItemsSource="{Binding TheItems}"
  IsItemClickEnabled="True" SelectionMode="None"
  ItemTemplate="{StaticResource ListItemTemplate}" />
 Seems like this will get the job done, but compiler kept throwing us this very helpful error.
Cannot add instance of type 'Microsoft.Xaml.Interactions.Core.EventTriggerBehavior' to a collection of type 'Microsoft.Xaml.Interactivity.BehaviorCollection'. [Line: 27 Position: 95]
Cannot add instance of type 'Microsoft.Xaml.Interactions.Core.InvokeCommandAction' to a collection of type 'Microsoft.Xaml.Interactivity.BehaviorCollection'. [Line: 29 Position: 99]
Cannot add instance of type 'Microsoft.Xaml.Interactions.Core.EventTriggerBehavior' to a collection of type 'Microsoft.Xaml.Interactivity.BehaviorCollection'. [Line: 28 Position: 95]

Well, after a bit of digging I found out that a data template does not support an event trigger behavior for the event name as ItemClick. The ItemClick event is actually specific to the ListView xaml control, which is why the compiler complains that it cannot be added to the BehaviorCollection, so in our event trigger behavior we had to use a different event entirely. The Tapped event is the event we want, it is a high level event to cover both touch and mouse interactions.

<DataTemplate x:Key="ListItemTemplate">
   <interactivity:Interaction.Behaviors>
      <core:EventTriggerBehavior EventName="Tapped">
         <core:InvokeCommandAction
            Command="{Binding DataContext.FooCommand, ElementName=LayoutRoot}"
            CommandParameter="{Binding}" />
      </core:EventTriggerBehavior>
   </interactivity:Interaction.Behaviors>
</DataTemplate>

<ListView ItemsSource="{Binding TheItems}
  IsItemClickEnabled="True" SelectionMode="None"
  ItemTemplate="{StaticResource ListItemTemplate}" />
 There we go. Now, when a user clicks, or touches, one of the items shown in the ListView, the proper trigger is fired.  Hope this helps!

1 Comments

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.