I'm trying to have a long press and short press command in a CollectionView. I'm using Xamarin.Community.ToolKit But target ViewModel Command is not being called. TouchEffect works when it's outside of CollectionView. But not when it's inside the CollectionView.
Below is the Collection View:
<CollectionView x:Name="ItemsCollectionView"
ItemsSource="{Binding FolderFiles}"
VerticalOptions="FillAndExpand"
SelectionMode="{Binding SelectionModeFolderFile}"
SelectedItems="{Binding SelectedFolderFiles}"
>
<CollectionView.ItemTemplate>
<DataTemplate>
<Grid xct:TouchEffect.Command="{Binding ShortPressCommandSelection}"
xct:TouchEffect.LongPressCommand="{Binding LongPressCommandSelection}"
xct:TouchEffect.NativeAnimation="True"
>
<Grid.RowDefinitions>
<RowDefinition Height="45"></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="10*"></ColumnDefinition>
<ColumnDefinition Width="60*"></ColumnDefinition>
<ColumnDefinition Width="10*"></ColumnDefinition>
<ColumnDefinition Width="10*"></ColumnDefinition>
<ColumnDefinition Width="10*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Image Grid.Row="0" Grid.Column="0" x:Name="imgFileOrFolder" Source="{Binding ImgFileOrFolderSource}" VerticalOptions="Center" WidthRequest="15" >
</Image>
<Label Grid.Row="0" VerticalTextAlignment="Center" Grid.Column="1" Text="{Binding Name}"
LineBreakMode="NoWrap"
Style="{DynamicResource ListItemTextStyle}"
FontSize="12" />
<Image Grid.Row="0" Grid.Column="2" x:Name="imgPlay" Source="{Binding ImgPlaySource}" VerticalOptions="Center" WidthRequest="25">
<Image.GestureRecognizers>
<TapGestureRecognizer CommandParameter="{Binding Path}"
Tapped="PlayTapped" />
</Image.GestureRecognizers>
</Image>
<Image Grid.Row="0" Grid.Column="3" x:Name="imgShuffle" Source="{Binding ImgShuffleSource}" VerticalOptions="Center" WidthRequest="25">
<Image.GestureRecognizers>
<TapGestureRecognizer CommandParameter="{Binding Path}"
Tapped="ShuffleTapped" />
</Image.GestureRecognizers>
</Image>
<Image Grid.Row="0" Grid.Column="4" x:Name="imgMoreInfo" Source="{Binding ImgMoreInfoSource}" VerticalOptions="Center" WidthRequest="15">
<Image.GestureRecognizers>
<TapGestureRecognizer
Tapped="MoreInfoTapped" />
</Image.GestureRecognizers>
</Image>
</Grid>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
Target View Model Properties:
public ICommand LongPressCommandSelection { get; set; }
public ICommand ShortPressCommandSelection { get; set; }
Constructor:
LongPressCommandSelection = new Command(LongPressCommand_SelectionChanged);
ShortPressCommandSelection = new Command(ShortPressCommand_SelectionChanged);
Methods:
public void LongPressCommand_SelectionChanged()
{
Console.Write("selection changed");
}
public void ShortPressCommand_SelectionChanged()
{
Console.Write("selection changed");
}
The problem is not with TouchEffect the problem is with your Binding, because inside a DataTemplate
the BindingContext
if not specified get overridden (changed) to the value of ItemsSource
instead of the inherited BindingContext
.
You are binding with a wrong BindingContext
(source), during debugging if you open and look at your "xaml binding failures" window/pane you will see explicit clear errors saying something like LongPressCommandSelection
could not be found in FolderFiles
, you should specify your binding source in this case:
<ContentPage x:Name="thisPage" ...>
...
<Grid xct:TouchEffect.LongPressCommand="{Binding Source={x:Reference thisPage}, Path=BindingContext.LongPressCommandSelection}"