在前面的文章中說(shuō)明了界面控件Essential Studio for WinRT(XAML)中的SfDateTimeRangeNavigator控件的使用示例，下面來(lái)看看如何在時(shí)間范圍控件上實(shí)現(xiàn)標(biāo)簽自定義。

自定義標(biāo)簽

    在Essential Studio for WinRT(XAML)的SfDateTimeRangeNavigator控件可以幫助用戶以簡(jiǎn)化的方式可視化大數(shù)據(jù)，在更高層次和低層次的條形是表示數(shù)據(jù)時(shí)間跨度的，在默認(rèn)情況下會(huì)自動(dòng)計(jì)算的時(shí)間跨度，對(duì)于給定的數(shù)據(jù)會(huì)提供適當(dāng)?shù)臅r(shí)間格式和間隔。

    間隔屬性有以下幾種類型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>

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

    當(dāng)用用下面的格式放大時(shí)，自動(dòng)時(shí)間跨度格式會(huì)簡(jiǎn)化數(shù)據(jù)的可視化表示。

標(biāo)簽樣式自定義

    使用LabelBarStyle屬性可以實(shí)現(xiàn)標(biāo)簽樣式自定義，這個(gè)可以應(yīng)用到更高層的條形或更低層級(jí)的條形。

<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>

    下面的屏幕快照顯示的是標(biāo)簽水平對(duì)齊方式設(shè)置為左。

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