Catch ExpandableListView group click event in Xamarin Forms - xamarin

Question

I wish to get selected item for the GroupHeaderTemplate in ExpandableListView. But How to catch ExpandableListView group click event in Xamarin Forms , I am finding Solutions for Xamarin Android but none for the Forms . Moreover List item selection only works for child , How to get clicked event for Group Items. Any Link or Reference would be helpful.
My updated Xaml
<ListView VerticalOptions="FillAndExpand"
x:Name="HotelsList" SeparatorColor="Black"
BackgroundColor="Transparent" ItemSelected="HotelsList_ItemSelected"
IsGroupingEnabled="True"
IsPullToRefreshEnabled="true"
ItemsSource="{Binding StaffLoansList}"
RefreshCommand="{Binding LoadHotelsCommand}" >
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<Grid VerticalOptions="StartAndExpand" Margin="10" >
<Grid.ColumnDefinitions>
<ColumnDefinition Width="30"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="100"/>
</Grid.ColumnDefinitions>
<Image Grid.Column="0" Aspect="AspectFit" HeightRequest="20" WidthRequest="30"
HorizontalOptions="StartAndExpand" Margin="5"
VerticalOptions="CenterAndExpand">
<Image.Source>
<FileImageSource File="{Binding ImageStatus}" />
</Image.Source>
</Image>
<Label Grid.Column="1" Text="{Binding actionName}" FontSize="15" HorizontalTextAlignment="Start"
HorizontalOptions="Start"
VerticalOptions="CenterAndExpand" />
<Label Grid.Column="2" Text="{Binding actionDate}" FontSize="15"
HorizontalOptions="EndAndExpand"
VerticalOptions="CenterAndExpand" />
</Grid>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
<ListView.GroupHeaderTemplate>
<DataTemplate>
<ViewCell>
<Grid>
<Label
FontSize="16"
Text="{Binding Name}"
TextColor="Gray"
VerticalOptions="Center">
</Label>
<Image x:Name="ImgA" Source="{Binding StateIcon}" Margin="0,0,5,0" HeightRequest="20" WidthRequest="20" HorizontalOptions="End">
<Image.GestureRecognizers>
<TapGestureRecognizer Command="{Binding Path=BindingContext.DummyCommand, Source={x:Reference HotelsList}}" NumberOfTapsRequired="1" CommandParameter="{Binding .}"/>
</Image.GestureRecognizers>
</Image>
<Grid.GestureRecognizers>
<TapGestureRecognizer Command="{Binding Path=BindingContext.ShowDetailCommand, Source={x:Reference HotelsList}}" CommandParameter="{Binding .}"/>
</Grid.GestureRecognizers>
</Grid>
</ViewCell>
</DataTemplate>
</ListView.GroupHeaderTemplate>
</ListView>
ViewModel
In Constructor:
ShowDetailCommand = new Command<StaffLoanPageViewModel>(Showdetail);
ViewModel Class
public ICommand ShowDetailCommand { get; set; }
public void Showdetail(object obj)
{
NavigationService.NavigateTo(ViewModelLocator.StaffLoanDetailPopupPage, Staffloans);
}

Answer 1

That's easy in your first child of ViewCell just add a GestureRecognizor
<ViewCell>
<Grid>
.
.
.
<Grid.GestureRecognizers>
<TapGestureRecognizer Command="{Binding Path=BindingContext.DoSomethingCommand, Source={x:Reference HotelsList}}"
CommandParameter="{Binding .}"/>
</Grid.GestureRecognizers>
</Grid>
</ViewCell>
Then in your command receive this tap event
DoSomethingCommand= new Command(DoSomething);
And your Commands receiver would look something like this:
private void DoSomething(object obj)
{
}
And in this obj object you will get your clicked item's details of the type which is bonded to the ListView, Note this will be a single object and not a collection
Update:
The command property would look something like this:
public ICommand DoSomethingCommand{ get; set; }