Advertisment

Web Parts in ASP.NET 2.0 — Part 2

author-image
CIOL Bureau
Updated On
New Update

In the last section, I briefly explained the features of Web parts and how they will play a key role in the development of portals. I also went through a brief journey with some of the leading portals of the major players in the IT Industry and gave an introduction on how developing dynamic widgets a.k.a Portlets will be a key paradigm of the programming world. This article discusses how ASP.NET 2.0 is geared to meet the challenges of developing widgets for portals.



Various Web Parts Controls in ASP .Net



Let us have a deep look at the Web Parts Control provided in ASP.NET 2.0 and see the features that revolve around its functioning. The Web Parts control set consists of three fundamental building blocks: personalization capabilities, UI structural components required for using Web Parts UI controls on a page, and the Web Parts UI controls themselves.



Personalization:

Recall in the previous section, I told that the Website http://my.msn.com is seen only when you sign in and that means the Website is customized based on your login. Hence you will be able to add and remove controls, pages etc. Personalization enables users to modify--or personalize--the layout, appearance, and behavior of Web Parts controls on a page. The personalized settings are persisted not just during the current browser session (as with view state), but also in long-term storage, so that a user's settings are saved for future browser sessions as well. Personalization is enabled by default for Web Parts pages.

Advertisment


User Interface Structural Components

rely on personalization and provide the core structure and services needed by all Web Parts controls. There are 2 kinds of UI structural components required on every page.

Advertisment

WebPartManager

This control is never visible and this control has the critical task of coordinating all Web Parts controls on a page. It tracks all the individual Web Parts controls, manages Web Parts zones (rectangular regions that contain Web Parts controls on a page), and which controls are in which zones. It also tracks and controls the different display modes a page can be in, such as browse, design, edit, or catalog mode, and whether personalization changes apply to all users or to individual users. Finally, it initiates and tracks connections and communication between Web Parts controls.

ZoneManager

The second kind of UI structural component is the zone. Zones act as a layout manager. They contain and organize controls that derive from the Part class (part controls), and provide the ability to do modular page layout in either horizontal or vertical orientation. Zones also offer common and consistent UI elements (such as header and footer style, title, border style, action buttons, and so on) for each control they contain; these common elements are known as chrome. Several specialized types of zones are used in the different display modes and with various controls.
Advertisment


Web Parts User interface Controls

The Web Parts control set is flexible and inclusive in the options it gives you for creating part controls. In addition to creating your own custom Web Parts controls, you can also use existing ASP.NET server controls, user controls, or custom server controls, as Web Parts controls.

Advertisment

As described above, the ZoneManager consists of several controls, which we shall see now.



Essential Controls of Web Parts.

Since the Web Parts control set is extensive, only some controls are essential either because they are required for Web Parts to work, or they are the controls most frequently used on Web Parts pages. Some of the essential Web Parts for working with Web Parts pages are described in the following table.
Advertisment


Please note that most of the terms that you will see in the table below are all new in ASP.NET 2.0 and you might have difficulty in remembering the names and what they are used for. Don't worry about this. I will be developing a custom Website that will make use of the Web Parts control and when you see how they are used, you will get a clear idea of what their purpose is.



Advertisment












































WebPartManager



EditorZone



ConnectionsZone



CatalogZone



WebPartZone



WebPart



CatalogPart



Connection



EditorPart



AppearanceEditorPart



LayoutEditorPart



BehaviorEditorPart



PropertyGridEditorPart



WebPartPageMenu



 

I will now present a walk through where you will create a Website that makes use of the Web Parts control set to create a Web page so that you will be able to modify, or personalize. We will achieve the following tasks in this walkthrough.



  1. Adding Web Parts controls to a page.


  2. Creating a custom user control and using it as Web Parts control.


  3. Allow users to personalize the layout of the Web Parts controls on the page.


  4. Allow users to edit the appearance of a Web Parts control.


  5. Allow users to select from a catalog of available Web Parts controls.
  6. Advertisment

    Note: It is very important to note that in order to complete this walkthrough, the following criteria will have to be met.



    1. A site that can identify individual users. For the sake of simplicity we will make use of a Web site that is configured to use Windows Authentication.


    2. A visual design environment for creating Web pages. This walkthrough uses Visual Web Developer, which is included with Visual Studio .NET 2005 Beta 1.
    3. Note

      : As mentioned above when the site can identify the users, it reminds us that it is closely related to Personalization that we saw in a few sections back. There is nothing to be done to enable Web Parts personalization. By default, Personalization is enabled by default for the Web Parts control set. When you first run a Web Parts page on a site, ASP.NET sets up a default personalization provider to store user personalization settings. The default provider uses an Access database created in a subdirectory of your site's directory.



      Developing Widgets



      We will now create a simple page and show how to get started with developing widgets with the help of Web Part Control in ASP.NET 2.0 Beta 1.



      1. Start Visual Web Developer which is a part of Visual Studio .NET 2005 Beta 1.


      2. Click on File | New Website. Select ASP.NET Website from the available templates and Visual Basic as the programming language. Choose a file location for the site and then click OK. Remember that Visual Web Developer comes with its own virtual server and hence it is not necessary to use Internet Information Server like how it is used in ASP.NET Version 1.0 and 1.1.


      3.  







      4. The Website opens with the default settings and a page "default.aspx" is added to the site. Now rename the file "default.aspx" to "WebParts.aspx"


      5. Switch to Design view.


      6. Add a heading to the page. Let us say Web Parts Demonstration Page.


      7. From the WebParts tab of the toolbox, drag a WebPartManager control onto the page. Since the WebPartManager control does not render any output, so it appears as a grey box on the designer surface.






      8. Switch to Design view. Place the cursor after the WebPartManager control, and hit ENTER to add a line break.


      9. Now in the Layout menu, click Insert Table, and create a new table that has one row and three columns.


      10. Click the Cell Properties button, select top from the Vertical align drop-down list, then click OK, and click OK again to create the table.


      11. Drag a WebPartZone control into the left table column and set the following properties:


















      12. ID



        HeaderText



        SideBarZone



        SideBar



         



      13. Drag a second WebPartZone control into the middle table column and set the following properties:

















      ID



      HeaderText



      MainZone



      Main



       



      Now this page will have two distinct zones, which can be controlled separately. Since neither of the zones has any content, so we will have to create content for this zone. For simplicity and to show how to work with Web Parts we will use only static content. The same steps will apply to create dynamic content.





      The layout of the Web Parts zone is specified by a element. Any control can be placed inside the zone template and it is not restricted to just user defined controls but any ASP.NET control, whether it is a custom Web Parts control, a user control, or an existing server control. When a regular server control is placed in a WebPartZone, ASP.NET treats the control as a Web Parts control at run time, to give you Web Parts features on the control.



      Watch out for the next part of this article that discusses how to create

      content for a Web site.



      Disclaimer



      "Since this article was written when the technology .NET 2.0 is still in development, there is no guarantee that the features explained will be there in the final version and is subject to change. This article should be taken only for getting a general idea of what is going to be available in .NET 2.0 and not the actual features that will be a part of the final release of .NET 2.0"



      tech-news