How to create a footer template in a Grouped ListView in Xamarin Form - forms

Question

I'm working with Xamarin Form and C#. So, I have a listview in a Xamarin project which I enable the property IsGroupingEnabled. The items and header of items work perfectly but I cannot set a footer template.
I need to create a listview, items must be composed of:
Header: User information.
Items: List of subitems.
Footer: Actions buttons (shared, comments, etc).
This is part of my code:
Model:
public class Post
{
public long PostID { get; set; }
public string Name { get; set; }
public List<OptionDefault> OptionsDefault { get; set; }
}
public class OptionDefault
{
public long OptionTypeID { get; set; }
public string SubItemName { get; set; }
}
ViewModel
public class PostsViewModel
{
public InfiniteScrollCollection<Grouping<Post, OptionDefault>> Items { get; set; } = new InfiniteScrollCollection<Grouping<Post, OptionDefault>>();
public IPostsService repository;
public PostsViewModel(INavigation navigation)
{
repository = new PostsService();
Items = new InfiniteScrollCollection<Grouping<Post, OptionDefault>>
{
OnLoadMore = async () => await GetItems()
};
Items.LoadMoreAsync();
}
async Task<List<Grouping<Post, OptionDefault>>> GetItems()
{
IsWorking = true;
List<Grouping<Post, OptionDefault>> items = new List<Grouping<Post, OptionDefault>>();
try
{
// load the next page
var lists = await repository.GetList(Items.Count);
foreach (var item in lists)
{
for (int i = 0; i < item.OptionsDefault.Count; i++)
{
if ((i + 1) == item.OptionsDefault.Count)
item.OptionsDefault[i].LastItem = true;
}
var group = new Grouping<Post, OptionDefault>(item, item.OptionsDefault);
items.Add(group);
}
}
catch (Exception ex)
{
ErrorHelper.RegisterError(ex);
}
finally
{
IsWorking = false;
}
return items;
}
.xaml:
<ListView ItemsSource="{Binding Items}"
IsGroupingEnabled="True">
<ListView.GroupHeaderTemplate>
<DataTemplate>
<ViewCell>
<StackLayout Margin="5,15,5,0">
<Label Text="{Binding Key.User.UserName}" />
</StackLayout>
</ViewCell>
</DataTemplate>
</ListView.GroupHeaderTemplate>
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<StackLayout Margin="5,0,5,5">
<Label Text="{Binding SubItemName}" />
</StackLayout>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
I've tried using footertemplate, but it doesn't work:
<ListView.FooterTemplate>
<DataTemplate>
<StackLayout Margin="5,0,5,5">
<Label Text="This is my footer" />
</StackLayout>
</DataTemplate>
</ListView.FooterTemplate>

Answer 1

Whether it's <ListView.Footer> or <ListView.FooterTemplate>, the display position is the same, right at the bottom of the ListView.
Currently, ListView of xamarin form does not have this property to make each items have a footer.
Maybe you need to rethink the requirements and UI design of your app.

Answer 2

CollectionView is now available in Xamarin.Forms. It have both GroupHeaderTemplate and GroupFooterTemplate. You can use it to show the Group of data. The code to do so is identical with ListView

Answer 3

It is not <ListView.FooterTemplate> but <ListView.Footer>
<ListView.Footer>
<StackLayout Margin="5,0,5,5">
<Label Text="This is my footer" />
</StackLayout>
</ListView.Footer>
For more info, see:
https://learn.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/listview/customizing-list-appearance#headers-and-footers