Extensibility Module Designer Fun...

 ... or How to beat the system by having Visual Studio Form Designer create your module forms.     

The UI extensibility point is a powerful feature found in IIS7, but one of the more difficult things is designing the layout of the extended module forms.  It can become difficult to manage all of the button locations, list view settings and other controls when the page is being initialized without the Visual Studio form designer.

Here is how to use the Visual Studio Forms Designer to create the lay out for your module page:

1.       Get a hold of some form of Visual Studio.  The express version will work just fine for this:  http://msdn.microsoft.com/vstudio/express/visualcsharp/default.aspx

2.       Open Visual Studio and create a new Windows Application.

3.       Create the form as you would like it shown inside of IIS7. 

4.       When you’re done right click on the form and select View Code.

5.       Right click on InitializeComponent() and select Go to Definition.

6.       Open the Windows Form Designer Generated Code region and copy everything inside of Initalize component and the variable names.

     IE:

      Windows Form Designer generated code

private System.Windows.Forms.Button cancelButton;

7.       On your module page, paste the copied code into an Initalize method and call it within the page constructor.

8.       Test the module. It should show the same controls that were created inside of the Visual Studio forms designer inside of an IIS7 module.

-          The background color in IIS7 is white and not the control gray.

-          Beware of anchoring. The right edge of the module page is actually underneath the actions task pane.