Have a Great DesignTime Experience with a Powerful DesignSurface (Extended) Class

• Download DLL file compiled in release mode - 10.35 KB
• Download demo project and library source code - 107.63 KB

Abstract

The article describes a DesignSurface inherited class which adds some design facilities (TabOrder, UndoEngine, SnapLines / Grid alignment) to the .NET 2.0 class. This class is hosted inside a DLL Assembly and ready to use inside any .NET solution.

Introduction

The .NET 2.0 Framework introduces the DesignSurface class which implements what the user perceives as a designer. This class is an improvement over the .NET 1.0 one, but it is still missing some design facilities which are very useful for the user who wants to design Forms. I'm talking about: TabOrder, UndoEngine and SnapLines/Grid alignment. All these features can be added with little effort (except maybe the TabOrder), nevertheless I want to make life a little easier for anyone who wants to make her/his own "designer".

Background

You should be familiar with basic C# programming and with some concepts used by the .NET designer (especially if you dive into the source code).

How to Use DesignSurfaceExt

In short:

using DesignSurfaceExt;

...


Form frm = new Form();
    IDesignSurfaceExt surface = new DesignSurfaceExt.DesignSurfaceExt();
    surface.CreateRootComponent( typeof( Form ), new Size( 400, 400 ) );
    surface.CreateControl( typeof( Button ), new Size( 100, 40 ), new Point( 10, 10 ) );
    TextBox t1 = (TextBox) surface.CreateControl( typeof( TextBox ), 
        new Size( 300, 20 ), new Point( 10, 80 ) );
    t1.Text = "Hello World by DesignSurfaceExt";
    surface.GetView().Parent = frm;
frm.ShowDialog();

The above code snippet simply creates a new DesignSurfaceExt instance. Use it via its interface to create the root component and any .NET control you desire, finally host the designsurface into a control, for example a Form; that all folks!

Tiny Form Designer, a Simple Demo Project to Show You the Power of the DesignSurfaceExt

Obviously you can do anything you want as I show you in the DemoConsole Project where I created a Tiny Form Designer! With this little designer, you can switch through four design surfaces hosted by four TabPages: one lets you align the controls using SnapLines facility; one using the "old" Grid; one using the Grid without snapping to the grid itself; and the last doesn't offer any alignment facility at all. Move the controls which have been programmatically deployed; cut and copy or cut and paste from one surface to another; undo and redo your actions and change the TabIndex of the controls with TabOrder facility.

The Interface

The really useful features are exposed through interface IDesignSurfaceExt but, if you prefer, you can ignore it and use the DesignSurfaceExt instance itself.

public interface IDesignSurfaceExt {

    //- perform Cut/Copy/Paste/Delete commands
    void DoAction( string command );

    //- de/activate the TabOrder facility
    void SwitchTabOrder();

    //- select the controls alignment mode
    void UseSnapLines();
    void UseGrid ( System.Drawing.Size gridSize );
    void UseGridWithoutSnapping ( System.Drawing.Size gridSize );
    void UseNoGuides();

    //- method useful to create control without the ToolBox facility
    IComponent CreateRootComponent ( Type controlType, Size controlSize );
    Control CreateControl ( Type controlType, Size controlSize, Point controlLocation );

    //- Get the UndoEngineExtended object
    UndoEngineExt GetUndoEngineExt();

    //- Get the IDesignerHost of the .NET 2.0 DesignSurface
    IDesignerHost GetIDesignerHost();

    //- the View of the .NET 2.0 DesignSurface is just a Control
    //- you can manipulate this Control just like any other WinForms Control
    //- (you can dock it and add it to another Control just to display it)
    //- Get the View
    Control GetView();

}//end_interface

The SnapLines/Grid Alignment Guides

The use of the Snaplines to align the controls hosted by the DesignSurface is achieved by setting the right Property:

surface.UseSnapLines();

If you prefer to use the Grid to align the controls hosted by the DesignSurface, you must specify the size of the grid when calling the right Property:

surface.UseGrid ( new System.Drawing.Size ( 16, 16 ) );

You can also align the control with no guides at all:

surface.UseGridWithoutSnapping ( new System.Drawing.Size ( 32, 32 ) );
surface.UseNoGuides(); 

The TabOrder

And what about the Taborder? Simply call the interface method to activate and deactivate the facility:

surface.SwitchTabOrder();

The UndoEngine

Now the UndoEngine! Get it via the Property: GetUndoEngineExt() and use it calling the Undo/Redo actions:

surface.GetUndoEngineExt().Undo();
surface.GetUndoEngineExt().Redo();

Cut/Copy/Paste/Delete the Controls

Finally use the cut/copy/paste and delete as usual:

surface.DoAction( "Cut" );
surface.DoAction( "Copy" );
surface.DoAction( "Paste" );
surface.DoAction( "Del" );

Conclusion

DesignTime is something really different from RunTime but the .NET Framework lets us approach it in a relatively simple manner. Enjoy this, IMHO, useful class and let me know if you find it useful!

History

• 14th March, 2008 - First release