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. Image for the cookie policy date

Syntax colours for JSON

Could the EditControl be used to display JSON files? I see how it works for XML but not sure whether it could handle JSON?

3 Replies

VR Venkateshwaran Ramdoss Syncfusion Team May 1, 2017 10:59 AM UTC

Hi Richard, 
 
Thank you for contacting Syncfusion Support. 
 
Yes. EditControl is working for JSON file. We have prepared for a sample by using custom language for your reference. Please make use of the below code example. 
 
Code example[XAML] 
 
  <syncfusion:FormatsCollection x:Key="JSONLanguageFormats"> 
                <syncfusion:EditFormats Foreground="Black" FormatName="OperatorFormat"/> 
                <syncfusion:EditFormats Foreground="Blue" FormatName="LiteralsFormat"/> 
  </syncfusion:FormatsCollection> 
 
  <syncfusion:LexemCollection x:Key="JSONLanguageLexems">                                
                <syncfusion:Lexem StartText="&quot;" EndText="&quot;" IsMultiline="False" LexemType="Literals" FormatName="LiteralsFormat"/>                 
                <syncfusion:Lexem StartText=":" ContainsEndText="False" IsMultiline="False" LexemType="Operator" FormatName="OperatorFormat"/> 
  </syncfusion:LexemCollection> 
 
We have prepared a sample and screenshot for your reference and it can be downloaded from the below link. 
 
 
Screenshot 
 
 
 
 
Please refer the below documentation link for more details. 
 
 
Please check the above solution and let me us know if it is helpful. 
 
Regards, 
Venkateshwaran V.R. 



RI Richard May 8, 2017 03:54 PM UTC

Thanks for the assistance, this is really helpful...

Is there any way the formatting can cater for the following...

In JSON you frequently gget lines like  

"literal1": "literal2"

In this case, literal1 and literal2 should be in different colours, as per the image below




thanks for  your help


VR Venkateshwaran Ramdoss Syncfusion Team May 15, 2017 03:44 PM UTC

Hi Richard, 
 
Thank you for your update.  
 
At present, there is no direct support available for your requirement. We have tried to achieve your requirement using Custom Language support. Please make use of the below code example. 
 
Code example[C#] 
 
new Lexem { StartText = @"(?<=([\'\""]))(?=:)", IsRegex=true, IsMultiline = false, ContainsEndText = false, LexemType = EditTokenType.Keyword, FormatName= "AfterColon" }, 
 
We have prepared a sample for your reference and it can be downloaded from the below link. 
 
 
Screenshot 
 
 
 
Please check the above solution and let us know if it is helpful. 
 
Regards, 
Venkateshwaran V.R. 


Loader.
Live Chat Icon For mobile
Up arrow icon