WebParts

WebParts to jeden z ciekawszych mechanizmów dostępnych w ASP.NET WebParts. Pozwala na uzyskanie bardzo ciekawych efektów podczas projektowania interfejsu użytkownika. Dodatkowo daje możliwość dostosowania go przez samego użytkownika.

Co można zaliczyć do WebPartsów? Ilość możliwości wykorzystania ich przy budowie strony zależy tylko od naszej wyobraźni. Niektóre z możliwych zastosowań:
- lista ostatnio dodanych artykułów na stronie
- kalendarz wyświetlający nadchodzące zdarzenia
- lista linków do ciekawych stron
- wyszukiwarka informacji na naszej stronie
- podgląd np. dwóch losowych zdjęć z naszej galerii
- prognoza pogody na nadchodzący dzień
- kursy walut
- notowania giełdowe
oraz wiele innych.

Aby korzystać z dobrodziejstw WebPartsów należałoby się najpierw przyjrzeć strukturze tworzącej szkielet mechanizmu:

WebPartManager - kontrolka wymagana na każdej stronie, która zawiera elementy WebParts. Kontrolka ta jest kontrolką niewizualną, tzn. nie pojawia się jako komponent który widać na stronie. Jej zadaniem jest udostępnienie metod oraz zapewnienie interfejsu działania dla WebPartów.

WebPart - klasa bazowa dla wszystkich WebPartów. Dziedzicząc po niej będziemy tworzyli nasze komponenty.

CatalogPart - zapewnia wizualną część nadzorowania komponentów na stronie. Najczęściej ograniczona do całej witrynie a nie pojedynczej strony.

PageCatalogPart - w działaniu komponent podobny do CatalogPart. Zadaniem kontrolki jest grupowanie komponentów przypisanych do pojedynczej strony (nie całej witryny). Dzięki kontrolce, jeżeli użytkownik zamknie jakiś WebPart, może go przywrócić na innej.

EditorPart - pozwala na modyfikowanie właściwości WebParta

DeclarativeCatalogPart - katalog przechowujący możliwe do dodania komponenty na stronę (lub witrynę)

WebPartZone - wyznacza miejsce gdzie można położyć WebParta

EditorZone - wyznacza miejsce gdzie można umieścić EditorPart

CatalogZone - wyznacza miejsce gdzie można umieścić kontrolkę CatalogPart

Aby można było używać WebPartsów wymagane jest zapisanie informacji o nich w bazie danych. Ma to główną zaletę w postaci zapamiętania układu WebPartsów użytych przez konkretnego użytkownika. Informacje te są standardowo zapisywane w bazie ASPNETDB. Możemy jednak w łatwy sposób przenieść zapis na inną bazę danych.



Tworzenie własnego WebParta
Własny WebPart możemy stworzyć na 3 sposoby:
1. Poprzez stworzenie kontrolki użytkownika - User Control
2. Dziedziczenie po istniejącej kontrolce (np. Labelu czy TextBoxie) 
3. Stworzenie własnej kontrolki Custom Control

Największe możliwości oferuje oczywiście 3 metoda. Jest ona jednak najbardziej pracochłonna. Postaram się więc omówić dwie pierwsze metody. Ostatnią możliwość stosujemy podobnie jak dwie pozostałe a nt. tworzenia własnych kontrolek pisałem już wcześniej artykuł na blogu. A więc zacznijmy.
Rozpoczynamy od stworzenia nowego projektu w Visual Studio. Następnie na formatkę kładziemy komponent WebPartManager. Nie ma on wizualnej postaci dla użytkownika, ale jak pisałem jest wymagany dla każdej strony korzystającej z WebPartsów:

Code:

<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
    CodeBehind="Default.aspx.cs" Inherits="WebApplication5._Default" %>

<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
    <asp:WebPartManager ID="WebPartManager1" runat="server">

    </asp:WebPartManager>
    <h2>
        Welcome to ASP.NET!
    </h2>
    <p>
        To learn more about ASP.NET visit <a href="http://www.asp.net" title="ASP.NET Website">www.asp.net</a>.
    </p>
    <p>
        You can also find <a href="http://go.microsoft.com/fwlink/?LinkID=152368&amp;clcid=0x409"
            title="MSDN ASP.NET Docs">documentation on ASP.NET at MSDN</a>.
    </p>
    
</asp:Content>

Kolejnymi elementami będą odpowiednie strefy do których użytkownik (jak i my) będziemy mogli dodawać WebParty.
Następnie na formę kładziemy WebPartZone czyli kontrolkę która służy do umieszczania w niej WebParta:

Code:

<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
    CodeBehind="Default.aspx.cs" Inherits="WebApplication5._Default" %>

<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
    <asp:WebPartManager ID="WebPartManager1" runat="server">

    </asp:WebPartManager>
    <h2>
        Welcome to My Page!
    </h2>
    <asp:WebPartZone ID="WebPartZone1" runat="server" Width="700" Height="500">
    </asp:WebPartZone>
    
</asp:Content>

Po skompilowaniu i uruchomieniu strony możemy otrzymać taki nieprzyjemny widok:

Jest to spowodowane brakiem zainstalowanego SQL Servera w wersji Express na naszej maszynie. Jeżeli tak jak i ja (osoby posiadające SQL Server Express podczas pierwszego uruchomienia mają udogodnienie w postaci automatycznego stworzenia pliku bazy danych) posiadacie inną wersję niż Express (np. Enterprise) należy wcześniej przygotować bazę danych.
W tym celu tworzymy nową pustą bazę danych:

Po stworzeniu bazy należy zintegrować ją z prowiderem odpowiedzialnym za presonalizację. Zrobić możemy to na dwa sposoby: za pomocą narzędzia graficznego jak i tekstowego. Narzędzie tekstowe daje dużo większe możliwości więc użyję go. Samego narzędzia nie będę omawiać, gdyż myślę iż już wystarczająco napisałem o nim w tym artykule. Samo wywołanie tworzące odpowiednią strukturę będzie miało następującą formę:

Następnie w pliku webconfig odpowiednio konfigurujemy sekcję odpowiedzialną za połączenie z bazą danych oraz WebPartami:

Code:

<?xml version="1.0"?>

<!--
  For more information on how to configure your ASP.NET application, please visit
  http://go.microsoft.com/fwlink/?LinkId=169433
  -->

<configuration>
  <connectionStrings>
      <add name="SQLConnString" connectionString="Data Source=localhost;Initial Catalog=test;Integrated Security=True" providerName="System.Data.SqlClient" />
  </connectionStrings>

  <system.web>
    <compilation debug="true" targetFramework="4.0" />

    <authentication mode="Forms">
      <forms loginUrl="~/Account/Login.aspx" timeout="2880" />
    </authentication>

    <membership>
      <providers>
        <clear/>
        <add name="AspNetSqlMembershipProvider" type="System.Web.Security.SqlMembershipProvider" connectionStringName="ApplicationServices"
             enablePasswordRetrieval="false" enablePasswordReset="true" requiresQuestionAndAnswer="false" requiresUniqueEmail="false"
             maxInvalidPasswordAttempts="5" minRequiredPasswordLength="6" minRequiredNonalphanumericCharacters="0" passwordAttemptWindow="10"
             applicationName="/" />
      </providers>
    </membership>

    <profile>
      <providers>
        <clear/>
        <add name="AspNetSqlProfileProvider" type="System.Web.Profile.SqlProfileProvider" connectionStringName="ApplicationServices" applicationName="/"/>
      </providers>
    </profile>

    <roleManager enabled="false">
      <providers>
        <clear/>
        <add name="AspNetSqlRoleProvider" type="System.Web.Security.SqlRoleProvider" connectionStringName="ApplicationServices" applicationName="/" />
        <add name="AspNetWindowsTokenRoleProvider" type="System.Web.Security.WindowsTokenRoleProvider" applicationName="/" />
      </providers>
    </roleManager>

    <webParts>
      <personalization defaultProvider="SqlPersonalizationProvider">
        <providers>
          <add name="SqlPersonalizationProvider" type="System.Web.UI.WebControls.WebParts.SqlPersonalizationProvider"
             connectionStringName="SQLConnString" applicationName="/" />
        </providers>
        <authorization>
          <deny users="*" verbs="enterSharedScope" />
          <allow users="*" verbs="modifyState" />
        </authorization>
      </personalization>
    </webParts>
  </system.web>
  
  <system.webServer>
     <modules runAllManagedModulesForAllRequests="true"/>
  </system.webServer>
</configuration>

Teraz po skompilowaniu i uruchomieniu programu powinniśmy zobaczyć:

Przechodzimy do dalszej części tworzenia naszego WebParta.

Tworzymy Web User Control która będzie mieć za zadanie wyświetlanie kalendarza użytkownikowi:

Następnie przeciągamy z Solution nowo stworzoną kontrolkę do strefy:

Następnie uruchamiamy stworzoną aplikację. Po załadowaniu aplikacji widzimy nasz dodatek:

Dodatek ma opcje takie jak możliwość jego minimalizacji oraz zamknięcia. Daje to możliwość użytkownikowi wybrania czy dany komponent chce widzieć czy też nie.

Przedstawione tutaj możliwości to podstawy tworzenia WebPartsów. Istnieje możliwość tworzenia kolekcji WebPartsów z których użytkownik wybierze te, które mu odpowiadają, przenoszenia komponentów pomiędzy odpowiednio wyznaczonymi obszarami strony, jak i możliwość dodawania nowych WebPartsów przez samych użytkowników.