navigation page control, library extention for c# winforms

Here's a quick sketch of one way to go about the kind of interface you want:

1. Create a WinForm App with a Main Form named 'MainForm like this: [^].

a. add Three Panels as shown; none of them are Docked; they have their Anchor properties set so if the Form is re-sized they will re-size appropriately.

b. add a Button to the pnlMenu, 'btnInitialize, this will trigger the initial creation of the Views/UserControls as shown in the code.

2. add a Timer component to the Form, 'timer1. Set its 'Interval to 50ms.

3. Create a UserControl, 'ucType1Child1, size 560,508, background-color Alice-Blue. Put a TextBox on it, 'textBox1.

Code for the MainForm:

using System;
using System.Collections.Generic;
using System.Drawing;
using System.Linq;
using System.Windows.Forms;

namespace Dec12_PageSlider
{
    public partial class MainForm : Form
    {
        public MainForm()
        {
            InitializeComponent();
        }

        // keep track of the current and next views
        private ucType1Child1 currentUC;
        private ucType1Child1 nextUC;

        // keep track of link between Navigator Panel and Content Panel UserControl
        private Dictionary<Button, ucType1Child1> dctBtnToUc = new Dictionary<Button, ucType1Child1>();

        // the Button the user clicked in the Navigator Panel
        private Button clickedButton;

        private void btnInitialize_Click(object sender, EventArgs e)
        {
            // to play again: clear the current controls
            if (pnlContent.Controls.Count > 0)
            {
                pnlContent.Controls.Clear();
                dctBtnToUc.Clear();
            }

            // create #5 views for testing
            for (int i = 0; i < 5; i++)
            {
                // create the view
                ucType1Child1 uc1 = new ucType1Child1 {Anchor = AnchorStyles.None, Dock = DockStyle.None};
                
                // stick something in its TextBox to identify it for testing
                uc1.setText("View " + (i + 1));

                // add the new instance of the UserControl to the Content Panel
                pnlContent.Controls.Add(uc1);

                // position the new View/UserControl outside the Content Panel
                uc1.Left = -uc1.Width - 6;
                uc1.Top = 1;

                // create the Button for the Navigator Panel
                Button btn = new Button {BackColor = Color.GhostWhite, Text = string.Format("View {0}", (i+ 1).ToString())};
                
                // add the new instance of the Button to the Navigator Panel
                pnlNavigator.Controls.Add(btn);
                
                // position the Button
                btn.Left = 50;
                btn.Top = (i*65) + 26;

                // assign the Button's ClickHandler
                btn.Click += viewBtn_Click;

                // add the new entries to the Dictionary
                dctBtnToUc.Add(btn, uc1);

                // get started: slide-in the first UserControl
                dctBtnToUc.Keys.First().PerformClick();
            }
        }

        // note this Click EventHandler is assigned to every
        // View/UserControl created
        private void viewBtn_Click(object sender, EventArgs e)
        {
            // look up the associated View/UserControl
            nextUC = dctBtnToUc[sender as Button];

            // quit here if the view did not change
            if (currentUC == nextUC) return;

            // if you uncomment this, then the pnlContent background
            // will show for a moment before the animation begins
            //if (currentUC != null) currentUC.Left = -currentUC.Width - 6;

            // make sure the next View starts outside of the Content Panel
            // probably not needed ?
            if (nextUC.Left > 0) nextUC.Left = -nextUC.Width - 6;
            
            // bring it in front
            nextUC.BringToFront();
            
            // long live the new View !
            currentUC = nextUC;

            // start the animation
            timer1.Start();
        }

        private void timer1_Tick(object sender, EventArgs e)
        {
            currentUC.Left += 50;

            if (currentUC.Left >= 3)
            {
                timer1.Stop();
                currentUC.Left = 3;
            }
        }
    }
}

The UserControl, 'ucChild1Type1 is very simple:

using System.Windows.Forms;

namespace Dec12_PageSlider
{
    public partial class ucType1Child1 : UserControl
    {
        public ucType1Child1()
        {
            InitializeComponent();
        }

        public void setText(string text)
        {
            textBox1.Text = text;
        }
    }
}

Here's what it looks like running after 'button1 has been clicked and the five views are created: here I've just clicked on the 'View 5" Button and that view has scrolled into view in the Content Panel: [^].

Comments:

1. Of course, there are a lot of things here that would need to be worked out to go beyond just a prototype showing proof-of-concept.

2. all those hard-coded offsets for positioning would need to be transformed into calculated offsets.

3. the issue of re-sizing the view/usercontrol when the Form is re-sized is not addressed here, although that's not technically difficult.

Remember this is example is primarily meant be for educational purposes, the standards one would want for "production code" are not even attempted here.