.NET MAUI FAQ - Templates

Using templates in .NET MAUI provides several benefits, including code reusability, maintainability, and the ability to create a consistent and modular UI design across your app.

.NET MAUI provides built-in templates for common controls like ListView, CollectionView, and CarouselView. You can also find community-contributed templates on platforms like GitHub.

Control templates enable users to define the visual structure of the ContentView-derived custom controls and ContentPage-derived pages. They separate the user interface (UI) for a custom control or page, from the logic that implements it .

First, create a model class for assigning values in the data template. Then, create Collection with ItemSource and finally add the data template to visualize the content.

XAML

<CollectionView>
        <CollectionView.ItemsSource>
            <x:Array Type="{x:Type local:Person}">
                <local:Person Name="Steve" Age="21" Location="USA" />
                <local:Person Name="John" Age="37" Location="USA" />
                <local:Person Name="Tom" Age="42" Location="UK" />
                <local:Person Name="Lucas" Age="29" Location="Germany" />
                <local:Person Name="Tariq" Age="39" Location="UK" />
                <local:Person Name="Jane" Age="30" Location="USA" />
            </x:Array>
        </CollectionView.ItemsSource>
        <CollectionView.ItemTemplate>
            <DataTemplate>
                <Grid>
                    <Label Text="{Binding Name}" FontAttributes="Bold" />
                    <Label Grid.Column="1" Text="{Binding Age}" />
                    <Label Grid.Column="2" Text="{Binding Location}" />
                </Grid>
            </DataTemplate>
        </CollectionView.ItemTemplate>
    </CollectionView>

An inline data template is one that is defined inline in a control and should be used if there is no need to reuse the data template elsewhere. The objects specified in the data template define each item’s appearance.

A data template defined at the control level can only be applied to the control. A data template defined at the page level can be applied to multiple controls on the page. A data template defined at the app level can be applied to valid controls throughout the app.

Yes, you can use data templates with CollectionView and CarouselView to display data in various ways.

First, create a Model class for assigning values in the data template, create Collection with ItemSource, and add the data template to visualize the content.
XAML

<CollectionView>
        <CollectionView.ItemsSource>
            <x:Array Type="{x:Type local:Person}">
                <local:Person Name="Steve" Age="21" Location="USA" />
                <local:Person Name="John" Age="37" Location="USA" />
                <local:Person Name="Tom" Age="42" Location="UK" />
                <local:Person Name="Lucas" Age="29" Location="Germany" />
                <local:Person Name="Tariq" Age="39" Location="UK" />
                <local:Person Name="Jane" Age="30" Location="USA" />
            </x:Array>
        </CollectionView.ItemsSource>
        <CollectionView.ItemTemplate>
            <DataTemplate>
                <Grid>
                    <Label Text="{Binding Name}" FontAttributes="Bold" />
                    <Label Grid.Column="1" Text="{Binding Age}" />
                    <Label Grid.Column="2" Text="{Binding Location}" />
                </Grid>
            </DataTemplate>
        </CollectionView.ItemTemplate>
    </CollectionView>

How do I create a simple data template for a ListView in .NET MAUI?
You can create a simple data template for a ListView like this:
XAML

<ListView>
        <ListView.ItemTemplate>
            <DataTemplate>
                <TextCell Text="{Binding ItemName}" 
                          Detail="{Binding Description}" />
            </DataTemplate>
        </ListView.ItemTemplate>
</ListView>

A data template specifies the appearance of data and typically uses data binding to display data. A typical usage scenario for data templates is when displaying data from a collection of objects in controls, such as a CollectionView or Carousalview.

Templates in .NET MAUI refer to predefined project structures and code scaffolding that help developers start with common app types or scenarios.