Expand and collapse winform

Question

What I am trying to do is expand and collapse the middle of my winform. I know there are similar questions here but none of them really do what I need. I have read about using a FlowLayoutPanel but I can't get it to work.

An example of what I want to achieve is:

I have my winform (example)

When I click button1 it should hide the textbox in the middle and shrink the form to hide the space, and vice versa when I click button2. Either way, button3 should remain below where the textbox is or isn't shown.

My attempts so far either just hide the textbox and do nothing with the form or shrink a lot more than it should. I have currently been setting AutoSize to true and AutoSizeMode to GrowAndShrink.

I have seen controls that can do this or similar but they have arrows or little buttons to expand the form, I just need the button to do this.

Is there an easy way to do this?

Any help appreciated.

Update

I have tried setting the height to 0 and hiding the textbox as suggested but it just collapses the right side of the form instead of the middle.

Answer 1

I know, I am late to the game but since I just solved the same issue I wanted to provide you with my solution:

As you mentioned already, you can use FlowLayoutPanel to do the job. Just put it into your form. Set the FlowDirection to TopDown and add your buttons and textbox in the right order. When done, set the AutoSize of the form and the FlowLayoutPanel to true and set the AutoSizeMode to GrowAndShrink.

Prevent the width to collapse when autosize on

Your problem is, that if you set the AutoSize to true and disable/hide your textbox, the width is going to be reduced. This happens because your textbox is the widest control on your form and if it is hidden, the width is reduced to the width required by the remaining controls. To prevent this happening, just put your buttons into a panel control of the same width as your textbox. Now if your textbox is hidden, the width will remain as wide as required.

Using checkbox to expand/collapse

Instead of using two buttons, I like using a checkbox to expand/collapse. The whole coding for resizing will be reduced to adding one binding line of the checkbox1.Checked property to the Visibility property of the textbox:

textbox1.DataBindings.Add("Visible", checkbox1, "Checked")

Answer 2

You need to store the original height of the form in a variable so that you can restore it later when you expand it again. Also, if you anchor Button3 to the bottom, you wouldn't have to handle it during the resize:

public partial class Form1 : Form {
  private int originalHeight;

  public Form1() {
    InitializeComponent();
    button3.Anchor = AnchorStyles.Left | AnchorStyles.Bottom;
  }

  protected override void OnLoad(EventArgs e) {
    originalHeight = this.Height;
    base.OnLoad(e);
  }

  private void button1_Click(object sender, EventArgs e) {
    textBox1.Visible = false;
    this.Height = originalHeight - textBox1.Height;
  }

  private void button2_Click(object sender, EventArgs e) {
    this.Height = originalHeight;
    textBox1.Visible = true;
  }
}

Leave the AutoSize=false; on the form since you are handling the resize yourself.

I would consider using one button to handle the toggling of the form since Button2 is rather useless when the form is expanded and vice-versa, Button1 is rather useless if the form is collapsed.