Syntax colours for JSON

[Richard]

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

[Venkateshwaran Ramdoss]

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. 

 

Sample: EditControl_JSON_Sample 

 

Screenshot 

 

 

 

 

Please refer the below documentation link for more details. 

 

Documentation link: https://help.syncfusion.com/wpf/editcontrol/language-support/custom-language-support  

 

Please check the above solution and let me us know if it is helpful. 

 

Regards, 

Venkateshwaran V.R. 

[Richard]

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

[Venkateshwaran Ramdoss]

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. 

 

Sample:  EditControl_JSON_Sample 

 

Screenshot 

 

 

 

Please check the above solution and let us know if it is helpful. 

 

Regards, 

Venkateshwaran V.R. 

[Michael]

Hi,

I came across this post and have same situation with EditControl +  Json. This post helps but I also want to have Outlining support on the Json string, How can I make it work. 

I already set the SupportsOutlning= true for the custom Json lanugage that use with this sample.

Thanks,

[Gokul Thanudhas]

Hi Michael,

Sorry for the delay.

You can achieve your requirement by adding the lexem with CodeSnippet type and implementing the custom expand-collapse logic using the ApplyExpandCollapse override method available in the custom language class. 

Please refer the sample for your reference.

Regards,

Gokul T

Attachment: EditControl_JSON_Sample_d98413be.zip