在上一篇文章中,簡單實現了一個折疊菜單的面板,在這篇中將介紹實現子菜單的折疊與展開,其實實現的思路和之前的介紹是一樣的,也是通過改變Panel控件的尺寸實現。
首先,我們需要將上篇文章中構建的布局控件Panel替換成FlowLayoutPanel,因為Panel中的控件是層疊關系,而這是一個可以自動排列布局控件,當然也可以繼續用Panel,但需要將每個元素Panel中的控件的Dock屬性設置Top,這樣在改變面板中子元素的高度的時候,控件不會重疊,所以還是建議用FlowLayoutPanel更好寫。
然后,我們對有子元素的菜單進行改造下,用一個Panel包裹它的所有成員,並設置Panel的最大尺寸和最小尺寸,這里我為工作計划菜單項添加了三個子選項
剩下的就是在代碼中通過在時鍾事件中去改變Panel的高度值
private bool isPlanCollapse = false;//面板狀態(0折疊/1展開)
private void button6_Click(object sender, EventArgs e)
{
timer2.Start();
}
private void timer2_Tick(object sender, EventArgs e)
{
if (isPlanCollapse)
{
// panelPlanDropdown即工作計划菜單
this.panelPlanDropdown.Height -= 10;
if (this.panelPlanDropdown.Size==this.panelPlanDropdown.MinimumSize)
{
isPlanCollapse = !isPlanCollapse;
button6.Image = Resources.down_button_28px;
timer2.Stop();
}
}
else
{
this.panelPlanDropdown.Height += 10;
if (this.panelPlanDropdown.Size == this.panelPlanDropdown.MaximumSize)
{
isPlanCollapse = !isPlanCollapse;
button6.Image = Resources.slide_up_28px;
timer2.Stop();
}
}
}