Lately we’ve been working on starting to add adornment layer capabilities to SyntaxEditor for WPF.  Each adornment layer can contain any sort of UIElement-based adornment.  For example, in our updated design for version 2009.2, the editor view selection itself is now an adornment layer, where the selection visual is a shape.  Custom adornment layers can be created and managed. 

They can be inserted anywhere in the z-order of adornment layers too.  This means that you can put adornments on top of the text, or you could alternatively choose to show them in between the selection and text layers, etc.

This adornment layer model is a huge extensibility point and will be used as the foundation for many visual features going forward.  Once implemented, things like squiggle (wave) lines and collapsed outlining node markers will adornment layers.

Smoke text QuickStart

We wanted to do a neat sample to ensure the layers perform well at run-time.  What we came up with is smoke text! :)

Basically, as you type, smoke rings rise out from where the caret is and change location, size, and opacity, thereby creating a neat smoke effect.  The static picture doesn’t do the effect justice.  Check out a captured video after the break.  More...

Build 506 of WPF Studio 2009.1 is available for download now.  It is one of the larger WPF Studio maintenance releases we’ve made.  Let me do a quick review of some of the major exciting new features.  In addition to this list, there are a lot of other minor enhancements made.

See our related forum announcement for exact details on what updates were made in each product.

	Docking/MDI for WPF Custom content in docking window tabs Any content can now be placed in docking window tabs.  This screenshot shows an animated progress indicator in one tab and a drop-down button in the other tab. Resize slots in a SplitContainer New features have been added making it possible for you to resize the slots of a SplitContainer however you like.  This screenshot shows a split container with an even distribution of space for its slots. Cascade and tile tabbed MDI documents You now can cascade, tile horizontally, and tile vertically tabbed MDI documents.  This screenshot shows how six tabbed documents are tiled horizontally. New WindowControl features WindowControl has several new options and even allows custom content to be in the title bar.  This screenshot shows a small progressbar in the title bar. Close tabs with middle-click An option has been added to allow tabs to close with a middle-click, much like in some popular browsers.
	Editors for WPF Improved min/maximum value support The built-in editors have had support for min/max values improved.
	Navigation for WPF New Windows 7-like expander style A new style has been added that renders similar to the Windows 7 expanders and even has smooth animation.  The style is customized for each system and Office theme. Built-in expander styles updated to support all expand directions We’ve updated all our built-in expander styles so that all expand directions are supported: up, down, left and right.
	PropertyGrid for WPF New textbox and dialog button property editor We’ve added a new built-in property editor that uses a TextBox and includes a button that can be used to show a dialog.
	SyntaxEditor for WPF Finalized language definition format This build finalizes the new language project and language definition XML formats.  All language samples have been updated to use them instead of the classic SyntaxEditor 4.0 for WinForms dynamic language XML definition format. Language Designer application Very major improvements (several weeks of dev time) have been made to the Language Designer application.  It has a number of helpful tools for quickly getting started building a syntax language for use with SyntaxEditor.  It now just takes a few minutes to get up and running, even for SyntaxEditor newbies. Automated quick info session processing We’ve added a new quick info provider service that can be added to a language.  This service watches for mouse hovers and just asks you what to display in response to hovers over different areas of the editor.  Quick info can be displayed for hovers over the text area, or any other part of the editor such as in margins. View mouse hover event A new view mouse hover event has been added.  We handle all the processing for determining when to fire it. Caret and selection brush customization You now can completely customize the look of the caret and selection.  Don’t like our default settings?  Change them however you like! Completion list display when user starts typing a word We’ve added a new feature to make it easy to know if the user is starting to type a new word, so that a completion list can display in response. MGrammar tokens now get assigned a token key We’ve updated tokens generated from the Oslo Dataflow Add-on to provide an IToken.Key value if a TokenKey attribute is specified in the original MGrammar source
	Shared Library for WPF Unique tooltip for PopupButton popup indicator We’ve added a new PopupIndicatorToolTip property to PopupButton, which allows the popup indicator to display a unique tooltip, rather than the tooltip for the main button area.

In the previous post of this series, the Language Designer generated some C# code for our ECMAScript language that can be used in your applications.  In today’s post we’re going to look at the other generation option, which is to output language definition files.

Generating a language definition file

By checking the “output a language definition” checkbox, our code files list changes to only show one file, a file with a .langdef extension.

The EcmaScript.langdef file is intended to be deployed with your application and loaded at run-time.  The nice thing about language definitions is that end users can tweak them as needed.  This is a lot trickier to do if you have dedicated C#/VB classes for your language.  More...

In the previous post of this series we built the language project in the Language Designer, found that there was an error, and resolved the error.  Now that all the errors have been eliminated, we are ready to generate code.

Code generation configuration pane

The code generation configuration pane has fields where we can enter the namespace in which any generated C#/VB code will be placed, along with the output folder in which files are to be created.

There also is an option to output a language definition (.langdef) file instead of C#/VB code files.

For today’s post we’ll output C# code files.  Incidentally the Options tab has buttons that let you select the output language for code files.

This pane also shows the list of files that can be generated for our language.  With just several minutes of work seen in our previous steps, our ECMAScript language project already has six classes that can be generated.

Let’s take a look at a couple of them.  More...

In the previous post of this series, we looked at the dynamic lexer that was generated from the New Dynamic Lexer Wizard.  Today we’re going to examine the validation and error checking features provided by the Language Designer.

Building the project

If we click the Build Project button in the ribbon, the Language Designer examines all aspects of the language project that is loaded and reports back any errors, warnings or messages that it thinks of.  This can be anything from you forgetting to enter a required field, to a classification key for a lexical pattern group being invalid.

If we build the project for our ECMAScript language project, we are presented with one error.

Note the error in the Error List tool window telling us that we need to set an output folder path.  More...

In the previous post of this series we looked at how the New Dynamic Lexer Wizard generated a lexer for us that we could live test immediately.  In today’s post, we’ll look more in-depth at the dynamic lexer that was generated.

What is a dynamic lexer?

A dynamic lexer is a lexer that uses patterns to determine how to tokenize text.  Patterns can be explicit, which mean the pattern matches the exact characters in the pattern.  Patterns can also use regular expressions.  This allows for incredible flexibility that you won’t find in other products.  And remember that dynamic lexers are only one type of lexer that are supported in SyntaxEditor.

The wizard results in-depth

We use the treeview on the left to navigate the parts of the lexer.  In this screenshot, we have selected the Lexical States node.

All of the lexical states defined in the lexer are listed.  One or more can be selected and have its properties be edited directly in the property grid on the right.  Note that our wizard generated a default state along with states for strings and comments.  More...

In the previous post of this series we used the handy New Dynamic Lexer Wizard in the Language Designer app to quickly configure a dynamic lexer for our ECMAScript language. 

A glimpse at the dynamic lexer result

It took about a minute to enter the data in the wizard and the result is a very good start on our lexer.  You can see from the following screenshot that the Dynamic Lexer appears in the tree on the left, along with its structure.

The wizard created five lexical states based on the information we entered.  We’ll get into some of the details of what was created in the next post.  For now though, let’s check out another really neat feature of the Language Designer… live test!  More...

In the previous post of this series we started the Language Designer and entered some high-level general properties about the language we’re going to create, which is ECMAScript.  Today we’re going to use a wizard to quickly create a dynamic lexer for our language.  With the features described below, we have specifically tried to make the generation of a new language as easy as possible for new customers.

Selecting a lexer type

A new language project doesn’t have a lexer defined.  When we click the Lexer button in the ribbon, the Lexer pane is opened.  We are presented with a Lexer Type sub-pane that allows us to choose the type of lexer to use.

For our ECMAScript language sample, we’ll use a Dynamic lexer so select Dynamic in the radio button list and click the Change Lexer Type button.  This opens the New Dynamic Lexer Wizard.  More...

This post is the second post in our series on upcoming enhancements to the SyntaxEditor for WPF Language Designer application.  The previous post gave a high-level over view of the application and talked about language projects and definitions.

One of the more common questions we receive related to SyntaxEditor is:  How do I get started creating a new language definition?  The updates we’re doing to the Language Designer right now are attempting to directly address that question.

First opening the application

When you first open the Language Designer, no language project (.langproj file) is loaded so you are presented up-front with several Start Actions.

The Start Actions include a number of items also found on the ribbon’s application menu:  New Language Project, Open Language Project (with links to recently-opened projects), and Import SE4 Definition.  More...

Many customers of our WinForms and WPF SyntaxEditor controls have asked for an easy way to get started building language definitions.  Languages definitions can be confusing when you are new to the product.  As we have been working on our next generation SyntaxEditor framework (used in the WPF version), we decided that having a robust Language Designer application would be extremely useful for customers.  The Language Designer is intended to be the ideal place to go when building a language definition for use with SyntaxEditor.

First builds

Up until now, the Language Designer (included with the WPF SyntaxEditor) was very simplistic and only allowed you to generate several classes that could be used with programmatic lexers.  It is and always has been our goal to add a lot more functionality to the app as we move forward and the next WPF Studio maintenance release will make a big step towards that goal.  More...