# .NET MAUI TemplatedButton Content Configuration

The purpose of this help article is to show you the main configuration options of the control.

## Setting Content

Define the content inside the TemplatedButton by setting the `Content` property (`object`) or `ContentTemplate` (`DataTemplate`) property.

The `Content` is responsible for the actual content displayed in the button. It can be set to `string`, `View`, object, etc.

Here are the scenarios for the visualization of `Content` or `ContentTemplate` inside the `RadTemplatedButton`:

* If `ContentTemplate` is set, the `View` returned from the `ContentTemplate`.`CreateView()` is displayed inside the `RadTemplatedButton.ControlTemplate`, having `Content` as its `BindingContext`.

* If `ContentTemplate` is `DataTemplateSelector`, first the `DataTemplate` is selected and then a `View` is created from the chosen template using `Content` as its `BindingContext`.

* If `Content` is set to a `View` and `ContentTemplate` isn't set, the `View` is displayed inside the `RadTemplatedButton.ControlTemplate`.

* If `Content` is set to a `string` and `ContentTemplate` isn't set, a `Label` is displayed inside the `RadTemplatedButton.ControlTemplate`.

* If `Content` is set to an `object` and `ContentTemplate` isn't set, the `ToString()` of the `object` is used and converted to `Label` inside the `RadTemplatedButton.ControlTemplate`.

**Setting Content to String**

```XAML
<telerik:RadTemplatedButton x:Name="templatedButton"
                            Content="My TemplatedButton Content" />
```

![.NET MAUI TemplatedButton Getting Started](https://www.telerik.com/maui-ui/documentation/assets/711f41959a5d8970f0f9b9eba6fe55ae/templatedbutton-getting-started.png)

**Setting ContentTemplate**

```XAML
<Grid>
    <telerik:RadCollectionView ItemsSource="{Binding Contacts}">
        <telerik:RadCollectionView.ItemTemplate>
            <DataTemplate>
                <Grid ColumnDefinitions="*, Auto"
                      Padding="{OnPlatform Default='2, 0', WinUI='11, 0'}">
                    <Grid.Resources>
                        <telerik:BoolToValueConverter x:Key="BoolToGlyphConverter" TrueValue="&#xe805;" FalseValue="&#xe801;" />
                    </Grid.Resources>
                    <Label Text="{Binding Name}" VerticalTextAlignment="Center" />
                    <telerik:RadTemplatedButton Grid.Column="1"
                                                Content="{Binding IsFavorite}"
                                                Command="{Binding UpdateIsFavoriteCommand}"
                                                CommandParameter="{Binding}"
                                                VerticalOptions="Center">
                        <telerik:RadTemplatedButton.ContentTemplate>
                            <DataTemplate>
                                <Label FontFamily="TelerikFontExamples"
                                       FontSize="16"
                                       Text="{Binding Converter={StaticResource BoolToGlyphConverter}}"
                                       TextColor="{Binding Source={RelativeSource AncestorType={x:Type telerik:RadTemplatedButton}}, Path=TextColor}"
                                       HorizontalTextAlignment="{Binding Source={RelativeSource AncestorType={x:Type telerik:RadTemplatedButton}}, Path=HorizontalTextAlignment}"
                                       VerticalTextAlignment="{Binding Source={RelativeSource AncestorType={x:Type telerik:RadTemplatedButton}}, Path=VerticalTextAlignment}" />
                            </DataTemplate>
                        </telerik:RadTemplatedButton.ContentTemplate>
                    </telerik:RadTemplatedButton>
                </Grid>
            </DataTemplate>
        </telerik:RadCollectionView.ItemTemplate>
    </telerik:RadCollectionView>
</Grid>
```

![.NET MAUI TemplatedButton ContentTemplate](https://www.telerik.com/maui-ui/documentation/assets/8da10e320a43917973a2bd948f00782f/templatedbutton-contenttemplate.gif "TemplatedButton for .NET MAUI")

## Text Alignment

Use the following properties to align the text in the button when `Content` is `string` and `ContentTemplate` is not set.

* `HorizontalTextAlignment` (`Microsoft.Maui.TextAlignment`)—Specifies the horizontal alignment of the `Label.Text`.
* `VerticalTextAlignment` (`Microsoft.Maui.TextAlignment`)—Specifies the vertical alignment of the `Label.Text`.

## Text Decoration

Use the `TextDecorations` (enum of type `Microsoft.Maui.TextDecorations`) property to specify the text decorations of the `Label` created when `Content` is `string` and `ContentTemplate` is not set.

## Font Options

The following properties specify the font options that apply to the content when `Content` is `string` and `ContentTemplate` is not set.

* `FontFamily` (`string`)—Specifies the font family of the `Label.Text`.
* `FontSize` (`double`)—Specifies the font size in pixels of the `Label.Text`.
* `FontAttributes` (`Microsoft.Maui.Controls.FontAttributes`)—Specifies the font attributes of the `Label.Text`.

## See Also

* [Loading Button](https://www.telerik.com/maui-ui/documentation/controls/templatedbutton/loading-button)
* [Set Visual States](https://www.telerik.com/maui-ui/documentation/controls/templatedbutton/visual-states)
* [Events](https://www.telerik.com/maui-ui/documentation/controls/templatedbutton/events)
* [Execute Command](https://www.telerik.com/maui-ui/documentation/controls/templatedbutton/command)
* [Style the TemplatedButton](https://www.telerik.com/maui-ui/documentation/controls/templatedbutton/styling)
