Skip to main content
Displays Content according to an IDataTemplate. This is the base class for many controls that display a single piece of content.

Namespace

Avalonia.Controls

Inheritance

ControlTemplatedControlContentControl

Properties

Content
object?
Gets or sets the content to display. Can be any object - strings, controls, or custom data objects.
ContentTemplate
IDataTemplate?
Gets or sets the data template used to display the content of the control.
HorizontalContentAlignment
HorizontalAlignment
Gets or sets the horizontal alignment of the content within the control. Default is HorizontalAlignment.Stretch.
VerticalContentAlignment
VerticalAlignment
Gets or sets the vertical alignment of the content within the control. Default is VerticalAlignment.Stretch.
Presenter
ContentPresenter?
Gets the presenter from the control’s template. Read-only.

Template Parts

PART_ContentPresenter
ContentPresenter
The content presenter that displays the content.

Usage

XAML Example - String Content

<ContentControl Content="Hello, World!"
                HorizontalContentAlignment="Center"
                VerticalContentAlignment="Center" />

XAML Example - Control Content

<ContentControl>
  <Border Background="LightBlue" 
          Padding="10">
    <TextBlock Text="Wrapped Content" />
  </Border>
</ContentControl>

XAML Example - Data Template

<ContentControl Content="{Binding User}">
  <ContentControl.ContentTemplate>
    <DataTemplate>
      <StackPanel>
        <TextBlock Text="{Binding Name}" FontWeight="Bold" />
        <TextBlock Text="{Binding Email}" />
      </StackPanel>
    </DataTemplate>
  </ContentControl.ContentTemplate>
</ContentControl>

C# Example

// String content
var control = new ContentControl
{
    Content = "Simple text"
};

// Control as content
var control = new ContentControl
{
    Content = new TextBlock { Text = "Hello" },
    HorizontalContentAlignment = HorizontalAlignment.Center
};

// Data object with template
var control = new ContentControl
{
    Content = new User { Name = "John", Email = "[email protected]" },
    ContentTemplate = new FuncDataTemplate<User>((user, scope) =>
        new StackPanel
        {
            Children =
            {
                new TextBlock { Text = user.Name },
                new TextBlock { Text = user.Email }
            }
        })
};

Custom Content Template

public class PersonViewModel
{
    public string Name { get; set; }
    public string Title { get; set; }
}

// In XAML
<ContentControl Content="{Binding SelectedPerson}">
  <ContentControl.ContentTemplate>
    <DataTemplate DataType="vm:PersonViewModel">
      <Border BorderBrush="Gray" BorderThickness="1" Padding="10">
        <StackPanel>
          <TextBlock Text="{Binding Name}" FontSize="16" />
          <TextBlock Text="{Binding Title}" Foreground="Gray" />
        </StackPanel>
      </Border>
    </DataTemplate>
  </ContentControl.ContentTemplate>
</ContentControl>

Source File

ContentControl.cs:1-169

See Also

Build docs developers (and LLMs) love