RSS Feed
Download our iPhone app
Browse DevX
Sign up for e-mail newsletters from DevX


.NET Building Blocks: Build a RichTextBox-Based Syntax-Highlighting Editor and IDE  : Page 5

By using the RichTextbox as a base control, you can build an editor that highlights keywords and quoted strings—or even an editor that employs IDE-like smart indentation and runs script code interactively.

Application Two: A VBScript IDE
Now that you have a good overview of how to use the finished control, this section discusses how to work with and customize it in development.

Near the beginning of the article you dragged a subclassed control instance—a SqlServerSyntaxHilightTextBox—onto your form and worked with that. In fact, you only had two subclasses that you could pick from, no parent or main class. The main class—SyntaxHilightTextBox—is an abstract class; you must subclass it to create an instantiable control. See the SyntaxHilightTextBox API here. Here is the entire program for one such subclass:

   public partial class SqlServerSyntaxHilightTextBox : 
      public SqlServerSyntaxHilightTextBox()
         EndOfLineCommentMark = "--";
      protected override void DefineWordList()
         WordList = new string[] {
            . . .
This class does only two things:

  • The constructor changes the EndOfLineCommentMark to the appropriate string for SQL. All other property defaults are adequate for T-SQL, the language that SqlServer uses. You might argue that the QuoteChars property should be set to a single quote rather than the default of both single and double quotes. I chose not to do this because while T-SQL doesn't normally use double-quotes for string constants, it can use them in limited situations to delimit strings. Alternatively, you might choose to add square brackets to the list as well (e.g. to create bracket-delimited names such as [dbo].[Table Name]).
  • The DefineWordList method specifies a value for the WordList. This WordList is, of course, the key to syntax highlighting. All you have to do is provide a list of keywords for the language of your choice and those keywords will highlight appropriately when you use the control in an application.
The rest of this article walks you through the process of creating a SyntaxHilightTextBox subclass for editing the VBScript language.

Step 1: Generate the Project
Add a new project to your solution (or just start a new solution). The new project should use the Windows Control Library template. The visual designer will display an empty control (see Figure 16).

Figure 16. New Control: When you create a new application project you get an empty form; when you create a new control project you get an empty control.
Figure 17. Convenient File Renaming: When you rename a file in the Solutions Explorer, Visual Studio prompts you to see if you want to update object references to the same name.
Step 2: Name Your Control
Rename the UserControl1.cs file to VBScriptSyntaxHilightTextBox.cs. Visual Studio will recognize what you are doing and try to do the right thing (see Figure 17).

Select "Yes" to keep your file in sync with your class.

Step 3: Reference the Parent Class
Add a reference (right-click on References in the Solution Explorer) to the CleanCodeControls library so you will have access to the base class.

Step 4: Inherit from the Parent Class
Open the code-behind file VBScriptSyntaxHilightTextBox.cs. Change the class inheritance from…

   public partial class VBScriptSyntaxHilightTextBox : 
to …

   public partial class VBScriptSyntaxHilightTextBox : 
Visual Studio will again provide some convenient assistance by putting a tiny mark under the last character of the line (see Figure 18).

Figure 18. VS Code-Editing Feature: When you enter a name that Visual Studio is aware of but knows you have not yet properly bound, it offers you a couple choices to bind it properly, indicated by the mark at the end of the symbol.
Figure 19. Abstract Class Feature: Visual Studio, knowing that the symbol you have entered is an abstract class, provides a marker to let you open a pop-up menu to insert skeleton code for the abstract case.
That mark provides access to a short menu that lets you bind the selected item. Although you included the CleanCodeControls library in the project, it's not yet referenced in this source file. So open the menu (Shift-Alt-F10) and choose the binding method you prefer. If you are successful, the SyntaxHilightTextBox name that you typed will now be highlighted in teal, indicating that Visual Studio recognizes it and has bound it correctly. If you selected the using statement for binding, you will find a using CleanCodeControls.Forms; statement inserted in the file prologue (see Figure 19).

Step 5: Fulfill the Parent Contract
Look carefully at Figure 19—Visual Studio provides another hint on the first character of the class name (though it may not show up until you click in the text).

This time the context menu prompts you to implement the abstract class. That is, any time you use an abstract class (or an interface) you must implement whatever that abstract class (or interface) requires. So go ahead and do that. In this case, Visual Studio inserts code for the single required method DefineWordList. The body of the method simply throws an exception. This is not what you want it to do; it is merely inserted as a placeholder, so that if you do not happen to catch and fix it before you run your program you will get an abrupt reminder when the application calls the method.

Step 6: Clean Up
Figure 20. Visual Studio Limitation: Visual Studio is not able to display controls inherited from abstract controls in the visual designer; this is the error it shows when you attempt to view the control.
Technically, this step should be called "Clean Up after Visual Studio." While Visual Studio has provided useful assistance thus far, it now gets back at you. There are a couple things that it should know that it does not. Switch to the Design tab and you'll see the glaring error in Figure 20.

The error isn't caused by you doing anything wrong; by changing the base class away from the default, the Visual Designer is simply not able to display the control in design mode. So just close that tab.

The second surprise comes when you try to compile your program—you get the error shown in Figure 21. Double-click the error line to open the appropriate file to that line, then just delete the offending line; you don't need it.

Figure 21. Compliation Error: The act of changing the parent class to one other than the default causes a compilation error. Click on the error in the Error List to jump to the offending line and just delete it.
Step 7: Enumerate the Language Keywords
Fill in the body of the DefineWordList method. In this case, you want to include a list of all keywords in VBScript. I extracted my list from the VBScript Language Reference , which is perhaps 95 percent complete; as an exercise you could go through the reference and fill out any missing pieces.

Step 8: Raise the Language Awareness
Customize the control properties by adding these lines to the constructor to make the control VBScript-aware:

   EndOfLineCommentMark = "'";
   ClosedCommentEndMark = null;
   ClosedCommentStartMark = null;
   QuoteChars = "\"";
These particular properties apply universally in VBScript. That is to say, any time you instantiate a VBScriptSyntaxHilightTextBox you will want it to know that an end-of-line comment is denoted with an apostrophe. So that property is defined here. Other properties—such as color preferences—are not universal. So while you could specify any color preferences here, it is often better to do that when you instantiate the class. Furthermore, doing it then allows you to take advantage of Visual Studio's property editor, which automatically provides a color picker for you. On the other hand, if you intend to instantiate a VBScriptSyntaxHilightTextBox in several different applications and you want them all to consistently use gray for comments, then you can set it in code.

Close Icon
Thanks for your registration, follow us on our social networks to keep up-to-date