[Feature] Auto compiled binding on CollectionView's ItemTemplate, GroupHeaderTemplate and GroupFooterTemplate

[yairp03]

Description

This feature determines automatically the DataType of a DataTemplate inside <CollectionView.ItemTemplate>, <CollectionView.GroupHeaderTemplate> and/or <CollectionView.GroupFooterTemplate>, without need of specifying x:DataType manually.
Also, it allows using an x:DataType on a page when there is Group Header/Footer Template that using group attributes.

Normal CollectionView

For example, I have this Monkey model:

public class Monkey
{
    public string Species { get; set; }
}

Inside the ViewModel, I have this list of monkeys:

public partial class MonkeysViewModel
{
    public List<Monkey> MonkeysList { get; } = new();
}

And in the page, I have a CollectionView with a binding to the MonkeysList:

<ContentPage x:DataType="viewmodel:MonkeysViewModel">
    <CollectionView ItemsSource="{Binding MonkeysList}">
    </CollectionView>
</ContentPage>

Currently, in order to use the ItemTemplate without getting any binding error, I need to specify the type of the item using x:DataType on the DataTemplate tag, like this:

<ContentPage x:DataType="viewmodel:MonkeysViewModel">
    <CollectionView ItemsSource="{Binding MonkeysList}">
        <CollectionView.ItemTemplate>
            <DataTemplate x:DataType="model:Monkey"> <!--Required in order to use the Species member-->
                <Label Text="{Binding Species}" />
            </DataTemplate>
        </CollectionView.ItemTemplate>
    </CollectionView>
</ContentPage>

Feature benefits

This feature will make the code cleaner, will enable doing the same thing without specifying the x:DataType, and will automatically determine that because the CollectionView's ItemSource is a Collection of Monkey's, then each item is a Monkey.

Grouped CollectionView

In a grouped CollectionView, the ItemSource needs to be an IEnumerable of IEnumerables.
For example:

public partial class MonkeysViewModel
{
    public List<List<Monkey>> MonkeysGroups { get; } = new();
}

<CollectionView IsGrouped="True" ItemsSource="{Binding MonkeysGroups}">
</CollectionView>

If we want to use <CollectionView.GroupHeaderTemplate> or <CollectionView.GroupFooterTemplate>, we can't use compiled binding on the page, because then it will require us to specify the x:DataType for the DataTemplate, which we can't do. For example:

<ContentPage x:DataType="viewmodel:MonkeysViewModel"> <!--Specifying x:DataType for page-->
    <CollectionView IsGrouped="True" ItemsSource="{Binding MonkeysList}">
        <CollectionView.GroupHeaderTemplate>
            <DataTemplate> <!--Can't use x:DataType, there's no syntax for List<Monkey> type-->
                <Label Text="{Binding Count}" /> <!--Will raise a 'member not found' error-->
            </DataTemplate>
        </CollectionView.GroupHeaderTemplate>
        <CollectionView.ItemTemplate>
            <DataTemplate x:DataType="model:Monkey">
                <Label Text="{Binding Species}" />
            </DataTemplate>
        </CollectionView.ItemTemplate>
    </CollectionView>
</ContentPage>

Feature benefits

Besides the code being cleaner, this feature will allow using compiled binding on a page that has a grouped CollectionView in it, that uses the group's header and/or footer templates.

Final code with the feature

<ContentPage x:DataType="viewmodel:MonkeysViewModel">
    <CollectionView IsGrouped="True" ItemsSource="{Binding MonkeysList}">
        <CollectionView.GroupHeaderTemplate>
            <DataTemplate> <!--No need for x:DataType, automatically determines the type is 'List<Monkey>'-->
                <Label Text="{Binding Count}" /> <!--Working, because 'List<Monkey>' has a 'Count' member-->
            </DataTemplate>
        </CollectionView.GroupHeaderTemplate>
        <CollectionView.ItemTemplate>
            <DataTemplate> <!--No need for x:DataType, automatically determines the type is 'Monkey'-->
                <Label Text="{Binding Species}" /> <!--Working, because 'Monkey' has a 'Species' member-->
            </DataTemplate>
        </CollectionView.ItemTemplate>
    </CollectionView>
</ContentPage>

Public API Changes

Code

The example will use this code:

public class Monkey
{
    public string Species { get; set; }
}

public partial class MonkeysViewModel
{
    public List<Monkey> MonkeysList { get; } = new();
    public List<List<Monkey>> MonkeysGroups { get; } = new();
}

Normal CollectionView

For a non-grouped CollectionView, the xaml code, instead of this:

<ContentPage x:DataType="viewmodel:MonkeysViewModel">
    <CollectionView ItemsSource="{Binding MonkeysList}">
        <CollectionView.ItemTemplate>
            <DataTemplate x:DataType="model:Monkey"> <!--Required in order to use the Species member-->
                <Label Text="{Binding Species}" />
            </DataTemplate>
        </CollectionView.ItemTemplate>
    </CollectionView>
</ContentPage>

Will look like this:

<ContentPage x:DataType="viewmodel:MonkeysViewModel">
    <CollectionView ItemsSource="{Binding MonkeysList}">
        <CollectionView.ItemTemplate>
            <DataTemplate> <!--No need for x:DataType-->
                <Label Text="{Binding Species}" /> <!--Working and has intellisense-->
            </DataTemplate>
        </CollectionView.ItemTemplate>
    </CollectionView>
</ContentPage>

Grouped CollectionView

For a grouped CollectionView, the xaml code, instead of this:

<ContentPage> <!--Can't use x:DataType, because using groups members-->
    <CollectionView IsGrouped="True" ItemsSource="{Binding MonkeysList}">
        <CollectionView.GroupHeaderTemplate>
            <DataTemplate> <!--Can't use x:DataType, there's no syntax for List<Monkey> type-->
                <Label Text="{Binding Count}" /> <!--'No DataContext found' and no intellisense-->
            </DataTemplate>
        </CollectionView.GroupHeaderTemplate>
        <CollectionView.ItemTemplate>
            <DataTemplate x:DataType="model:Monkey">
                <Label Text="{Binding Species}" />
            </DataTemplate>
        </CollectionView.ItemTemplate>
    </CollectionView>
</ContentPage>

Will look like this:

<ContentPage x:DataType="viewmodel:MonkeysViewModel"> <!--Specifying x:DataType-->
    <CollectionView IsGrouped="True" ItemsSource="{Binding MonkeysList}">
        <CollectionView.GroupHeaderTemplate>
            <DataTemplate> <!--No need for x:DataType-->
                <Label Text="{Binding Count}" /> <!--Working and has intellisense-->
            </DataTemplate>
        </CollectionView.GroupHeaderTemplate>
        <CollectionView.ItemTemplate>
            <DataTemplate> <!--No need for x:DataType-->
                <Label Text="{Binding Species}" /> <!--Working and has intellisense-->
            </DataTemplate>
        </CollectionView.ItemTemplate>
    </CollectionView>
</ContentPage>

Intended Use-Case

The feature will be used on any page that has a CollectionView in it and will make the code cleaner.
Also, it will enable to use compiled bindings on the page, even if it has a grouped CollectionView that uses group members inside the group header and/or footer templates.

[yairp03]

I suggest adding area/collectionView tag

We've added this issue to our backlog, and we will work to address it as time and resources allow. If you have any additional information or questions about this issue, please leave a comment. For additional info about issue management, please read our Triage Process.

[ArmandoJR008]

If we want to use <CollectionView.GroupHeaderTemplate> or <CollectionView.GroupFooterTemplate>, we can't use compiled binding on the page, because then it will require us to specify the x:DataType for the DataTemplate, which we can't do.

I think this should be in the official Documentation as a warning.

Maybe someone else would've realized sooner than me but I spent a long time today thinking I was doing something wrong because of this. I resorted to not using <CollectionView.GroupHeaderTemplate> and made a nested CollectionView inside the <CollectionView.ItemTemplate> so I could properly classify my data in groups and still use compiled bindings. But this is redundant and likely not efficient.

[LeoJHarris]

@PureWeen with the advent of using something like this:

<MauiEnableXamlCBindingWithSourceCompilation>true</MauiEnableXamlCBindingWithSourceCompilation>
<WarningsAsErrors>$(WarningsAsErrors);XC0022;XC0023</WarningsAsErrors>

Its impossible to get around the issue without removing the error code XC0023 which is unfortunate for those wanting to catch these warning types early.

[LeoJHarris]

In the event this helps somewhere else as I was having issue getting the Key value showing on the Label and to get the right Binding for the GroupHeaderTemplate the following resolved it.

Include x:DataType on the page itself, setting x:DataType="{x:Null}" on the GroupHeaderTemplate and include in csproj.

<MauiEnableXamlCBindingWithSourceCompilation>true</MauiEnableXamlCBindingWithSourceCompilation>
<WarningsAsErrors>$(WarningsAsErrors);XC0022</WarningsAsErrors>

<CollectionView
    x:Name="collectionView">
<CollectionView.GroupHeaderTemplate>
    <DataTemplate x:DataType="{x:Null}">
        <Label
            BindingContext="{Binding BindingContext, Source={x:Reference collectionView}, x:DataType=CollectionView}"
            Text="{Binding Key}" />
    </DataTemplate>
</CollectionView.GroupHeaderTemplate>

[simonrozsival]

Linking this to #34696 — we should try to address these pain points in .NET 11.

The grouped CollectionView case (see @LeoJHarris's x:DataType="{x:Null}" workaround above) is a particularly compelling scenario — GroupHeaderTemplate/GroupFooterTemplate can't even declare a meaningful x:DataType today without hacks.

Thinking about this some more, I see the following risks that we should think through:

• New warnings on previously warning-free code. Bindings inside DataTemplates without x:DataType currently use reflection and produce no warnings. With inference, they become compiled — and if the path is wrong, MAUIG2045 will fire. This surfaces pre-existing bugs, but could break builds using TreatWarningsAsErrors.
• Explicit vs inferred x:DataType mismatch. If a developer writes <DataTemplate x:DataType="Animal"> but the collection is ObservableCollection<Dog>, explicit should always win — but should we emit an info diagnostic about the mismatch?
• Non-generic collections. IEnumerable, IList, object — inference isn't possible. These must fall back silently to current behavior.
• Different templates, different data contexts. ItemTemplate, GroupHeaderTemplate, GroupFooterTemplate, HeaderTemplate, and FooterTemplate all have different data contexts. Inference must map the right type to the right template — ItemTemplate gets T, GroupHeaderTemplate gets TGroup, and HeaderTemplate/FooterTemplate get no inference (their context is the page BindingContext).