+1-888-365-2779
Try Now
More in this section

Forums / Developing with Sitefinity / Control Designer - Simple Example

Control Designer - Simple Example

8 posts, 0 answered
  1. Gabe Sumner
    Gabe Sumner avatar
    440 posts
    Registered:
    09 Sep 2007
    10 Oct 2007
    Link to this post
    I have created a simple Control and Control Designer as a learning exercise. 

    The control is called "Box" and has only 2 properties; CssStyle & Content.  The control simply displays the "Content" surrounded by a border.  The color of the border is determined by "CssStyle".  ("Color" would have been a better name for this property, but I don't feel like changing it right now.)

    The Control Designer presents a "friendly" way to change the 2 control properties.  The Control Designer also shows how to apply custom stylesheets to a Control Designer.

    The whole thing weighs in at 5 files.  You will also need to alter the "web.config" to include references to the Control and the Control Designer.  I provided an incomplete "web.config" file which, hopefully, will show how this is done.

    I'm making all of this available to everyone in the hope that it might help others who are learning about Custom Controls & Control Designers.  Here is where to download it:

    http://www.goondocks.com/Files/Sitefinity/ControlDesignerExample1.zip

    I would welcome any commentary on how this can be improved.  I'm still learning how to do this.

    Gabe
    =====================
  2. Nitin
    Nitin avatar
    51 posts
    Registered:
    14 Aug 2007
    10 Oct 2007
    Link to this post
    Gabe,

    Thats a good initiative.... I myself have thought of sharing some of my code with the community every once in a while. Inspecting the sample code is one of the best approaches to learn Sitefinity, in my opinion.

    I believe it will help the sitefinity community a lot if we can share our code through a common knowledge base. This proposed knowledge base can be hosted by Telerik and users will be able to post sample code/documentation in it - a la Wiki style...

    nG

  3. Gabe Sumner
    Gabe Sumner avatar
    440 posts
    Registered:
    09 Sep 2007
    10 Oct 2007
    Link to this post
    Thanks for the reply Nitin.  I agree that you can never have enough code samples.

    Here are a few general comments regarding Control Designers.

    - Having to manually load an "ascx" template and use "FindControl" methods to manipulate underlying controls is annoying.

    I think it would be really neat if we could utilize a regular ASP.NET UserControl for a Control Designer.  This would simplify the code quite a bit. 

    - Retrieving and setting underlying Control properties is terribly complicated.

    Consider the following line of code for retrieving the value for an underlying property:

    TypeDescriptor.GetProperties(base.DesignedControl).Find("Content", false).GetValue(base.DesignedControl).ToString()

    That's insane!  Furthermore, I have no idea how to set a property apart from masquerading my web controls through "base.PropertyUpdate".

    I propose commands similar to this:

    base.GetProperty("Content");
    base.SetProperty("Content", NewValue);

    I might be missing something though.  Are there easier methods of accomplishing any of this?

    Thanks,

    Gabe
    ===============
  4. Bob
    Bob avatar
    330 posts
    Registered:
    24 Sep 2012
    11 Oct 2007
    Link to this post
    Hi Gabe,

    Indeed, you are right. We should simplify the implementation of Control Designers and we will try to make it simpler for the next version.

    The base ControlDesigner class is intended to be used in class libraries and therefore it does not inherit form UserControl but from CompositeControl. Maybe we should provide another implementation that inherits from UserControl. However, there are some helper classes that you may find useful. I will explain them later.

    Let’s start with defining a designer for your control. A better way to specify designer for your control is by attribute at the class level:

    The web.config is an alternative method and it is provided to allow specifying designers for third party controls.

    Retrieving and setting the underlying control properties shouldn’t be so terribly complicated if you can reference the type of the control at compile time. In fact, designers are usually made for a particular control only and shouldn’t be a problem to cast DesignedControl property to the type of the control you are designing and retrieve and set values directly from its properties. Unfortunately, this is not as simple for User Controls as their assemblies are compiled dynamically and you can’t reference them until run time. So the workaround is to create a base class in App_Code inheriting from UserControl, expose the properties you need and then make your actual .ascx to inherit from your base class.

    Also I’d like to make a note about creating template controls. You should not instantiate the template directly in the current control. Instead, you should create a container for the template and instantiate in the container. Then you should set control properties and subscribe for the events you need and at the end you should add the container to the controls collection of the current control. The reason for that is because the current control is already added to the controls collection of the page and it is at certain stage of the page lifecycle. As you add controls to its collection, the controls will immediately try to catch-up and depending on the current stage, their events might be fired before you subscribe for them. In this particular case, this is not a problem because CreateChildControls method is called at the right moment but this is not necessarily always the case.

    We have provided a base class for container to make it easier to find controls within it. I have modified and attached the example so you can examine the changes.

    I hope this will be helpful for you.

    Sincerely yours,
    Bob
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  5. Kevin Pipher
    Kevin Pipher avatar
    91 posts
    Registered:
    30 Nov 2005
    04 Jan 2008
    Link to this post
    Just wanted to say thanks Gabe for posting a sample control and designer code. And thanks Bob for posting improvements to it. 

    I need to create a few basic controls for our users, and found the example code to be far more helpful than the sitefinity documentation.

    I do have one question for Telerik...  When editing a page in sitefinity, if you drop a Generic Content control on a page, it shows a default design (Blue background with "Generic Content" text) which helps the user understand what is on the interface. When I drop my custom control on the page in sitefinity, the control displays nothing as default (as expected).

    How do I add a custom default display for when the control is empty? I'm using the user control approach as discussed in this thread for my custom controls.

    Any guidance would be appreciated!

    Thanks,
    Kevin.
  6. iosmak
    iosmak avatar
    18 posts
    Registered:
    12 Oct 2006
    04 Jan 2008
    Link to this post
    Hi Kevin,

    I've wrote a blog post that I hope answers your question. You can find it here :
    http://blogs.sitefinity.com/Ivan/Post/08-01-04/tip_displaying_default_text_for_empty_controls.aspx

    Regards,
    Ivan
  7. Harish Subramanian
    Harish Subramanian avatar
    1 posts
    Registered:
    20 May 2010
    20 May 2010
    Link to this post
    Can you please share this code to me. i tried to access it from the link, i am not able to do it.

    I am trying to create something like this, I dont know where to start. Your solution will definitely help me.

    Thanks a lot.



  8. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    09 Dec 2016
    21 May 2010
    Link to this post
    Hi Harish Subramanian,

    Below is a sample code that illustrates the implementation that is valid for 3.7 versions

    public class ControlWithCustomDesigner : SimpleControl, IEmptyControl
    {
     
        public ControlWithCustomDesigner()
        {
        }
         
     
        protected override void CreateChildControls()
        {
     
            if (Page == null || DesignMode)
            {
     
                Label lblControlText = new Label();
                lblControlText.Text = this.ControlText;
                this.Controls.Add(lblControlText);
     
            }
            else
            {
              // show your data - you are not in edit mode
            }
        }
     
        
     
       
        public string ControlText
        {
            get
            {
                return this.controlText;
            }
            set
            {
                this.controlText = value;
            }
        }
     
         
     
     
        #region IEmptyControl Members
     
        public bool IsEmpty
        {
            get { return String.IsNullOrEmpty(this.ControlText); }
        }
     
        public string SetEmptyControlDefaultMessage()
        {
            return "Default Control Text";
        }
     
        #endregion
     
          private string controlText;
     
    }


    Sincerely yours,
    Ivan Dimitrov
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
Register for webinar
8 posts, 0 answered