Oct.28

Designtime support voor non-visual ASP.NET controls

Een non-visual control zoals bijvoorbeeld een objectdatasource is alsvolgt zichtbaar in designtime.
ObjectDataSourceDM.jpg
Dit soort gedrag is niet standaard voor non-visual controls. In onderstaande artikeltje wil ik uitleggen hoe je een custom non-visual control een eigen look geeft in design-time.

Een non-visual control maak je alsvolgt. We creeren een class en overerven van WebControl. Overerven van Control is beter maar dan is in design-time de control niet direct zichtbaar in de toolbox. Het is aan te raden na het vervolledigen van de control deze uiteindelijk gewoon te laten overerven van Control.

Als deze control op een ASP.NET pagina wordt geplaatst is hij echter niet zichtbaar. Nu is de (@runtime) non-visual control tijdens design-time ook non-visual en dat is nu net het gedrag dat aangepast zou moeten worden. De truuk is gebruik te maken van een designer. Een designer beschrijft o.a. het gedrag van een control in design-time.

Een simpele designer voor bovengenoemde control kan er alsvolgt uit zien:

    public class nvcontroldesigner : System.Web.UI.Design.ControlDesigner
    {
        public override string GetDesignTimeHtml()
        {
            System.Web.UI.Control c = (System.Web.UI.Control)Component;

            string html = "<div style="padding:2px; background-color: ButtonFace;color:ButtonText; " +
                "border-style:outset; border-width:1px; font: 8pt 'Tahoma';">" +
                "<b>" + c.GetType().Name + "</b> - " + c.ID;

            html += "</div>";

            return html;
        }        
    }

Voeg het volgende attribuut toe boven de nvcontrol class definitie:

[Designer(typeof(nvcontroldesigner))]

En voila:
nvcontrol1.jpg

Download de code nvcontrol.zip.