Adding Auto Format for ASP.NET Custom Controls Design Time

Back to design time support, but this time with ASP.NET server controls, most complex & simple controls built in the .NET framework are associated with an Auto Format.. link in the smart tag as the one shown in the figure, I showed in a previous post how to add links and properties to the smart tag of a control.

autoLink  [more]

Ok, now when clicking that link a new window is popped out and you get a list of predefined formats on the left and a preview panel in the right like this.

AutoFormatWindow

Of course if you want to implement these features you will not have to design a new windows form and deal with all the head ache for previewing and those. You only will need some basic steps, I will show next, Assuming you already have your own custom control ( I will just use a simple LabelEx control for this sample);

1- Define your designer.

class LabelExDesigner : ControlDesigner
{

}

2- override the AutoFormats property and return some DesignerAutoFormats, to be used.

private DesignerAutoFormatCollection _autoformats = null;
public override DesignerAutoFormatCollection AutoFormats
{
    get
    {
        if (_autoformats == null)
        {
            _autoformats = new DesignerAutoFormatCollection();
            _autoformats.Add(new LabelExAutoFormat("Remove All"));
            _autoformats.Add(new LabelExAutoFormat("Reddish"));
            _autoformats.Add(new LabelExAutoFormat("Blueish"));
        }
        return _autoformats;
    }
}

3- Define a custom DesignerAutoFormat, which comes with an abstract Apply method, which is called when trying to apply a format on the preview control.

class LabelExAutoFormat : DesignerAutoFormat
{
    public LabelExAutoFormat(string name)
        : base(name)
    { }
    public override void Apply(Control control)
    {
        if (control is LabelEx)
        {
            LabelEx ctrl = control as LabelEx;
            switch (this.Name)
            {
                case "Remove All":
                    ctrl.ControlStyle.Reset();
                    break;
                case "Reddish":
                    ctrl.ControlStyle.ForeColor = ColorTranslator.FromHtml("#ff0000");
                    ctrl.ControlStyle.BackColor = ColorTranslator.FromHtml("#ffccff");
                    ctrl.ControlStyle.Font.Bold = true;
                    break;
                case "Blueish":
                    ctrl.ControlStyle.ForeColor = ColorTranslator.FromHtml("#0000ff");
                    ctrl.ControlStyle.BackColor = ColorTranslator.FromHtml("#99ccff");
                    ctrl.ControlStyle.Font.Italic = true;
                    break;
            }
        }
    }
}

4- And don’t forget to decorate the control with the designer attribute

[Designer(typeof(LabelExDesigner))]
public class LabelEx : Label
{ 
}

And now everything is set and you have your own auto formats.

Default format reddish auto format Blueish auto format

Here is the code and Happy Coding…

This entry was posted in Design Time Support. Bookmark the permalink.

3 Responses to Adding Auto Format for ASP.NET Custom Controls Design Time

  1. Muhammad Mosa says:

    I didn’t know it is that easy Amr. Cool one!

  2. ali gardali says:

    its very good so i say thxxxxxxxxxxxxxxxxxxxxxxx for ho make this website

  3. Spielzeug says:

    Impressive – I didn´t thought about this, because I was sure it´ll be complicated. Thanks for clarifying this

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>