CODEWITHSUNDEEP
wpfmvvmmvvm-light
amplifier
amplifier

Reputation: 1833

Event trigger for entire listview item

I have

<ListView ScrollViewer.VerticalScrollBarVisibility="Auto" Grid.Row="1" Grid.Column="0" Margin="2" Name="CoursesListView" ItemsSource="{Binding CourseTags}">
            <ListView.ItemContainerStyle>
                <Style TargetType="{x:Type ListViewItem}">
                    <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
                </Style>
            </ListView.ItemContainerStyle>
            <ListView.ItemTemplate>
                <DataTemplate>
                    <Border Margin="2" BorderThickness="1" BorderBrush="Red" Background="AntiqueWhite" CornerRadius="2" Cursor="Hand">
                        <WrapPanel ToolTip="{Binding Description}" HorizontalAlignment="Stretch">
                            <TextBlock Text="{Binding Name}" FontWeight="Bold" />
                            <TextBlock Text=" (" />
                            <TextBlock Text="{Binding NumberOfCourses}" TextDecorations="Underline" Foreground="Blue"  />
                            <TextBlock Text=")" />
                            <i:Interaction.Triggers>
                                <i:EventTrigger EventName="MouseLeftButtonUp">
                                    <GalaSoft_MvvmLight_Command:EventToCommand Command="{Binding DataContext.ProductTagSelectedCommand, ElementName=LayoutRoot}"
                                        CommandParameter="{Binding Name}" />
                                </i:EventTrigger>
                            </i:Interaction.Triggers>
                    </WrapPanel>
                    </Border>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>

The items are stretched well and have the same width regardless how much text they have. Hand cursor displays correctly as well (wherever I point) The problem is that EventTrigger fires command only when I click on the text blocks. How to make it work throughout all the item?

Upvotes: 0

Views: 3547

Answers (1)

dymanoid
dymanoid

Reputation: 15227

It's very simple. Just place your EventTrigger inside the Border, not the WrapPanel:

<Border Margin="2" BorderThickness="1" BorderBrush="Red" Background="AntiqueWhite" CornerRadius="2" Cursor="Hand">
  <i:Interaction.Triggers>
    <i:EventTrigger EventName="MouseLeftButtonUp">
      <GalaSoft_MvvmLight_Command:EventToCommand Command="{Binding DataContext.ProductTagSelectedCommand, ElementName=LayoutRoot}" CommandParameter="{Binding Name}" />
    </i:EventTrigger>
  </i:Interaction.Triggers>
  <WrapPanel ToolTip="{Binding Description}" HorizontalAlignment="Stretch">
    <TextBlock Text="{Binding Name}" FontWeight="Bold" />
    <TextBlock Text=" (" />
    <TextBlock Text="{Binding NumberOfCourses}" TextDecorations="Underline" Foreground="Blue"  />
    <TextBlock Text=")" />
  </WrapPanel>
</Border>

Upvotes: 1

Related Questions