C# WinForms: Make panel scrollbar invisible

Question

I have a panel1 with AutoScroll = true.I have to make panel1 scroll with btnUp and btnDown. So far I've made what I was asked for

private void btnUpClicked(Object sender, EventArgs e)
{
    if (panel1.VerticalScroll.Value - 55 > 0)
        panel1.VerticalScroll.Value -= 55;
    else  panel1.VerticalScroll.Value = 0;
}

private void btnDownClicked(Object sender, EventArgs e)
{
    panel1.VerticalScroll.Value += 55;
}

But now I need to hide Scrollbar or make it invisible. I tried

panel1.VerticalScroll.Visible = false;

but it doesn't work. Any ideas guys?

Answer 1

Ok, I've done the working example of this for you. All you have to do is to change the max value depending on the total size of all the items inside your panel.

---

Form code:

public partial class Form1 : Form
{
    private int location = 0;

    public Form1()
    {
        InitializeComponent();

        // Set position on top of your panel
        pnlPanel.AutoScrollPosition = new Point(0, 0);

        // Set maximum position of your panel beyond the point your panel items reach.
        // You'll have to change this size depending on the total size of items for your case.
        pnlPanel.VerticalScroll.Maximum = 280;
    }

    private void btnUp_Click(object sender, EventArgs e)
    {
        if (location - 20 > 0)
        {
            location -= 20;
            pnlPanel.VerticalScroll.Value = location;
        }
        else
        {
            // If scroll position is below 0 set the position to 0 (MIN)
            location = 0;
            pnlPanel.AutoScrollPosition = new Point(0, location);
        }
    }

    private void btnDown_Click(object sender, EventArgs e)
    {
        if (location + 20 < pnlPanel.VerticalScroll.Maximum)
        {
            location += 20;
            pnlPanel.VerticalScroll.Value = location;
        }
        else
        {
            // If scroll position is above 280 set the position to 280 (MAX)
            location = pnlPanel.VerticalScroll.Maximum;
            pnlPanel.AutoScrollPosition = new Point(0, location);
        }
    }
}

---

Picture example:

You have to set AutoScroll option to False on your panel. I hope you understand what I've done and will get your panel running the way you want. Feel free to ask if you have any questions.

Answer 2

The Panel control takes on the duty you gave it by setting AutoScroll to true pretty serious. This always includes displaying the scrollbar gadget if it is necessary. So what you tried cannot work, hiding the vertical scrollbar forces Panel to recalculate layout since doing so altered the client area. It will of course discover that the scrollbar is required and promptly make it visible again.

The code that does this, Panel inherits it from ScrollableControl, is internal and cannot be overridden. This was intentional.

So using AutoScroll isn't going to get you anywhere. As an alternative, do keep in mind what you really want to accomplish. You simply want to move controls up and down. Easy to do, just change their Location property. That in turn is easiest to do if you put the controls on another panel, big enough to contain them. Set its AutoSize property to True. And implement you buttons' Click event handlers by simply changing that panel's Location property:

private const int ScrollIncrement = 10;

private void ScrollUpButton_Click(object sender, EventArgs e) {
    int limit = 0;
    panel2.Location = new Point(0, 
        Math.Min(limit, panel2.Location.Y + ScrollIncrement));
}

private void ScrollDownButton_Click(object sender, EventArgs e) {
    int limit = panel1.ClientSize.Height - panel2.Height;
    panel2.Location = new Point(0, 
        Math.Max(limit, panel2.Location.Y - ScrollIncrement));
}

Where panel1 is the outer panel and panel2 is the inner one that contains the controls. Be careful when you use the designer to put controls on it, it has a knack for giving them the wrong Parent. Be sure to use the View + Other Windows + Document Layout helper window so you can see this going wrong. After you filled it, set its AutoSizeMode property to GrowAndShrink so it snaps to its minimum size.