SfDateTimeRangeNavigator visual apperance

[Julien Torrent]

Hi,

I'm currently using a SfDateTimeRangeNavigator and I have two issues.

1. With UWP, every time I update or change the itemsource, the line's color changes.

    Is it possible to set a color for the line and keep it ?

2.With UWP, when I select a range the non-selected range isn't overlayed like in Android.

   Will it be fixed ? 

    If no, how can I achieve it ?

Thanks

[Muneesh Kumar G]

Hi Torrent, 

 

Thanks for using Syncfusion products.  

 

Query 1 : With UWP, every time I update or change the itemsource, the line's color changes.  Is it possible to set a color for the line and keep it ? 

 

We are able to reproduce the issue with our source. The fix for this issue will be available on our upcoming volume 1 service pack 2 release, which will be available on End of April, 2018. However you can resolve this problem by setting SfDateTimeRangeNavigator  Content as LineSeries as follows.  

 

Code snippet [XAML]: 

 

 

<range:SfDateTimeRangeNavigator Grid.Row="1"  

                                        OverlayColor="#4dd3d3d3" 

                                        x:Name="rangeNavigator" Margin="10" 

                                        HorizontalOptions="FillAndExpand" 

                                        VerticalOptions="FillAndExpand"  

                                        ItemsSource="{Binding DateTimeRangeData}"  

                                        XBindingPath="XValue" 

                                        YBindingPath="YValue"> 

            <range:SfDateTimeRangeNavigator.Content> 

                <chart:SfChart x:Name="sfChart"> 

                    <chart:SfChart.PrimaryAxis> 

                        <chart:DateTimeAxis IsVisible="False" ShowMajorGridLines="False"/> 

                    </chart:SfChart.PrimaryAxis> 

                    <chart:SfChart.SecondaryAxis> 

                        <chart:NumericalAxis IsVisible="False" ShowMajorGridLines="False"/> 

                    </chart:SfChart.SecondaryAxis> 

                    

                </chart:SfChart> 

            </range:SfDateTimeRangeNavigator.Content> 

            

        </range:SfDateTimeRangeNavigator> 

 

Code snippet [C#]: 

LineSeries series; 

        public ChartSample() 

        { 

            InitializeComponent(); 

 

            ViewModel viewModel = new ViewModel(); 

            this.BindingContext = viewModel; 

 

            series = new LineSeries(); 

            series.XBindingPath = "XValue"; 

            series.YBindingPath = "YValue"; 

            series.ItemsSource = viewModel.DateTimeRangeData; 

 

            sfChart.Series.Add(series); 

 

        } 

 

        private void But_Clicked(object sender, EventArgs e) 

        { 

            (rangeNavigator.BindingContext as ViewModel).GenerateData(); 

 

            rangeNavigator.ItemsSource = (rangeNavigator.BindingContext as ViewModel).DateTimeRangeData; 

            series.ItemsSource = rangeNavigator.ItemsSource; 

        } 

 

 

Query 2 : With UWP, when I select a range the non-selected range isn't overlayed like in Android. Will it be fixed ? If no, how can I achieve it ? 

 

You can achieve this requirement in UWP by setting OverlayColor in SfDateTimeRangeNavigator as per the below code snippet.  

 

Code snippet [XAML]: 

 

<range:SfDateTimeRangeNavigator OverlayColor="#4dd3d3d3"/> 

 

 

We have prepared a sample based on this, please find the sample from the following location.  

 

Sample : http://www.syncfusion.com/downloads/support/forum/136873/ze/ChartGettingStarted1623682999 

 

Please let us know if you have any queries.  

 

Thanks, 

Muneesh Kumar G.