Xamarin.Forms-使用SkiaSharp的装饰QRCode映射



有一个流行的ZXing库,用于输出/读取条形码。 它可以输出和读取许多不同的格式:QRCode,Aztec和其他格式(超过2种)。 为了读取代码,它具有一个现成的控件ZXingScannerView。 最少需要代码才能将此功能添加到您的应用程序。

但是,使用此库,代码将以黑白方式正常显示。 考虑当您需要描绘自定义代码的情况,例如,彩色代码,带有圆形元素或以其他方式修饰(以便继续阅读)。

只有当您自己绘制代码时,才能真正发挥创造力的自由-然后一切都完全掌握在您手中。 这就是我们将以QR码为例的内容。

完成的应用程序在这里

本文实现了以下文章中的一种算法: QR码生成算法 ,使用SkiaSharp库的绘图受到影响,并给出了一个带有一些装饰元素的QR码生成器的应用示例-突出显示,平滑png文件中的线条和背景。

实施说明


让我们从创建一个空的Xamarin.Forms应用程序开始。 在Visual Studio中创建一个新项目,例如“ Mobile App(Xamarin.Forms)”,然后选择“空白”模板。 在“平台”部分中,选择任何一个,SkiaSharp可以在许多平台上运行,包括android和iOS。

.Android和.iOS项目保持不变,我们有一个跨平台的实现。

在跨平台项目中:
添加了两个背景图片-一个用于整个页面,另一个用于QR码。 请注意,他们有一个“构建操作”“嵌入式资源”。
输出在文件MainPage.xaml和MainPage.xaml.cs中
ImageResourceExtension类,用于使用来自xaml中资源的图像。

所有逻辑都在QRCodeEncoder项目中。 它分为两类:

  • 编码器-将数据字符串编码为一串零
  • 渲染器-正确放置结果数据数组,添加开销信息,并将png文件返回给Stream

QR码生成算法有很多带数字的参考书。 它们的全部含义,请参见文章“ QR代码生成算法”(请参见上文)。

在应用程序中未实现汉字编码(用于字符)。

斯基亚沙普


SkiaSharp是.NET的跨平台2D图形库。 它基于Google的Skia图形库 。 作为NuGet软件包提供:

nuget install SkiaSharp 

Microsoft文档: Xamarin.Forms中的SkiaSharp

所有绘图都在Renderer类的Draw方法中进行。 例如,有些元素是圆形的,有些是正方形的:

 canvas.DrawCircle() canvas.DrawRect() 

一些突出显示:

 var paint1 = new SKPaint { IsAntialias = true, Style = SKPaintStyle.Fill, Color = SKColors.DeepSkyBlue }; var paint2 = new SKPaint { IsAntialias = true, Style = SKPaintStyle.Fill, Color = SKColors.Red }; var paint3 = new SKPaint { IsAntialias = true, Style = SKPaintStyle.Fill, Color = SKColors.Gold }; 

并展示了如何平滑相邻元素之间的过渡。

例子


最后,是一些来自互联网的有趣QR码的示例:

Source: https://habr.com/ru/post/zh-CN474906/


All Articles