SkiaSharp 图形Xamarin.FormsSkiaSharp Graphics in Xamarin.Forms

下载示例下载示例Download Sample Download the sample

在应用程序中使用 SkiaSharp for 2D 图形 Xamarin.FormsUse SkiaSharp for 2D graphics in your Xamarin.Forms applications

SkiaSharp 是适用于 .NET 和 c # 的2D 图形系统,由在 Google 产品中广泛使用的开源 Skia 图形引擎提供支持。SkiaSharp is a 2D graphics system for .NET and C# powered by the open-source Skia graphics engine that is used extensively in Google products. 可以在应用程序中使用 SkiaSharp Xamarin.Forms 来绘制2d 矢量图形、位图和文本。You can use SkiaSharp in your Xamarin.Forms applications to draw 2D vector graphics, bitmaps, and text. 有关 SkiaSharp 库和其他教程的更多常规信息,请参阅2D 绘图指南。See the 2D Drawing guide for more general information about the SkiaSharp library and some other tutorials.

本指南假定你熟悉 Xamarin.Forms 编程。This guide assumes that you are familiar with Xamarin.Forms programming.

网络研讨会: SkiaSharpXamarin.FormsWebinar: SkiaSharp for Xamarin.Forms

SkiaSharp 初步SkiaSharp Preliminaries

的 SkiaSharp Xamarin.Forms 打包为 NuGet 包。SkiaSharp for Xamarin.Forms is packaged as a NuGet package. Xamarin.Forms在 Visual Studio 或 Visual Studio for Mac 中创建解决方案后,可以使用 NuGet 包管理器搜索SkiaSharp包,并将其添加到解决方案中。After you've created a Xamarin.Forms solution in Visual Studio or Visual Studio for Mac, you can use the NuGet package manager to search for the SkiaSharp.Views.Forms package and add it to your solution. 如果在添加 SkiaSharp 之后检查每个项目的 "引用" 部分,可以看到已将各种SkiaSharp库添加到了解决方案中的每个项目。If you check the References section of each project after adding SkiaSharp, you can see that various SkiaSharp libraries have been added to each of the projects in the solution.

如果你的 Xamarin.Forms 应用程序面向 ios,请编辑其info.plist文件,将最低部署目标更改为 ios 8.0。If your Xamarin.Forms application targets iOS, edit its Info.plist file to change the minimum deployment target to iOS 8.0.

在任何使用 SkiaSharp 的 c # 页面中,你都需要为 using 命名空间包含一个指令 SkiaSharp ,其中包含你将在图形编程中使用的所有 SkiaSharp 类、结构和枚举。In any C# page that uses SkiaSharp you'll want to include a using directive for the SkiaSharp namespace, which encompasses all the SkiaSharp classes, structures, and enumerations that you'll use in your graphics programming. 还需要一个 using 用于 SkiaSharp.Views.Forms 特定于的类的命名空间的指令 Xamarin.Forms 。You'll also want a using directive for the SkiaSharp.Views.Forms namespace for the classes specific to Xamarin.Forms. 这是一个很小的命名空间,最重要的类是 SKCanvasViewThis is a much smaller namespace, with the most important class being SKCanvasView. 此类派生自 Xamarin.Forms View 类,并托管你的 SkiaSharp 图形输出。This class derives from the Xamarin.Forms View class and hosts your SkiaSharp graphics output.


SkiaSharp.Views.Forms命名空间还包含一个 SKGLView 派生自的类, View 但使用 OpenGL 呈现图形。The SkiaSharp.Views.Forms namespace also contains an SKGLView class that derives from View but uses OpenGL for rendering graphics. 为了简单起见,本指南将自身限制为 SKCanvasView ,但使用 SKGLView 的是非常类似的。For purposes of simplicity, this guide restricts itself to SKCanvasView, but using SKGLView instead is quite similar.

SkiaSharp 绘制基础知识SkiaSharp Drawing Basics

您可以用 SkiaSharp 绘制的一些最简单的图形图是圆、椭圆和矩形。Some of the simplest graphics figures you can draw with SkiaSharp are circles, ovals, and rectangles. 在显示这些图表时,您将了解 SkiaSharp 坐标、大小和颜色。In displaying these figures, you will learn about SkiaSharp coordinates, sizes, and colors. 文本和位图的显示更复杂,但这些文章还介绍了这些技术。The display of text and bitmaps is more complex, but these articles also introduce those techniques.

SkiaSharp 线和路径SkiaSharp Lines and Paths

图形路径是一系列连接的直线和曲线。A graphics path is a series of connected straight lines and curves. 可以对路径进行描边和/或填充。Paths can be stroked, filled, or both. 本文包含直线绘图的许多方面,包括笔划端和联接,以及虚线和虚线,但会停止短的曲线几何图形。This article encompasses many aspects of line drawing, including stroke ends and joins, and dashed and dotted lines, but stops short of curve geometries.

SkiaSharp 转换SkiaSharp Transforms

转换允许对图形对象进行统一转换、缩放、旋转或倾斜。Transforms allow graphics objects to be uniformly translated, scaled, rotated, or skewed. 本文还介绍了如何使用标准的 3 x 3 转换矩阵创建非仿射转换,并将转换应用于路径。This article also shows how you can use a standard 3-by-3 transform matrix for creating non-affine transforms and applying transforms to paths.

SkiaSharp 曲线和路径SkiaSharp Curves and Paths

探索路径将继续向路径对象添加曲线,并利用其他强大的路径功能。The exploration of paths continues with adding curves to a path objects, and exploiting other powerful path features. 你将了解如何在简洁文本字符串中指定整个路径,如何使用路径效果,以及如何深入了解路径内部。You'll see how you can specify an entire path in a concise text string, how to use path effects, and how to dig into path internals.

SkiaSharp 位图SkiaSharp Bitmaps

位图是与显示设备的像素相对应的位的矩形数组。Bitmaps are rectangular arrays of bits corresponding to the pixels of a display device. 这一系列文章演示了如何加载、保存、显示、创建、绘制、绘制 SkiaSharp 位图,以及如何对其进行动画处理。This series of articles shows how to load, save, display, create, draw on, animate, and access the bits of SkiaSharp bitmaps.

SkiaSharp 效果SkiaSharp Effects

效果是指改变图形的正常显示的属性,包括线性和圆形渐变、位图平铺、blend 模式、模糊等等。Effects are properties that alter the normal display of graphics, including linear and circular gradients, bitmap tiling, blend modes, blur, and others.