We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
Unfortunately, activation email could not send to your email. Please try again.

Inverting colors in SfDateTimeRangeNabigator

Thread ID:

Created:

Updated:

Platform:

Replies:

128406 Jan 19,2017 07:58 AM Jan 24,2017 06:50 AM WPF 5
loading
Tags: SfDateTimeRangeNavigator
Tim
Asked On January 19, 2017 07:58 AM

Is it possible to change/invert colors like in this picture? https://help.syncfusion.com/wpf/sfdatetimerangenavigator/Label-Customization_images/Label-Customization_img2.png

Thanks in advance.

Devi Aruna Maharasi Murugan [Syncfusion]
Replied On January 20, 2017 04:30 AM

Hi Tim, 
  
Thanks for contacting Syncfusion Support. 
  
By default, the SfDateTimeRangeNavigator will be displayed with the color as like in the provided image.  We have prepared a demo sample with customization in labels to get the output as shown in the provided image. The sample can be downloaded from below link, 
  
  
If this does not meet your requirement, please provide more information about your requirement. It would be helpful for us to provide you the solution earlier. 
  
Regards, 
Devi 
 




Tim
Replied On January 20, 2017 04:37 AM

Thank you very much for your response, but the sample you sent me has the selected interval colored white, but I want it to be gray. I'm attaching a picture.


Devi Aruna Maharasi Murugan [Syncfusion]
Replied On January 20, 2017 08:01 AM

Hi Tim, 
  
Thanks for your update. 
  
We can achieve this requirement by applying the Background for SfChart as shown in the below code snippet, 

        <chart:SfChart > 
             <chart:SfChart.Background> 
                 <SolidColorBrush Color="#7e000000" Opacity="0.5"/> 
             </chart:SfChart.Background> 
        </chart:SfChart > 

  
To get the view as like the attached image, we need to customize the OverlayBrush, HigherBarGridLineStyle and LowerBarGridLineStyle properties of SfDateTimeRangeNavigator. 
  
We have prepared a demo sample based on your requirement and it can be downloaded from below link, 
  
Regards, 
Devi 




Tim
Replied On January 23, 2017 04:12 AM

Thanks for your answer, but is it possible to make selected range green and unselected range lets say red?

Devi Aruna Maharasi Murugan [Syncfusion]
Replied On January 24, 2017 06:50 AM

Hi Tim, 
  
Thanks for your update. 
  
As we mentioned in our previous update, we can customize the selected range by applying background for SfChart as shown in the below code snippet, 
  
<chart:SfDateTimeRangeNavigator.Content> 
     <chart:SfChart > 
         <chart:SfChart.Background> 
                <SolidColorBrush Color="Green" /> 
          </chart:SfChart.Background>           
     </chart:SfChart> 
</chart:SfDateTimeRangeNavigator.Content> 
 
  
Also, we can customize the unselected region color with OverlayBrush property of SfDateTimeRangeNavigator as shown in the below code snippet, 
 
<chart:SfDateTimeRangeNavigator.OverlayBrush> 
    <SolidColorBrush Color="Red" Opacity="0.7"/> 
</chart:SfDateTimeRangeNavigator.OverlayBrush> 
 
  
We have prepared a demo sample based on your requirement and it can be downloaded from below link, 
  
Regards, 
Devi 





CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.

;