在前面的文章中說明了界面控件Essential Studio for WinRT(XAML)中的SfDateTimeRangeNavigator控件的使用示例，下面來看看如何在時間范圍控件上實現標簽自定義。

自定義標簽

    在Essential Studio for WinRT(XAML)的SfDateTimeRangeNavigator控件可以幫助用戶以簡化的方式可視化大數據，在更高層次和低層次的條形是表示數據時間跨度的，在默認情況下會自動計算的時間跨度，對于給定的數據會提供適當的時間格式和間隔。

    間隔屬性有以下幾種類型Year、Quarter、Month、Week、Day、Hour。

<syncfusion:SfDateTimeRangeNavigator x:Name="rangepicker" ItemsSource="{Binding power}"  XBindingPath="Date" >
            <syncfusion:SfDateTimeRangeNavigator.Intervals> 
                <syncfusion:Interval IntervalType="Quarter"/>
                <syncfusion:Interval IntervalType="Month"/>
            </syncfusion:SfDateTimeRangeNavigator.Intervals>
            <syncfusion:SfDateTimeRangeNavigator.Content>
                <syncfusion:SfChart   >
                    <syncfusion:SfChart.PrimaryAxis>
                        <syncfusion:CategoryAxis Visibility="Collapsed" />
                    </syncfusion:SfChart.PrimaryAxis>
                    <syncfusion:SfChart.SecondaryAxis>
                        <syncfusion:NumericalAxis Visibility="Collapsed" />
                    </syncfusion:SfChart.SecondaryAxis>
                    <syncfusion:FastLineBitmapSeries XBindingPath="Date" ItemsSource="{Binding power}" YBindingPath="Value">
                        </syncfusion:FastLineBitmapSeries>
                </syncfusion:SfChart>
                </syncfusion:SfDateTimeRangeNavigator.Content>
        </syncfusion:SfDateTimeRangeNavigator>

    在下面的截圖中顯示了季度和月份的時間間隔。

    當用用下面的格式放大時，自動時間跨度格式會簡化數據的可視化表示。

標簽樣式自定義

  ;  使用LabelBarStyle屬性可以實現標簽樣式自定義，這個可以應用到更高層的條形或更低層級的條形。

<chart:SfDateTimeRangeNavigator.HigherLevelBarStyle>
                    <chart:LabelBarStyle Background="Red" LabelHorizontalAlignment="Left">
                        <chart:LabelBarStyle.LabelStyle>
                            <Style TargetType="TextBlock">
                                <Setter Property="FontSize" Value="10"/>
                            </Style>
                        </chart:LabelBarStyle.LabelStyle>
                    </chart:LabelBarStyle>
  </chart:SfDateTimeRangeNavigator.HigherLevelBarStyle>

    下面的屏幕快照顯示的是標簽水平對齊方式設置為左。

>>Essential Studio for WinRT(XMAL)最新版下載