Blog Stats
  • Posts - 171
  • Articles - 1
  • Comments - 197
  • Trackbacks - 5

 

Un controllo MultiView migliore...

Passando ad asp.net 2.0 la prima cosa che si fà è quella di verificare quali dei controlli custom realizzati con la 1.1 possono essere degnamente sostituiti con i nuovi controlli.

Oggi mi è capitato tra le mani il controllo MultiView.

Questo controllo è molto semplice e funziona come un contenitore di viste differenti(controlli View) che possono essere attivate e quindi visualizzate uno alla volta.
Ciascuna vista è un controllo di tipo View che contiene i tag html e i controlli server che disegnano ciascuna specifica vista.

<asp:MultiView runat="server" ID="multiView" ActiveViewIndex="0">
  <asp:View runat="server" ID="view1">
    ...qui html e controlli server...
  </asp:View>
  <asp:View runat="server" ID="view2">
    ...qui html e controlli server...
  </asp:View>
</asp:MultiView>

Un controllo del genere puo essere utile in molti casi ma per funzionare è necessario del lavoro extra(controlli + codice) per poter gestire il passaggio da un tab all'altro.
Una prima e importante estensione a questo controllo è quella di trasformarlo in una forma semplice di "TabStrip", ossia un controllo che visualizzi in automatico le "tab" per ciascuna vista, con la possibilità di cliccarci sopra per passare da una vista all'altra, il tutto mantenendo lo stato delle viste non attive.

In pratica la logica di attivazione/visualizzazione delle View rimane inalterata e cosi anche il rendering del contenuto di ciascuna vista.
E' invece stato aggiunto il disegno delle tab con relativo evento di postback per "switchare" sulla vista selezionata.

Come sempre reflector mi è stato di grande aiuto in quanto ho potuto scoprire come nella logica di gestione degli eventi del MultiView(precisamente nell'evento OnBubbleEvent) vi sia cablato il sistema per passare da una View all'altra in automatico.
Quindi, sfruttando questo meccanismo già esistente, sono bastate poche righe di codice per far funzionare il tutto.

public class TabStrip : System.Web.UI.WebControls.MultiView, IPostBackEventHandler
{
 
public override void RenderControl(HtmlTextWriter writer)
  {
    // Tabs rendering
    foreach (View baseView in base.Views)
    {
       TabStripView view = baseView as TabStripView;
       if (view == null)
      {
        throw new HttpParseException("Wrong view type, use TabStripView!");
      }

      writer.AddAttribute(HtmlTextWriterAttribute.Href, this.Page.ClientScript.GetPostBackClientHyperlink(this, view.ID));
      writer.RenderBeginTag(
HtmlTextWriterTag.A);
      writer.Write(view.Text);
      writer.RenderEndTag();

      if (base.Views.IndexOf(baseView) < base.Views.Count - 1)
      {
        writer.Write(
"&nbsp;");
      }
    }

   
writer.WriteBreak();

    // Active view rendering
    base.RenderControl(writer);
 
}

  public void RaisePostBackEvent(string eventArgument)
  {
   
CommandEventArgs args = new CommandEventArgs(MultiView.SwitchViewByIDCommandName, eventArgument);
   
this.OnBubbleEvent(this, args);
  }

}

public class TabStripView : System.Web.UI.WebControls.View
{
 
public string Text
  {
    get
    {
      return (string)base.ViewState["text"];
    }
    set
    {
      base.ViewState["text"] = value;
    }
  }
}

Nella pagina aspx lo usero' cosi :

<my:TabStrip runat="server" ID="tabStrip" ActiveViewIndex="0">
  <my:TabStripView runat="server" ID="tab1" Text="TAB1" >
    ...place here html and server controls...
  </my:TabStripView >
  <my:TabStripView runat="server" ID="tab2" Text="TAB2" >
    ...place here html and server controls...
  </my:TabStripView >
</my:TabStrip >

Ovviamente questo è solo il punto di partenza dalla quale si puo'comunque facilmente estendere le funzionalità e l'aspetto grafico del nostro nuovo controllo TabStrip.


Feedback

# re: Un controllo MultiView migliore...

Gravatar Veramente molto utile! 22/01/2008 16:16 | Wamba

Comments have been closed on this topic.
 

 

Copyright © Luca Mauri