[c# 初学-窗体] 设计一个可收缩的侧边导航栏

asiceeeee 2017-12-13 11:43:27

一个简单的窗体界面，左侧导航栏按钮可收缩，类似windows界面。
效果如下图，一时没找到上下箭头图标，以其他图标代替

初学者，欢迎各位前辈多多指教。

操作过程：
新建一个窗体应用程序
放入相应的button和picturebox控件、label控件,
一个imagelist控件，将需要用的图标放进去

双击picturebox控件，程序如下：



namespace WindowsFormsApplication2

{

    public partial class Form1 : Form

    {

       

        public Form1()

        {

            InitializeComponent();

        }

        bool k,l,m;//根据bool状态用if来确认打开还是收缩

        private void Form1_Load(object sender, EventArgs e)

        {

            

            pictureBox1.Image = imageList1.Images[0];//需要在窗体中为imageList1设置两幅用来切换的图片

            pictureBox2.Image = imageList1.Images[0];

            pictureBox3.Image = imageList1.Images[0];

            k = true;l = true;m = true;//设置标志位

        }

        int i = 80;//定义一个值对控件的高度进行递增递减，数值不要太小

        

        private void pictureBox1_Click(object sender, EventArgs e)

        {

            if (k == true)

            {

                pictureBox1.Visible = true;//可见状态

                button1.Visible = true;//可见状态

                label1.Visible = false;//不可见状态

                label2.Visible = false;//不可见状态

                pictureBox2.Top -= i;//控件提升至适当的高度

                button2.Top -= i;

                label3.Top -= i;

                label4.Top -= i;

                pictureBox3.Top -= i;

                button3.Top -= i;

                label5.Top -= i;

                label6.Top -= i;

                pictureBox1.Image = imageList1.Images[1];//切换图片

                k = false;//设置标志，方便if识别

            }



            else

            {

                pictureBox1.Visible = true;//可见状态

                button1.Visible = true;//可见状态

                label1.Visible = true;//可见状态

                label2.Visible = true;//可见状态

                pictureBox2.Top += i;//控件降低至适当的高度

                button2.Top += i;

                label3.Top += i;

                label4.Top += i;

                pictureBox3.Top += i;

                button3.Top += i;

                label5.Top += i;

                label6.Top += i;

                pictureBox1.Image = imageList1.Images[0];//切换图片

                k = true;//设置标志，方便if识别

            }

            }

        private void pictureBox2_Click(object sender, EventArgs e)

        {

            if (l == true)

            {

                pictureBox2.Visible = true;

                button2.Visible = true;

                label3.Visible = false;

                label4.Visible = false;

                pictureBox3.Top -= i;

                button3.Top -= i;

                label5.Top -= i;

                label6.Top -= i;

                pictureBox2.Image = imageList1.Images[1];

                l = false;

            }



            else

            {

                pictureBox2.Visible = true;

                button2.Visible = true;

                label3.Visible = true;

                label4.Visible = true;

                pictureBox3.Top += i;

                button3.Top += i;

                label5.Top += i;

                label6.Top += i;

                pictureBox2.Image = imageList1.Images[0];

                l = true;



            }

        }

    }

}