Winform GDI+绘图二：绘制旋转太极图

大家好，今天有时间给大家带来Winform自绘控件的第二部分，也是比较有意思的一个控件：旋转太极图。

大家可以停下思考一下，如果让你来绘制旋转的太极图，大家有什么样的思路呢？我今天跟大家展示一下，我平时绘制所用的思路，还请各位不吝赐教。

其实连续的动画效果，微观上去看，就是将这连续的时间切成一小段一小段，太极图只要在每一小段时间移动一定角度。那么在宏观上看将会是连续的动画。所以整体的思路就有了：

在每一小段的时间将，改变绘制起始角度，触发控件重绘，就可以形成连续的动画效果。因为是围绕控件中心进行旋转，所以要使用TranslateTransform函数，将原点移至控件中心位置，代码如下图：

   g.TranslateTransform(Width / , Width / );

在绘制太极之前，先将画布旋转一定角度，angle是一个变量，这样当我定时去改变angle时，太极图将会先旋转到不同的位置，再进行绘制：

 g.RotateTransform(angle);

在绘制完成之后，将画图原点移到左上角：

g.TranslateTransform(-Width / , -Width / );

定时改变angle的任务就交给Timer定时器即可：

   private void timer1_Tick(object sender, EventArgs e)
        {
            if (rotateSpeed != )
            {
                angle += (int)(rotateSpeed * 360f / Math.PI/);
                if (angle >=)
                    angle -= ;
                if (angle <= -)
                    angle += ;
            }
            Invalidate();
        }

控件的onpaint方法：

 protected override void OnPaint(PaintEventArgs e)
        {
            Graphics g = e.Graphics;
            g.SmoothingMode = SmoothingMode.HighQuality;
            g.TextRenderingHint = TextRenderingHint.ClearTypeGridFit;
            g.TranslateTransform(Width / , Width / );
            g.RotateTransform(angle);
            //绘制黑色部分
            using (GraphicsPath path = new GraphicsPath())
            {
                path.AddArc(-Width/, -Width/, Width, Width, , );
                path.AddArc(-Width/, -Width / , Width / , Width / , , -);
                path.AddArc(, -Width / , Width / , Width / , , );
                g.FillPath(Brushes.Black, path);
                g.FillPie(Brushes.White, new Rectangle(Width *  / -Width/, Width *  / -Width/, Width *  / , Width *  / ), , );
            }
            //绘制白色部分
            using (GraphicsPath path = new GraphicsPath())
            {
                path.AddArc(-Width / , -Width / , Width, Width, , -);
                path.AddArc(-Width / , -Width / , Width / , Width / , , -);
                path.AddArc(, -Width / , Width / , Width / , , );
                g.FillPath(Brushes.White, path);
                g.FillPie(Brushes.Black, new Rectangle(Width *  /  - Width / , Width *  /  - Width / , Width *  / , Width *  / ), , );
            }
            g.TranslateTransform(-Width / , -Width / );
            base.OnPaint(e);
        }

整体效果如下：

项目已开源，开源地址：https://gitee.com/james_happy/IndustryControls，欢迎Star与Fork