Skip to content

Commit c7509f1

Browse files
author
KB Bot
committed
Added new kb article collectionview-emptycontenttemplate-events-net-maui
1 parent 2db8417 commit c7509f1

File tree

1 file changed

+76
-0
lines changed

1 file changed

+76
-0
lines changed
Lines changed: 76 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,76 @@
1+
---
2+
title: Enabling Events in EmptyContentTemplate for CollectionView in .NET MAUI
3+
description: Learn how to enable GestureRecognizer and Button Click events in the EmptyContentTemplate of the CollectionView for .NET MAUI when they are not executing.
4+
type: how-to
5+
page_title: Resolving Event Execution Issues in EmptyContentTemplate of CollectionView in .NET MAUI
6+
slug: collectionview-emptycontenttemplate-events-net-maui
7+
tags: collectionview, .net maui, emptycontenttemplate, gesturerecognizer, button-click, inputtransparent
8+
res_type: kb
9+
---
10+
11+
## Environment
12+
13+
| Version | Product | Author |
14+
| --- | --- | ---- |
15+
| 11.0.0 | Telerik UI for .NET MAUI CollectionView | [Dobrinka Yordanova](https://www.telerik.com/blogs/author/dobrinka-yordanova) |
16+
17+
## Description
18+
19+
I am using the `EmptyContentTemplate` in the [CollectionView for .NET MAUI](https://docs.telerik.com/devtools/maui/controls/collectionview/overview) to display custom content when the ItemsSource is empty or null. Inside the template, `GestureRecognizer` and Button `Click` events are defined, but they do not execute as expected. This behavior occurs because the control's default implementation sets the template's transparency to true, which makes it ignore input events.
20+
21+
This knowledge base article also answers the following questions:
22+
- How to make `GestureRecognizer` events work in EmptyContentTemplate?
23+
- Why are Button `Click` events not firing in CollectionView `EmptyContentTemplate`?
24+
- How to disable transparency for `EmptyContentTemplate` in .NET MAUI CollectionView?
25+
26+
## Solution
27+
28+
To enable `GestureRecognizer` or Button `Click` events in the `EmptyContentTemplate`, you need to disable the transparency of the template. Use the following approach:
29+
30+
**1.** Set the `EmptyContentDisplayMode` property to `ItemsSourceNullOrEmpty`.
31+
32+
```xaml
33+
<telerik:RadCollectionView x:Name="collection"
34+
EmptyContentDisplayMode="ItemsSourceNullOrEmpty">
35+
<telerik:RadCollectionView.EmptyContentTemplate>
36+
<DataTemplate>
37+
<Grid RowDefinitions="Auto,Auto" Padding="0,40,0,0">
38+
<Grid.GestureRecognizers>
39+
<TapGestureRecognizer NumberOfTapsRequired="1" Tapped="OnEmptyContentTapped"/>
40+
</Grid.GestureRecognizers>
41+
<Label Grid.Row="0" Text="Nothing Found to Display"
42+
HorizontalTextAlignment="Center"
43+
TextColor="Black"/>
44+
<Button Grid.Row="1" Text="Add New"
45+
Margin="0,10,0,0"
46+
HorizontalOptions="Center"
47+
Clicked="OnAddNewButtonClicked"/>
48+
</Grid>
49+
</DataTemplate>
50+
</telerik:RadCollectionView.EmptyContentTemplate>
51+
</telerik:RadCollectionView>
52+
```
53+
**2.** Access the last child of the CollectionView and set its `InputTransparent` property to `false`.
54+
55+
```csharp
56+
var emptyContent = (View)this.collection.Last();
57+
emptyContent.InputTransparent = false;
58+
59+
private async void OnAddNewButtonClicked(object sender, EventArgs e)
60+
{
61+
await DisplayAlert("Clicked", "Add New Clicked", "OK");
62+
}
63+
64+
private async void OnEmptyContentTapped(object sender, TappedEventArgs e)
65+
{
66+
await DisplayAlert("Tapped", "Empty Content Tapped", "OK");
67+
}
68+
```
69+
70+
Setting `InputTransparent` to `false` ensures that the `EmptyContentTemplate` can respond to input events like `GestureRecognizer` taps and Button clicks.
71+
72+
## See Also
73+
74+
- [CollectionView Overview for .NET MAUI](https://docs.telerik.com/devtools/maui/controls/collectionview/overview)
75+
- [EmptyContentTemplate in CollectionView for .NET MAUI](https://docs.telerik.com/devtools/maui/controls/collectionview/empty-template)
76+
- [GestureRecognizer in .NET MAUI](https://learn.microsoft.com/en-us/dotnet/maui/fundamentals/gestures/tap?view=net-maui-9.0)

0 commit comments

Comments
 (0)