Articles in this section
Category / Section

How to customize the header of the SfDateSelector?

The Header of the SfDateSelector can be customized by changing the selector style of the SfDatePicker. The same has been demonstrated in the following code example:

 

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <input:SfDatePicker VerticalAlignment="Center"
                            HorizontalAlignment="Center"
                                          Width="200">
 
            <input:SfDatePicker.SelectorStyle>
            <Style TargetType="input:SfDateSelector">
             <Setter Property="HeaderTemplate">
                <Setter.Value>
                  <DataTemplate>
                     <TextBlock Text="Set your reminder" Height="50" 
                                FontFamily="Castellar" Margin="10" FontSize="20"/> 
                  </DataTemplate>
                 </Setter.Value>
              </Setter>
             </Style> 
            </input:SfDatePicker.SelectorStyle>
         </input:SfDatePicker>
 </Grid>

 

Output:

Did you find this information helpful?
Yes
No
Help us improve this page
Please provide feedback or comments
Comments (0)
Access denied
Access denied