HeaderTemplate property

HubSection.HeaderTemplate property

Gets or sets the DataTemplate used to display the content of the hub section header.


Public Property HeaderTemplate As DataTemplate


<HubSection HeaderTemplate="resourceReferenceToDataTemplate"/>

XAML Values


A single DataTemplate object element. That DataTemplate would typically have multiple child elements that define the visual appearance of the data representation.


A resource reference to an existing DataTemplate from a resources collection. The resource reference must specify the desired DataTemplate by key through a {StaticResource} markup extension usage.

Property value

Type: DataTemplate

The template that specifies the visualization of the header object. The default is null.


Add a header to let users know the context of your Hub section. You can use a data template for the header by setting the HeaderTemplate property. It's important to remember that although you can use arbitrary content in the header, the height of the header affects the amount of vertical space available for your hub section content. The section header scrolls with the hub section.

You can make a section header interactive by setting the IsHeaderInteractive property to true. Typically, the user can tap an interactive header to navigate to the corresponding app section page.

You can respond to a tapped header by handling the Hub.SectionHeaderClick event. You get the section that was clicked from the SectionHeaderClickEventArgs.Section property of the event data.

Windows 10

When its IsHeaderInteractive property is true, the default header includes the text, See more. When a user taps the See more text, the SectionHeaderClick event is raised. The text is rendered as a hyperlink, which uses the user selected system accent color by default.

Windows 8.x

When its IsHeaderInteractive property is true, the default header includes a chevron glyph, and "Hover" and "Pressed" visual states. If you use a custom HeaderTemplate, you should provide similar visual cues to indicate that the header is interactive.

Requirements (Windows 10 device family)

Device family

Universal, introduced version 10.0.10240.0

API contract

Windows.Foundation.UniversalApiContract, introduced version 1.0


Windows::UI::Xaml::Controls [C++]



Requirements (Windows 8.x and Windows Phone 8.x)

Minimum supported client

Windows 8.1

Minimum supported server

Windows Server 2012 R2

Minimum supported phone

Windows Phone 8.1 [Windows Runtime apps only]


Windows::UI::Xaml::Controls [C++]



See also




© 2016 Microsoft