Command in GroupHeader Only Fires When There's One Group

Question

I have a collectionview that I am grouping. The Command on a tapgesturerecognizer in the group header works fine when I have one group. But the command doesn't fire on any group header including the first when there are multiple groups in the collectionview. The groups and their submembers are identical, and the binding works because the group name appears. I'm getting frustrated because I have tried seemingly every suggestion and I don't really know how to properly debug this.

Answer 1

So apparently my binding was correct, but my collectionview which I was dynamically setting the height of, was smaller than its contents, even though they rendered visually fine, and thus the tapgesturerecognizer was ignored. So setting the height request much larger than I need, due to CollectionView having all that stupid extra space at the bottom that is a multi year ongoing bug from Microsoft, makes the commands work on the group headers. Ridiculous

Answer 2

Hello,
Welcome to our Microsoft Q&A platform!
I 'm not clear about how you bind tapGestureRecognize commnd in your own project. I have a try with this demo and add tap gesture in multiple groups( VerticalListGroupingPage ).
Wish it works for you.

VerticalListGroupingPage

<CollectionView.GroupHeaderTemplate>  
                <DataTemplate>  
                    <Label Text="{Binding Name}"  
                           BackgroundColor="Red"  
                           FontSize="Large"  
                           FontAttributes="Bold" >  
                        <Label.GestureRecognizers>  
                            <TapGestureRecognizer  
                                Command="{Binding TapCommand}"  
                                CommandParameter="Image1" />  
                        </Label.GestureRecognizers>  
                        </Label>  
                </DataTemplate>  
 </CollectionView.GroupHeaderTemplate>  

Bind GroupedAnimalsViewModel

public partial class VerticalListGroupingPage : ContentPage  
    {  
        public VerticalListGroupingPage()  
        {  
            InitializeComponent();  
            BindingContext = new GroupedAnimalsViewModel();  
        }  
    }  

AnimalGroup

using System.Collections.Generic;  
using System.Diagnostics;  
using System.Windows.Input;  
using Xamarin.Forms;  
  
namespace CollectionViewDemos.Models  
{  
    public class AnimalGroup : List<Animal>  
    {  
        int taps = 0;  
        public string Name { get; private set; }  
        public ICommand TapCommand { get; set; }//test  
  
        public AnimalGroup(string name, List<Animal> animals) : base(animals)  
        {  
            Name = name;  
            TapCommand = new Command(OnTapped);  
        }  
  
        public override string ToString()  
        {  
            return Name;  
        }  
        void OnTapped(object s)  
        {  
            taps++;  
            Debug.WriteLine("parameter: " + taps);  
        }  
    }  
}  

For more informaton, you can refer to:
https://learn.microsoft.com/en-us/xamarin/xamarin-forms/app-fundamentals/gestures/tap
https://learn.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/collectionview/grouping

Best Regards,
Wenyan Zhang

---

If the response is helpful, please click "Accept Answer" and upvote it.
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

Answer 3

Here's the binding. Am I missing something obvious? When the collection size is 1, the group header commands work fine. When the collection is larger, they don't. The commands within the groups work regardless.

<views:NoScrollCollectionView HeightRequest="{Binding HeightRequest}" VerticalOptions="Start" SelectionMode="Single" SelectedItem="{Binding SelectedItem, Mode=TwoWay}" IsGrouped="True" ItemsSource="{Binding GroupedList}" x:Name="thisView">
                            <CollectionView.ItemTemplate>
                                <DataTemplate>
                                    <SwipeView>
                                        <SwipeView.RightItems>
                                            <SwipeItem Text="Delete"                                                   
                                                       BackgroundColor="Red" 
                                                       Command="{Binding BindingContext.DeleteItem, Source={x:Reference thisView}}"
                                                       CommandParameter="{Binding .}"/>
                                        </SwipeView.RightItems>
                                        <StackLayout>
                                            <StackLayout x:DataType="model:MItem" HorizontalOptions="FillAndExpand" Orientation="Horizontal" Padding="15,0,0,0">
                                            <Label FontFamily="Montserrat-Regular" VerticalTextAlignment="Center" HorizontalOptions="StartAndExpand" FontSize="Small" Text="{Binding itemCategory}"></Label>
                                            <Label FontFamily="Montserrat-Regular" VerticalTextAlignment="Center" HorizontalOptions="EndAndExpand" FontSize="Small" HorizontalTextAlignment="End" Text="{Binding state}" TextColor="{Binding stateColor}"></Label>
                                            </StackLayout>
                                            <BoxView Color="Black" HeightRequest="1"></BoxView>
                                        </StackLayout>
                                    </SwipeView>
                                </DataTemplate>
                            </CollectionView.ItemTemplate>
                            <CollectionView.GroupHeaderTemplate>
                                <DataTemplate>
                                    <SwipeView>
                                        <SwipeView.RightItems>
                                            <SwipeItem Text="Delete"                                                   
                                                       BackgroundColor="Red" 
                                                       Command="{Binding BindingContext.DeleteGroup, Source={x:Reference thisView}}"
                                                       CommandParameter="{Binding .}"/>
                                        </SwipeView.RightItems>
                                        <StackLayout x:DataType="model:MPageGroup">
                                            <StackLayout.GestureRecognizers>
                                                <TapGestureRecognizer NumberOfTapsRequired="1" 
                                                                  Command="{Binding BindingContext.GroupTapped, Source={x:Reference thisView}}" CommandParameter="{Binding .}"
                                                />
                                            </StackLayout.GestureRecognizers>
                                            <Label FontFamily="Montserrat-Bold" TextColor="Black" Text="{Binding name}"/>

                                        </StackLayout>
                                    </SwipeView>              
                                </DataTemplate>
                            </CollectionView.GroupHeaderTemplate>
                        </views:NoScrollCollectionView>