C#控件交互效果类（也可以用作缩小面板放大，展示更多信息）

本文全部自创，未借鉴任何一篇博客，如需引用请注明网址哦 https://www.cnblogs.com/ningxinjie/p/12158572.html

具体代码如下 by 程序杰杰

   #region 控件变大效果 nxj
        private async void MouseIn(int pxNum, int count)
        {
            bool fuwei = false;
            for (int i = 0; i < count; i++)
            {
                if (this.button1.Width > widthYS + count * pxNum) { fuwei = true; }
                if (button1.Height > heightYS + count * pxNum) { fuwei = true; }
                if (button1.Location.X < PointxYS - (count * pxNum) / 2) { fuwei = true; }//因为x与y同步变化，因此只判断任何一个就可以
                if (fuwei)
                {
                    this.button1.Width = widthYS + count * pxNum;
                    button1.Height = heightYS + count * pxNum;
                    button1.Location = new Point(PointxYS - (count * pxNum) / 2, PointyYS - (count * pxNum) / 2);
                    return;
                }
                await Task.Delay(30);
                this.button1.Width += 2 * pxNum;
                this.button1.Height += 2 * pxNum;
                this.button1.Location = new Point(this.button1.Location.X - pxNum, this.button1.Location.Y - pxNum);
            }
        }
        #endregion
        #region 控件变小，还原 nxj
        private async void MouseOut(int pxNum, int count)
        {
            bool fuwei = false;
            for (int i = 0; i < count; i++)
            {
                //在加个变量，判断是否已经进入任何一个，如果进入任何一个就全部设置，不要这样判断一个就写一个，然后跳出循环，结束
                if (this.button1.Width < widthYS) { fuwei = true; }
                if (button1.Height < heightYS) { fuwei = true; }
                if (button1.Location.X > PointxYS) { fuwei = true; }//因为x与y同步变化，因此只判断任何一个就可以
                if (fuwei)
                {
                    this.button1.Width = widthYS;
                    button1.Height = heightYS;
                    button1.Location = new Point(PointxYS, PointyYS);
                    return;
                }
                await Task.Delay(30);
                this.button1.Width -= 2* pxNum;
                this.button1.Height -= 2* pxNum;
                this.button1.Location = new Point(this.button1.Location.X + pxNum, this.button1.Location.Y + pxNum);
            }
        }
        #endregion

使用代码如下

上述程序原始为：

鼠标放上后：

==============================================================================================

 对于图标缩小，我使用timer来实现。因为timer开启时，需要先走interval，因此需要给一个初始化，完成更好的交互效果

   #region 原始大小记录
        int widthYS;
        int heightYS;
        int pointX;
        int pointY;
        #endregion

        private void Form1_Load(object sender, EventArgs e)
        {
            widthYS = pictureBox1.Width;
            heightYS = pictureBox1.Height;
            pointX = pictureBox1.Location.X;
            pointY = pictureBox1.Location.Y;
        }

  #region nxj 辅助方法
        //图片变大
        private void SetPictureBigger()
        {
            pictureBox1.Width = widthYS + 20;
            pictureBox1.Height = heightYS + 20;
            pictureBox1.Location = new Point(pointX - 10, pointY - 10);
        }
        private async void SetPictureSmallerLittleByLittle()
        {
            for (int i = 0; i < 10; i++)
            {
                await Task.Delay(30);
                pictureBox1.Width -= 2;
                pictureBox1.Height -= 2;
                pictureBox1.Location = new Point(pictureBox1.Location.X + 1, pictureBox1.Location.Y + 1);
                if (pictureBox1.Width < widthYS || pictureBox1.Height < heightYS || pictureBox1.Location.X > pointX || pictureBox1.Location.Y > pointY)
                {
                    pictureBox1.Width = widthYS; pictureBox1.Height = heightYS; pictureBox1.Location = new Point(pointX, pointY);
                    break;
                }
            }

        }
        #endregion

 private  void timer1_Tick(object sender, EventArgs e)
        {
            SetPictureBigger();
            SetPictureSmallerLittleByLittle();
        }

 private void pictureBox1_MouseMove(object sender, MouseEventArgs e)
        {
            if (timer1.Enabled == false)
            {
                #region 初始化
                SetPictureBigger();
                SetPictureSmallerLittleByLittle();
                #endregion
                timer1.Enabled = true;
            }
        }

        private void pictureBox1_MouseLeave(object sender, EventArgs e)
        {
            timer1.Enabled = false;
        }

原始的大小与上图左边一致，当鼠标放进去的时候，它就会像一个动态图一样不断缩小(timer的interval我设置1500),鼠标移出timer关闭，但是timer未执行完的后续方法仍会执行，因此没有任何问题

=================================================================================================

这个放大缩小的作为鼠标放上移出交互效果为做好，如果界面显示的不够，我们需要一个面板来装其余的东西，但是暂时不要显示出来，等待用户需要查看的时候再显示出来，这样示例如图：

 

   bool panelDown = true;
        bool panelTwiceClick = false;
        private async void panelShow()
        {
            if(panelDown)
            {
                if(panelTwiceClick)
                {
                    panelTwiceClick = false;
                    return;
                }
              
                this.label1.Text = "☆☆↑收起↑☆☆";
                for (int i = 0; i < 10; i++)
                {
                    panelTwiceClick = true;
                    this.panel1.Height += 20;
                    await Task.Delay(30);
                }
                panelTwiceClick = false;
                panelDown = false;
            }
            else
            {
                if (panelTwiceClick)
                {
                    panelTwiceClick = false;
                    return;
                }
                this.label1.Text= "☆☆↓展开↓☆☆";
                for (int i = 0; i < 10; i++)
                {
                    panelTwiceClick = true;
                    this.panel1.Height -= 20;
                    await Task.Delay(30);
                }
                panelTwiceClick = false;
                panelDown = true;
            }
           
        }

在以上的两个效果中，程序杰杰充分考虑到了一次按钮快速点击多次可能会出现的异常。

按钮交互中的程序允许用户在还未完全执行完一个方法时，触发另一个方法，它会从停止的那一刻开始往回执行

面板的这个程序写出来的效果是即使点击多次，也将无效，必须等待我一个方法执行完，才可以执行另一个(展开/合起)

无论哪种，无论怎么点击，都不会报错出来，这样才算基本达成了目的。

改进面板，上述面板只要不在30毫秒内点击两次，是不会有任何问题的，下面给出一种完善一些的改进和代码

我增加一个button作为显示，界面panel直接显示出来一点点，如图

 

 这样点击的随着移动，就不可能出现任何问题了，代码如下

 private void Form1_Load(object sender, EventArgs e)
        {
            panel1.BringToFront();//显示在最顶端
            #region 做个测试，让datagraidview中有值，方便看效果
            //DataTable dt = new DataTable();
            //dt.Columns.Add("pro1");
            //DataRow dr = dt.NewRow();
            //dr["pro1"] = "lala";
            //dt.Rows.Add(dr);
            dataGridView1.AutoSizeColumnsMode = DataGridViewAutoSizeColumnsMode.Fill;
            for (int i = 0; i < 20; i++)
            {
                dataGridView1.Rows.Add();
                dataGridView1.Rows[i].Cells["pro1"].Value = "测试" + i;
            }
            #endregion
            panel1.Height = 2;
            SetButtonCenter();
        }

        //设置按钮一直水平居中窗体显示
        private void SetButtonCenter()
        {
            int formWidth = this.Width;
            button1.Location= new Point((formWidth / 2) - (button1.Width / 2), 2);
        }

        private void Form1_Resize(object sender, EventArgs e)
        {
            SetButtonCenter();
        }

        bool panelDown = true;
        bool panelTwiceClick = false;
        private async void button1_Click(object sender, EventArgs e)
        {
            if (panelDown)
            {
                if (panelTwiceClick)
                {
                    panelTwiceClick = false;
                    return;
                }
                this.button1.Text = "☆☆↑收起↑☆☆";
                for (int i = 0; i < 10; i++)
                {
                    panelTwiceClick = true;
                    this.panel1.Height += 20;
                    if (this.panel1.Height > 202)//以防30毫秒内点击两次
                    {
                        this.panel1.Height = 202;
                    }
                    button1.Location = new Point((Width / 2) - (button1.Width / 2), this.panel1.Height);
                    await Task.Delay(30);
                }
                
                panelTwiceClick = false;
                panelDown = false;
            }
            else
            {
                if (panelTwiceClick)
                {
                    panelTwiceClick = false;
                    return;
                }
                this.button1.Text = "☆☆↓展开↓☆☆";
                for (int i = 0; i < 10; i++)
                {
                    panelTwiceClick = true;
                    this.panel1.Height -= 20;
                    if (this.panel1.Height < 2)//以防30毫秒内点击两次
                    {
                        this.panel1.Height = 2;
                    }
                    button1.Location = new Point((Width / 2) - (button1.Width / 2), this.panel1.Height);
                    await Task.Delay(30);
                }
                
                panelTwiceClick = false;
                panelDown = true;
            }
        }

 具体优化按钮显示成圆角啊之类的，到时候需要的时间，简单一做就可以了，就此这些小效果，就可以啦~