How to enable design support in a custom control?

Question

I'll try to explain what I'm after. I don't know the technical term for it, so here goes:

Example 1: If I place a ListView on a Form and add some columns I am able, in Design-Time, to click-and-drag the columns to resize them.

Example 2: Now, I place a ListView in a UserControl and name it "MyCustomListView" (and perhaps add some method to enhance it somehow).

If I know place the "MyCustomListView" on a Form I am unable to click-and-drag the column headers to resize them in Design-Time.

Is there any way to easily make that happen? Some form of "pass the click-and-drag event to the underlying control and let that control do its magic" . Im not really looking to recode, just pass on the mouseclick (or whatever it is) and let the, in this case, ListView react as it did in the first example above.

Answer 1

The Windows Forms designer has dedicated designer classes for most controls. The designer for a ListView is System.Windows.Forms.Design.ListViewDesigner, an internal class in the System.Design.dll assembly. This class gives you the ability to drag the column headers.

A UserControl uses the System.Windows.Forms.Design.ControlDesigner designer class. It doesn't do anything special, just puts a rectangle around the control with drag handles. You can see where this is heading: after you put your user control on a form, it is ControlDesigner that is used to design the class, ListViewDesigner is not in the picture. You thus lose the ability to drag the column headers. Also note that ControlDesigner doesn't give access to the controls inside the UC.

That's fixable however by creating your own designer. Start with Projects + Add Reference, select System.Design. You'll need to add a public property to the UC to expose the list view and apply the [DesignerSerializationVisibility] attribute to allow changed properties to be saved. And apply the [Designer] attribute to the UC class to replace the default designer. It all should resemble this (using the default names and a ListView that displays "employees"):

using System;
using System.ComponentModel;
using System.Drawing;
using System.Windows.Forms;
using System.Windows.Forms.Design;   // Note: add reference required: System.Design.dll

namespace WindowsFormsApplication1 {
    [Designer(typeof(MyDesigner))]   // Note: custom designer
    public partial class UserControl1 : UserControl {
        public UserControl1() {
            InitializeComponent();
        }

        // Note: property added
        [DesignerSerializationVisibility(DesignerSerializationVisibility.Content)]
        public ListView Employees { get { return listView1; } }
    }

    // Note: custom designer class added
    class MyDesigner : ControlDesigner {
        public override void Initialize(IComponent comp) {
            base.Initialize(comp);
            var uc = (UserControl1)comp;
            EnableDesignMode(uc.Employees, "Employees");
        }
    }
}

The list view in the user control can now be clicked and designed as normal.