C# winform 通过Matrix实现图像的自由平移、缩放、旋转

1.先上样图

软件在用户交互方面未做完善，后续会逐步完善。

代码已经同步到Github，欢迎下载使用，但是请注明出处。

Github地址：https://github.com/zhouchen/zhouchen.chart

2.软件基本构想

软件加载图片后，先做计算，给matrix赋值，使得图片大小适合窗口，然后居中显示。图片大小适合窗口，是对图像进行第一次缩放，代码如下：

        // 缩放图片到窗口能刚好展示完全public void AdaptView(){if (_bitmap == null){return;}using (var graphPath = new GraphicsPath()){graphPath.AddRectangle(_rcImg);graphPath.Transform(_matrix);PointF[] pointFs = graphPath.PathPoints;float fxmin = pointFs[0].X;float fymin = pointFs[0].Y;float fxmax = pointFs[0].X;float fymax = pointFs[0].Y;foreach (var pt in pointFs){if (pt.X < fxmin){fxmin = pt.X;}else if (pt.X > fxmax){fxmax = pt.X;}if (pt.Y < fymin){fymin = pt.Y;}else if (pt.Y > fymax){fymax = pt.Y;}}float fWidth = fxmax - fxmin;float fHeight = fymax - fymin;if (fWidth * rcBgArea.Height < fHeight * rcBgArea.Width){DScale = rcBgArea.Height / fHeight;}else{DScale = rcBgArea.Width / fWidth;}_matrix.Scale((float)DScale, (float)DScale, MatrixOrder.Append);}}

先计算图像进行矩阵变换后的最小外接矩形(图片刚加载的时候，其实外接矩形就是图片本身的尺寸，这里未了考虑之后图片进行矩阵变换后，想要重新恢复到能窗口显示，所以要进行矩阵变换的计算)，然后计算相应的缩放比例，并设置到变换矩阵中。

缩放之后就要对图像进行第一次平移，这样能实现在窗口居中，代码如下：

        // 平移图片到窗口的中间public void TranslationCenter(){if(_bitmap == null){return;}Matrix matrixinv = _matrix.Clone();matrixinv.Invert();Point[] ptViewCenter = new Point[] { new Point(rcBgArea.Left + rcBgArea.Width / 2, rcBgArea.Top + rcBgArea.Height / 2) };matrixinv.TransformPoints(ptViewCenter);_matrix.Translate(ptViewCenter[0].X - _rcImg.Width / 2, ptViewCenter[0].Y - _rcImg.Height / 2);this.Refresh();}

这里的思路就要和缩放有点逆向，因为平移是平移图片，显示窗口的中心坐标要先换算成图片坐标系的点的坐标，所以要先将窗口中心点的坐标通过逆矩阵，计算出相对与图片坐标系的坐标，然后进行相应的计算赋值，才可以完成图像的平移。

缩放平移后，就是需要展示。展示采用GDI+的双缓冲技术。代码如下：

        private void ChartView_Paint(object sender, PaintEventArgs e){Graphics graph = e.Graphics;graph.SmoothingMode = SmoothingMode.HighQuality;// 双缓冲绘图Bitmap bmpChartView = new Bitmap(this.Width, this.Height);Graphics bmpChartView_g = Graphics.FromImage(bmpChartView);bmpChartView_g.SmoothingMode = SmoothingMode.HighQuality;DrawView(bmpChartView_g);graph.DrawImage(bmpChartView, 0, 0);bmpChartView_g.Dispose();bmpChartView.Dispose();}

因为之前设置好了_matrix,所以绘图就变得简单多了，只需要将矩阵设置到Graphics即可，代码如下：

        // 绘图private void DrawView(Graphics graph){DrawMainView(graph);DrawScrollV(graph);DrawScrollH(graph);}// 绘制图片展示区private void DrawMainView(Graphics graph){// 填充背景graph.FillRectangle(_ImgBg, rcBgArea);if (_bitmap == null){return;}Bitmap bitImg = new Bitmap(_rcImg.Width, _rcImg.Height, System.Drawing.Imaging.PixelFormat.Format32bppArgb);Graphics bitImg_g = Graphics.FromImage(bitImg);bitImg_g.Transform = _matrix;bitImg_g.DrawImage(_bitmap, 0, 0, _bitmap.Width, _bitmap.Height);graph.DrawImage(bitImg, rcBgArea.Left, rcBgArea.Top, bitImg.Width, bitImg.Height);foreach(var chart in LstChart){chart.DrawChart(graph, _matrix);}bitImg_g.Dispose();bitImg.Dispose();}

值得注意的是，我还会在图片上绘制一些图形，如果在绘制图片之后，然后在图片上绘制图形，那么图形的线条宽度会随着图片的缩放进行相应的缩放，但是如果是在绘图Graphics上绘制的话，那就不会了，这个主要看实际的情况需要。比如PhotoShop就是要编辑图片，那么自然就是要对线条进行相应缩放，又比如Visio所画的图形，这就不要随着缩放而缩放。我在这里选择后者。

3.鼠标实现平移

这个比较简单，鼠标点击的时候，记录下点击的坐标(鼠标点击获取到的e.location是相对于视图窗口的坐标，需要通过逆矩阵换算出图片实际的坐标)，鼠标移动到新的坐标的时候，两两进行相减，然后把结果赋值到_matrix中即可

 _matrix.Translate((points[0].X - _LastPt.X), (points[0].Y - _LastPt.Y));

4.鼠标实现旋转

这个和平移很相似，该有的换算都得算上，这里需要把平移需要的坐标，改成角度即可，角度的计算代码如下，这里都是相对于图像的中心点旋转，需要重新设置旋转点，修改对应的旋转中心点就可以了：

double corrb = Math.Atan2(_LastPt.Y - _rcImg.Height / 2, _LastPt.X - _rcImg.Width / 2);
double corre = Math.Atan2(points[0].Y - _rcImg.Height / 2, points[0].X - _rcImg.Width / 2);
_matrix.RotateAt((float)((corre -corrb) *180.0f/Math.PI), new Point(_rcImg.Width / 2, _rcImg.Height / 2));
DRoute += (Double)((corre - corrb) * 180.0f / Math.PI);

5.鼠标实现缩放

缩放实际上要实现两步，第一步是缩放，缩放后鼠标所在的坐标相对与图片来说发生了变化，所以还需要一步进行图像的平移，代码如下：

        private void ChartView_MouseWheel(object sender, MouseEventArgs e){Point[] points = new Point[] { e.Location };Matrix matrix_Invert = _matrix.Clone();matrix_Invert.Invert();matrix_Invert.TransformPoints(points);Console.WriteLine(points[0]);if (_rcImg.Contains(points[0])){double step = 1.2;if (e.Delta < 0){step = 1.0 / 1.2;}DScale *= step;_matrix.Scale((float)step, (float)step);Point[] pointse = new Point[] { e.Location };matrix_Invert = _matrix.Clone();matrix_Invert.Invert();matrix_Invert.TransformPoints(pointse);_matrix.Translate((pointse[0].X - points[0].X), (pointse[0].Y - points[0].Y));Refresh();}}