C# Winform and developing custom control with design time support

Question

Here i have developed a user control for pagination. it is working fine. now i have decided to put the whole code in custom control template with design time support.

i want when user drag that control onto form then some button should be shown with navigation images. how to have the design time UI?

here is my code. please tell me how to convert my code for custom control where design time UI will be there like with some buttons for pagers.

    public partial class ButtonPager : UserControl  
    {  
        int PageSize = 5;  
  
        public event EventHandler<PageChangedEventArgs> PageChanged;  
  
  
        public ButtonPager()  
        {  
            InitializeComponent();  
        }  
  
        public void BindPager(int recordCount, int currentPage)  
        {  
            List<Page> pages = new List<Page>();  
            int startIndex, endIndex;  
            int pagerSpan = 5;  
  
            //Calculate the Start and End Index of pages to be displayed.  
            double dblPageCount = (double)((decimal)recordCount / Convert.ToDecimal(PageSize));  
            int pageCount = (int)Math.Ceiling(dblPageCount);  
            startIndex = currentPage > 1 && currentPage + pagerSpan - 1 < pagerSpan ? currentPage : 1;  
            endIndex = pageCount > pagerSpan ? pagerSpan : pageCount;  
            if (currentPage > pagerSpan % 2)  
            {  
                if (currentPage == 2)  
                {  
                    endIndex = 5;  
                }  
                else  
                {  
                    endIndex = currentPage + 2;  
                }  
            }  
            else  
            {  
                endIndex = (pagerSpan - currentPage) + 1;  
            }  
  
            if (endIndex - (pagerSpan - 1) > startIndex)  
            {  
                startIndex = endIndex - (pagerSpan - 1);  
            }  
  
            if (endIndex > pageCount)  
            {  
                endIndex = pageCount;  
                startIndex = ((endIndex - pagerSpan) + 1) > 0 ? (endIndex - pagerSpan) + 1 : 1;  
            }  
  
            //Add the First Page Button.  
            if (currentPage > 1)  
            {  
                //char c = '\u23EA';  
                pages.Add(new Page { Text = "<<", Value = "1" });  
                //pages.Add(new Page { Text = c.ToString(), Value = "1" });  
            }  
  
            //Add the Previous Button.  
            if (currentPage > 1)  
            {  
                //char c = '\u25C0';  
                pages.Add(new Page { Text = "<", Value = (currentPage - 1).ToString() });  
            }  
  
            for (int i = startIndex; i <= endIndex; i++)  
            {  
                pages.Add(new Page { Text = i.ToString(), Value = i.ToString(), Selected = i == currentPage });  
            }  
  
            //Add the Next Button.  
            if (currentPage < pageCount)  
            {  
                //char c = '\u25B6';  
                pages.Add(new Page { Text =">", Value = (currentPage + 1).ToString() });  
            }  
  
            //Add the Last Button.  
            if (currentPage != pageCount)  
            {  
                //char c = '\u23E9';  
                pages.Add(new Page { Text = ">>", Value = pageCount.ToString() });  
            }  
  
            //Clear existing Pager Buttons.  
            pnlPager.Controls.Clear();  
  
            //Loop and add Buttons for Pager.  
            int count = 0;  
            foreach (Page page in pages)  
            {  
                Button btnPage = new Button();  
                btnPage.Location = new System.Drawing.Point(38 * count, 5);  
                btnPage.Size = new System.Drawing.Size(35, 20);  
                btnPage.Name = page.Value;  
                btnPage.ImageList = imageList1;  
                if (page.Text=="<<")  
                {  
                    btnPage.ImageIndex = 0;  
                }  
                else if (page.Text == "<")  
                {  
                    btnPage.ImageIndex = 1;  
                }  
                else if (page.Text == ">")  
                {  
                    btnPage.ImageIndex = 2;  
                }  
                else if (page.Text == ">>")  
                {  
                    btnPage.ImageIndex = 3;  
                }  
                else  
                {  
                    btnPage.Text = page.Text;  
                }  
                 
                btnPage.Enabled = !page.Selected;  
                btnPage.Click += new System.EventHandler(this.Page_Click);  
                pnlPager.Controls.Add(btnPage);  
                count++;  
            }  
  
        }  
  
        private void Page_Click(object sender, EventArgs e)  
        {  
            Button btnPager = (sender as Button);  
            if (this.PageChanged != null)  
                this.PageChanged(this, new PageChangedEventArgs(Convert.ToInt32(btnPager.Name)));  
        }  
    }  
  
    public class PageChangedEventArgs : EventArgs  
    {  
        public PageChangedEventArgs(int id)  
        {  
            CurrentPage = id;  
        }  
  
        public int CurrentPage { get; private set; }  
    }  
  
    class Page  
    {  
        public string Text { get; set; }  
        public string Value { get; set; }  
        public bool Selected { get; set; }  
    }  

Can i declare these classes PageChangedEventArgs & Page with in ButtonPager class ?

what code i need to add as a result when user drag drop the custom control onto form then initially few pagination buttons will be show at design time.

what is the meaning of these below attributes
Category("Flash"),
Description("The ending color of the bar.")
[Browsable(true), EditorBrowsable(EditorBrowsableState.Always), Bindable(true)]
[DesignerSerializationVisibility(DesignerSerializationVisibility.Visible)]
[Editor]

https://learn.microsoft.com/en-us/dotnet/desktop/winforms/controls/attributes-in-windows-forms-controls?view=netframeworkdesktop-4.8

please guide me. Thanks

Answer 1

To support design time in Winforms you're going to need to define some additional types to support the designer itself. At a minimum you'll likely want a custom ControlDesigner which is responsible for reacting to the designer. To apply this to your custom control you'll have to use the DesignerAttribute.

For design time data support you'll want to rely on the DesignMode base property that tells you when you're in design mode or not. For example your control may display some dummy data while in the designer so the user can get an idea of what it might look like at runtime. That is what this property is for. This is how you'd solve the pagination thing if your control supports pagination. But for more advanced functionality the control designer is the way to go.

Refer to the links given for examples of how to do all this plus a link to the larger documentation on winforms designer support.