Introduction

In this video, we’ll examine the features that allow you to drop in code easily to the design surface. We’ll focus on the Toolbox from the Visual Studio environment and the Tag Library and tag chooser from the Dreamweaver environment. We’ll start the video by examining Visual Studio 2005.

Visual Studio 2005 Section

To place controls, all you have to do from either the code view or the design view is reference the Tool box, find a control you would like to place on the page – such as this calendar control – and drag and drop it into place. Automatically, the system resolves naming conflicts that would have otherwise arisen from the ID property of the control. Now let’s see how we can use a customer server control on a page. Here’s a class written in Visual Basic that extends from the calendar class. It simply adds in a unique caption, but otherwise, all if its behavior gets inherited from the standard calendar class. Note that the namespace for this new control is ‘MyCustomControls.’ A special attribute describes what code could be placed in the ASPX file when this control is placed in the design surface. To use this, we first need to compile this control. Once this assembly has been built into a DLL file, we can open the Toolbox and place it onto a tab of our choosing. By right-clicking on the tab, select ‘Choose Items,’ we can browse to where the DLL is found. Upon selecting the DLL, we are now able to add this new control in. Now that this control has been placed onto the Toolbox, we can simply drag and drop this control onto the design surface. Let’s remove the first calendar we had previously placed, and, switching to the code view, put this new custom control in its place. We see that we can drag and drop to the code surface; Visual Studio again mitigates any naming conflicts. Something that automatically happens when we drag and drop a custom control is the addition of this registry directive. It describes our namespace – MyCustomControls – and the Assembly name which is the name of the DLL. Let’s see what happens when we switch to the design surface. This looks just like a calendar, but with a caption already prescribed. It works exactly like the standard calendar does; we can open up the Smart Tag and choose a format just like we can do with the standard ASP.NET 2.0 calendar control. We see that it’s very easy in the Visual Studio environment to leverage the existing controls and put in our own custom behavior. Only a few lines of code were necessary to build this example of a custom calendar control and place it in our Toolbox.

Dreamweaver Section

Now let’s switch over to Dreamweaver and see how this custom control can be leveraged in its environment. The Tag Chooser lets us insert tags for HTML, ASP.NET 1.1, and other technologies as well. We see all of the standard ASP.NET 1.1 tags, so we can drop in a calendar control from this facility. We have to manually specify the ID – there is no automatic naming to avoid conflicts. The other properties can be set as well. Although Dreamweaver cannot easily create custom controls, it can still make use of them. To place our own custom control, we have to type it in; fortunately we can extend what the Code Hints understand about our control. By going to the Tag Library from the Edit menu, it gives us the opportunity to search for our own custom controls. Under the ASP.NET option, we can choose to import all ASP.NET custom tags. The tool searches through the site to find DLLs containing server controls. It has found our class, called ‘mycontrol,’ and put it into this tag library. All of the calendar’s properties are discovered. So this is the extent of what the Code Hints will be able to prescribe. The day header styles, previous styles other month-day style, and so forth. All of the things specific to a calendar are now on board. So let’s see what the Code Hints can do for us as we place the custom control on a page. It recognizes there is a namespace called MyCustomControls and a control called mycontrol. We have to put in the ID on our own, a property that it knows about; we also have to manually place the attribute ‘runat="server."’ Finally, we need to write the register directive at the top of the ASPX file. There is no automatic provision for this to be built out… With that, we’ve now placed a custom server control on our page. This can now be compiled and run.

Conclusion

This concludes our comparison of Dreamweaver 8 and Visual Studio 2005’s use of the Toolbox, Tag Library, and tag chooser.