Xamarin.Forms将GestureRecognizer添加到ListView中的图像

Question

我正在尝试向ListView中的图像添加轻击手势

下面的图像可以在没有 Image.GestureRecognizers的部分的ListView中正确呈现，但是ListView完全不呈现任何内容(无错误消息)。 为了澄清这一点，在ListView中也有一个Label，它也不呈现。

<Image x:Name="newsImage" VerticalOptions="End" HeightRequest="200" WidthRequest="200" Aspect="AspectFill" Source="{Binding Imageurllarge}">
                        <Image.GestureRecognizers>
                            <TapGestureRecognizer 
                                Tapped="OnTapGestureRecognizerTapped" 
                                NumberOfTapsRequired="1" />
                        </Image.GestureRecognizers>
                    </Image>

我从 http://developer.xamarin.com/guides/cross-platform/xamarin-forms/working-with/gestures/中获取了此信息(假定此示例不是用于listview图像，但假定它应在listview中工作)。

也(根据评论建议)

<Image.GestureRecognizers>
    <TapGestureRecognizer 
      Command="{Binding TapCommand}" 
      CommandParameter="newsImage" />

似乎还不算更好。

如果有人在后面的代码中有一个如何添加它的示例(没有viewmodel是可以的)，那么就可以了。

Answer 1

您可以在ListView中使用DataTemplate，并且DataTemplate内有一个Grid，然后添加UI元素。在给定的示例中，我正在显示姓名，联系电话和图像，并且在图像上使用了GestureRecognizers。试试这个:

<ListView x:Name="myListView" ItemsSource="{Binding Contacts}" >             
<ListView.ItemTemplate>
      <DataTemplate>
        <ViewCell Height="75">
        <Grid Padding="5">
            <Grid.RowDefinitions>
                <RowDefinition Height="20"></RowDefinition>
                <RowDefinition Height="20"></RowDefinition>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="30" />
                <ColumnDefinition Width="*"></ColumnDefinition>
                <ColumnDefinition Width="80"></ColumnDefinition>
            </Grid.ColumnDefinitions>
            <Image Source="user_img.png" Grid.Column="0" Grid.RowSpan="2" VerticalOptions="CenterAndExpand"/>
            <Label Grid.Row="0" Grid.Column="1" Font="16" Text="{Binding DisplayName}" LineBreakMode="TailTruncation"></Label>
            <Label Grid.Row="1" Grid.Column="1" Font="12" Text="{Binding Number}"  LineBreakMode="TailTruncation"></Label>

            <Image Grid.Row="0" Grid.RowSpan="3"  Grid.Column="2" Source="add.png" Aspect="AspectFill">
            <Image.GestureRecognizers>
                <TapGestureRecognizer 
                    Command="{Binding AddCommand}" 
                    CommandParameter="{Binding Number}" />
                  </Image.GestureRecognizers>
            </Image>        
        </Grid>
        </ViewCell>
     </DataTemplate>
   </ListView.ItemTemplate>    
</ListView>