The Actipro Blog

All the latest UI control development news from Actipro

Integrating MGrammar DSL parsers with SyntaxEditor to implement syntax highlighting

Now that the public beta of SyntaxEditor for WPF has been released, I’d like to show off a really neat feature that you probably haven’t heard about yet.  Microsoft has been working on a new modeling technology that has been codenamed “Oslo”.  You can read all about it here:

http://msdn.microsoft.com/en-us/oslo/default.aspx

One piece of Oslo is the ability to create GLR-based text parsers that basically parse text and output an AST node graph.  This part of Oslo is called MGrammar.  We first looked into this technology back at PDC 2008 and became involved with the Oslo team shortly thereafter.  Special thanks go out to Chris Sells and his team for all their help.  Our goal was to make an add-on for our SyntaxEditor control that provided syntax highlighting within the control based on an MGrammar DSL parser.

MGrammarIntegration

The MGrammar Integration sample included with WPF Studio, which shows a SyntaxEditor instance that has loaded an MGrammar DSL parser and is using it for syntax highlighting

We’ve implemented this new Oslo Dataflow Add-on and have included it in the WPF Studio 2009.1 release that came out last week.  Download the WPF Studio Evaluation to check it out… it includes a complete sample project showing how simple it is to get working. 

Integrating the sample above in a few lines of code

Yes, you read that headline right.  If you have an MGrammar DSL parser image (created by running Oslo’s m.exe on your .mg source file to create a .mx parser image file) and have created a WPF Window with a SyntaxEditor on it named editor, it only takes a few lines of code to implement the above sample.  The sample has full syntax highlighting capabilities that update as you type and the SyntaxEditor control can make use of any of the features that are available in the SyntaxEditor code editor control.

Requirements

The only main requirement is that you have the “Oslo” May CTP installed, which can be downloaded from the link given above.  The Actipro Oslo Dataflow Add-on is included with WPF Studio and will only work with that particular CTP version.

Designing an MGrammar parser and generating its image

You can use Oslo’s handy IntelliPad application to construct an MGrammar definition (.mg file).  We include a sample .mg file for our Simple language in the sample. 

The next step is to run Oslo’s m.exe on your .mg source file.  This creates a file with an .mx extension, which is a parser image file you can include as an embedded resource in your application.

Code to tie it all together

Now in your main window’s constructor, add this sort of code:

   1: // Load the Simple.mx resource file
   2: using (Stream stream = this.GetType().Assembly.GetManifestResourceStream(
   3:     "ActiproSoftware.Windows.SimpleLanguage.Simple.mx")) {
   4:  
   5:     // Construct a DynamicParser based on the Simple.mx file
   6:     DynamicParser parser = DynamicParser.LoadFromStream(stream, 
   7:         "ActiproSoftware.SimpleLangauge.Grammar.SimpleLangauge");
   8:  
   9:     // Construct a IHighlightingStyleRegistry for syntax highlighting
  10:     IHighlightingStyleRegistry registry = AmbientHighlightingStyleRegistry.Instance;
  11:     registry.Register(ClassificationTypes.Comment, 
  12:         new HighlightingStyle("Comment", Brushes.Green));
  13:     registry.Register(new ClassificationType("Delimiter"), 
  14:         new HighlightingStyle("Delimiter", Brushes.SlateBlue));
  15:     registry.Register(ClassificationTypes.Identifier, 
  16:         new HighlightingStyle("Identifier", null));
  17:     registry.Register(ClassificationTypes.Keyword, 
  18:         new HighlightingStyle("Keyword", Brushes.Blue));
  19:     registry.Register(new ClassificationType("Number"), 
  20:         new HighlightingStyle("Number", Brushes.Purple));
  21:  
  22:     // Construct a SyntaxLanguage based on the DynamicParser and IHighlightingStyleRegistry
  23:     SyntaxLanguage language = new SyntaxLanguage("Simple");
  24:     language.LexicalParser = new DataflowLexicalParser(parser);
  25:     language.ClassifierFactory = new DataflowClassifierFactory(parser, registry);
  26:  
  27:     // Assign the SyntaxLanguage to the SyntaxEditor's document
  28:     this.syntaxEditor.Document.Language = language;
  29: }

We assume your .mx file is stored as an embedded resource in your application’s assembly.  Then we load an Oslo DynamicParser based on that image file.

The next several lines of code configure a highlighting style registry, which is something that maps logical classifications (defined in MGrammar source files) to highlighting styles, which govern syntax highlighting.

We create a new SyntaxLanguage and assign it a lexical parser and classifier (both of which are part of the Actipro Oslo Dataflow Add-on) that use the DynamicParser loaded above.

Finally we set the language to the SyntaxEditor’s document, and we’re done!  We now have complete syntax highlighting capabilities based on our MGrammar DSL parser.

Cloning Oslo’s IntelliPad

Just for kicks, we created an internal sample here that clones the core functionality of IntelliPad, where there is a three pane setup with the MGrammar source code in the middle pane, a test script to input in the left pane, and AST parse results in the right pane.  As you modify text in the middle or left panes, the others update appropriately.

IntelliPadClone

The IntelliPad clone created using SyntaxEditor and its Oslo Dataflow Add-on 

Note that the middle pane’s SyntaxEditor is using the actual MGrammar language’s DynamicParser that is included in the Microsoft.M.dll assembly to provide its syntax highlighting via our add-on. 

Although this screenshot doesn’t show it, if we had an MGrammar source file loaded that does classification, our left “Sample Code” pane would be syntax highlighting the sample code based on the MGrammar source classifications too, also via the add-on.

Conclusion

Well that’s our intro to the new Oslo Dataflow Add-on.  This add-on is absolutely free for any SyntaxEditor for WPF customers.  If you use MGrammar and want to have it drive syntax highlighting for a code editor in your WPF applications, download the WPF Studio evaluation today and check it out.

If you’d like to see any other features implemented that marry SyntaxEditor and Oslo together even further, feel free to post comments or email us.

Filed under: Actipro, New product, WPF

Comments (6) -

May 31, 2009 at 20:46  

Aykut Kilic Turkey

Great feature.

What about auto-completing?

May 31, 2009 at 20:58  

Bill Henning (Actipro) United States

Hi Aykut,

We're open to expanding functionality for the add-on.  The public beta doesn't have hooks to drive syntax/semantic parsing yet, but that sort of ting will be added in future builds.  Along with this, AST support will be added.

MGrammar does probably give us enough information to build an AST.  However as for auto-complete, that may require you to examine the tokens and AST to determine what can be auto-completed.

If you have any suggestions in this area or other thoughts, please feel free to post or email them to us.

June 1, 2009 at 00:15  

Tim Fischer Germany

Hey Bill,

you have great products and you are at the edge with technologies.
We really love to see this!

Keep up the great work!

Tim

June 1, 2009 at 00:24  

Bill Henning (Actipro) United States

Thanks Tim... we have a number of other small but really useful new product features (not just for SyntaxEditor) coming soon.  Keep an eye on our blog for details.

November 28, 2009 at 17:37  

Rishi Gosalia United States

Antlr is a powerful parser generator. Any plans to be able to use antlr-based grammar file for syntax highlighting?

November 29, 2009 at 02:18  

Bill Henning (Actipro) United States

Rishi,

Actually we already have integration with ANTLR as well:
blog.actiprosoftware.com/post.aspx

However it can only be used as a parser, not a lexer.  ANTLR doesn't support incremental lexing, thus we can't have it drive syntax highlighting.  We talked to Terence Parr about this a while back.

Pingbacks and trackbacks (2)+

Comments are closed