If using a SfChipGroup.ItemTemplate DataTemplate, selection is only working if clicking the Border

[Andreas Reitberger]

Hi,

I'm tryingt to make a color selection with the SfChipGroup control.

However whenever I set a ItemTemplate, the selection of the item only works if I click on the Border.

Clicking the item itsefl does not lead to select the item eventually.

<buttons:SfChipGroup  

                                    SelectedItem="{Binding SelectedColorChip, Mode=TwoWay}"

                                    Type="Choice"

                                    ChoiceMode="SingleOrNone"

                                    ChipBorderWidth="1"

                                    ItemsSource="{Binding DefaultColors}"

                                    ChipBackgroundColor="{DynamicResource Gray-100}"

                                    SelectedChipBackgroundColor="{DynamicResource PrimaryColor}"

                                    >

                                    <buttons:SfChipGroup.ItemTemplate>

                                        <DataTemplate>

                                            <StackLayout>

                                                <buttons:SfChip 

                                                    Text="{Binding Name}" 

                                                    BackgroundColor="{Binding ChipColor}"

                                                    />

                                            </StackLayout>

                                        </DataTemplate>

                                    </buttons:SfChipGroup.ItemTemplate>

                                    

                                    <!---->

                                    <buttons:SfChipGroup.ChipLayout>

                                        <FlexLayout 

                    HorizontalOptions="Start" 

                    VerticalOptions="Center" 

                    Direction="Row" 

                    Wrap="Wrap"

                    JustifyContent="Start"

                    AlignContent="Start" 

                    AlignItems="Start"/>

                                    </buttons:SfChipGroup.ChipLayout>

                                </buttons:SfChipGroup>

Is there anything I'm doing wrong?

Whenever I remove the ItemTemplate the selection works fine for the items.

[Saravanan Madheswaran]

Hi Andreas, 

 

Greetings from Syncfusion support.   

  

We would like to let you know that we have enabled touch/mouse recognizer support for ChipGroup’s ItemTemplate elements. So, the touch was handled by template element instead of ChipGroup.   

  

Release notes: https://help.syncfusion.com/xamarin/release-notes/v18.4.0.30?type=all#sfchipgroup   

  

And we can achieve the recommended behavior by setting InputTransparent as true for template element.   

  

<buttons:SfChipGroup.ItemTemplate>  

    <DataTemplate>  

        <StackLayout Orientation="Horizontal" InputTransparent="True">  

            <buttons:SfChip WidthRequest="40"  

                            ShowSelectionIndicator="{Binding IsChecked}" >  

            </buttons:SfChip>  

        </StackLayout>  

    </DataTemplate>  

</buttons:SfChipGroup.ItemTemplate>  

  

  

  

  

Regards,  

Saravanan.  

[Andreas Reitberger]

Hi Saravanan,

thanks for the example. This is working fine for me know.

Thank you!

[Gayathri Manickam]

Hi Andreas, 

 

Thanks for the update. We are glad that the given solution has helped to achieve your requirement. Please let us know if you have any other queries.  

 

Thanks, 

Gayathri. M.