Xamarin.Forms是一个通用的跨平台用户界面工具包，允许单个程序在iOS，Android，通用Windows平台和（最近）的MacOS上运行。
但是，Xamarin.Forms中缺少一个功能是图形系统。 Xamarin.Forms可以渲染位图，您可以对一些简单的块状图像进行尺寸和旋转BoxView，但是对于那些喜欢图形编程的人来说，Xamarin.Forms有一个大的多边形孔。
但不要担心！ Xamarin.Forms图形的一个非常引人注目的解决方案是Shttps://developer.xamarin.com/guides/xamarin-forms/advanced/skiasharp/transforms/kiaSharp，Xamarin的C＃库，它集成了Google强大的Skia Graphics Engine。
SkiaSharp是一款跨平台，高性能的适合 .NET开发人员的2D API，非常适合移动开发。 API非常简单，可以用来做简单的事情，如绘图形状或文本，一直到复杂的实时绘图应用程序。 Xamarin团队甚至创建了一个WYSIWYG图形设计器，它提供了SkiaSharp图形代码。
作为Xamarin文档团队的成员，我一直在撰写我希望在Xamarin.Forms中使用SkiaSharp的广泛系列的大小小的教程。 这些文章代表了对SkiaSharp的深入了解，但我希望也可以作为新来的2D图形的介绍。 SkiaSharp与其他2D图形绘图系统共享许多概念，所以学习SkiaSharp是获得二维矢量图形通用教育的好办法。
最近，我已经完成了几篇关于SkiaSharp Transforms的文章。 SkiaSharp支持在其他图形系统中发现的所有基本图形变换，包括平移，缩放，旋转和倾斜，可以倾斜图形对象（如阴影）：
点击(此处)折叠或打开
- using (SKPaint textPaint = new SKPaint())
- {
- textPaint.Style = SKPaintStyle.Fill;
- textPaint.TextSize = screenWidth / 6;
- textPaint.IsAntialias = true;
-
- // Common to shadow and text
- string text = "shadow";
- float xText = 20;
- float yText = screenHeight / 2;
-
- // Shadow
- textPaint.Color = SKColors.Gray;
- canvas.Save();
- canvas.Translate(xText, yText);
- canvas.Skew((float)Math.Tan(-Math.PI / 4), 0);
- canvas.Scale(1, 3);
- canvas.Translate(-xText, -yText);
- canvas.DrawText(text, xText, yText, textPaint);
- canvas.Restore();
-
- // Text
- textPaint.Color = SKColors.Blue;
- canvas.DrawText(text, xText, yText, textPaint);
- }
SkiaSharp还支持标准矩阵变换，包括非仿射变换，可以实现透视和3D旋转效果，如本博客顶部的图像。
在移动平台和其他现代设备上，图形通常与触摸密切相关。 Xamarin.Forms支持一些初步的触摸事件，但不是跟踪单个手指的基本工具。 Xamarin.Forms的更复杂的触摸跟踪现在可用于从“效果调用事件”中描述的Xamarin.Forms效果。
结合SkiaSharp和触摸跟踪可以产生一些有趣的应用程序。 我最近创建了一个Xamarin.Forms版本的SpinPaint，基于我在七年前首次为Microsoft桌面计算机（最初称为Surface，之后更名为PixelSense）编写的一个程序。
SpinPaint模拟旋转盘。 触摸它或在其上移动手指，它不仅绘制与您的手指相对应的线条，而且还可以绘制三条其他线路，即镜像，创建漂亮的图案。 这里的SpinPaint在iOS，Android和通用Windows平台上运行：
我认为SkiaSharp最令我印象深刻的是它的多功能性。 例如，其他2D图形系统对于绘制圆弧的最佳方式并不完全一致，圆弧是椭圆的圆周上的曲线。 不同的图形系统以非常不同的方式定义弧。
SkiaSharp不会强迫你以特定的方式思考弧线; 相反，它支持三种不同的方式来在图形路径中定义弧，因此您可以使用最适合您特定应用程序的弧线：
角度弧要求您为椭圆指定边界矩形，以及起始角度和扫掠角度：
点击(此处)折叠或打开
- path.AddArc(rect, startAngle, sweepAngle);
结果弧显示为红色：
这与Android Path对象的AddArc和ArcTo方法相同，类似于iOS CGPath的AddArc方法（尽管iOS版本限制在圆周上的圆弧）。 这种弧形对于饼图是非常好的。
切线弧与PostScript arct功能和iOS AddArcToPoint方法类似。 指定圆的半径，然后紧贴在两条连接线之间：
点击(此处)折叠或打开
- path.ArcTo(pointCorner, pointDestination, radius);
SkiaSharp画一条线和圆弧，再次显示为红色：
切线弧是圆角的理想选择。
最后，椭圆弧允许您指定椭圆的两个半径以及旋转角度。 所得到的倾斜椭圆可以以两种不同的方式装配在两个点之间，导致两个点之间的四个不同的弧，这里显示四种不同的颜色：
您可以使用两个其他参数指定这四个可能的弧中的哪一个：
点击(此处)折叠或打开
- ArcTo (radii, rotation, largeArcFlag, sweepDirectionFlag, point)
这种类型的弧规格与可伸缩矢量图形（SVG）支持的椭圆弧以及基于XAML的Windows图形系统（包括通用Windows平台）支持的ArcSegment一致。
如果您认为弧形绘图是多才多艺的，请等到您看到SkiaSharp的着色器和路径效果！ 着色器允许您指定填充区域的各种梯度，包括线性渐变，径向梯度，锥形梯度，扫描梯度和称为Perlin噪声的随机模式。 路径效果可以使您想要的点或虚线的任何图案呈现点划线或虚线，也可以渲染由小图案组成的线条：
结束语
还有更多的SkiaSharp文章来，请检查在Xamarin.Forms页面中使用SkiaSharp来查看新功能。
同时，您还将要注册Xamarin大学礼物，这是七月份的五个必看网络研讨会，其中包括一个我将在SkiaSharp Graphics上为Xamarin.Forms做的工作。
扫一扫
728
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
