Xamarin.Forms 二维码扫描实践

开发环境:

Visual Studio 2019 版本 16.4.5

公用平台nuget

  1. ZXing.Net.Mobile.Forms 2.4.1
  2. Plugin.Permissions 5.0.0-beta

Android项目环境nuget

  1. Xamarin.Forms 4.4.0.991640
  2. Ideine.ZXing.Net.Mobile 2.4.2
  3. Plugin.Permissions 5.0.0-beta
  4. Xamarin.Android.Support.Compat 28.0.0.3
  5. Xamarin.Android.Support.Core.UI 28.0.0.3
  6. Xamarin.Android.Support.Core.Utils 28.0.0.3
  7. Xamarin.Android.Support.CustomTabs 28.0.0.3
  8. Xamarin.Android.Support.Design 28.0.0.3
  9. Xamarin.Android.Support.Fragment 28.0.0.3
  10. Xamarin.Android.Support.v4 28.0.0.3
  11. Xamarin.Android.Support.v7.AppCompat 28.0.0.3
  12. Xamarin.Android.Support.v7.CardView 28.0.0.3

一、新建项目

选择项目模板为:移动应用(Xamarin.Forms)

Xamarin.Forms 二维码扫描实践

点击下一步:输入项目名称 ScanBarCode,选择好项目存储位置,点击“创建”按钮

Xamarin.Forms 二维码扫描实践

在弹出的窗体中选择:模板-详细信息 平台选择Andrdeoid和iOS 其他保持未选中状态,点击“OK”按钮,等待新建项目加载完成。

Xamarin.Forms 二维码扫描实践

项目创建完成后,会有三个项目:

  • ScanBarCode
  • ScanBarCode.Android
  • ScanBarCode.iOS
Xamarin.Forms 二维码扫描实践

二、在项目中添加NuGet程序包

点击解决方案名称,右键,选择“管理解决方案的 NuGet 程序包”

Xamarin.Forms 二维码扫描实践

出现tab页面:

Xamarin.Forms 二维码扫描实践

更新中出现有一项可更新内容,进行更新,Xamarin.Forms更新到4.4.0.991640版本。

点击“浏览”选项,添加必要的NuGet程序包

ZXing.Net.Mobile.Forms添加到项目 ScanBarCode

Xamarin.Forms 二维码扫描实践

Ideine.ZXing.Net.Mobile添加到 ScanBarCode.Android项目中

Xamarin.Forms 二维码扫描实践

Plugin.Permissions 添加到项目:ScanBarCodeScanBarCode.Android项目中

Xamarin.Forms 二维码扫描实践

ScanBarCode.Android项目中安装Xamarin.Android.Support.* 的NuGet程序包(至关重要)

Xamarin.Android.Support.Compat 28.0.0.3(必要) Xamarin.Android.Support.Core.UI 28.0.0.3(必要) Xamarin.Android.Support.Core.Utils 28.0.0.3(必要) Xamarin.Android.Support.CustomTabs 28.0.0.3 Xamarin.Android.Support.Design 28.0.0.3 Xamarin.Android.Support.Fragment 28.0.0.3(必要) Xamarin.Android.Support.v4 28.0.0.3(必要) Xamarin.Android.Support.v7.AppCompat 28.0.0.3(必要) Xamarin.Android.Support.v7.CardView 28.0.0.3

三、在OnCreate中添加初始化代码

在项目 ScanBarCode.Android中的MainActivity.cs文件中OnCreate方法中添加初始化代码,并重写OnRequestPermissionsResult方法 

namespace ScanBarCode.Droid
{
    [Activity(Label = "ScanBarCode", Icon = "@mipmap/icon", Theme = "@style/MainTheme", MainLauncher = true, ConfigurationChanges = ConfigChanges.ScreenSize | ConfigChanges.Orientation)]
    public class MainActivity : global::Xamarin.Forms.Platform.Android.FormsAppCompatActivity
    {
        protected override void OnCreate(Bundle savedInstanceState)
{
            TabLayoutResource = Resource.Layout.Tabbar;
            ToolbarResource = Resource.Layout.Toolbar;
 
            base.OnCreate(savedInstanceState);
 
            Xamarin.Essentials.Platform.Init(this, savedInstanceState);
            global::Xamarin.Forms.Forms.Init(this, savedInstanceState);
            
            //初始化代码
            CrossCurrentActivity.Current.Init(this, savedInstanceState);
            MobileBarcodeScanner.Initialize(Application);
            
            LoadApplication(new App());
        }
        public override void OnRequestPermissionsResult(int requestCode, string[] permissions, [GeneratedEnum] Android.Content.PM.Permission[] grantResults)
{
            Xamarin.Essentials.Platform.OnRequestPermissionsResult(requestCode, permissions, grantResults);
 
            base.OnRequestPermissionsResult(requestCode, permissions, grantResults);
        }
    }
}

在项目 ScanBarCode.Android中的AssemblyInfo.cs中添加相关权限。

[assembly:UsesPermission(Android.Manifest.Permission.Camera)] //相机
[assembly:UsesPermission(Android.Manifest.Permission.Flashlight)] //闪光灯

四、实现扫码功能

4.1 在 ScanBarCode中添加内容页

ScanBarCode中的 Views添加内容页:ScanQrCodePage.xaml 在xaml中添加如下代码:

Xamarin.Forms 二维码扫描实践

扫码功能实现

ScanBarCodeBtn_OnClicked方法中实现扫码功能:

Xamarin.Forms 二维码扫描实践

检查权限代码:

Xamarin.Forms 二维码扫描实践

这样就实现了扫码功能,可以是条形码,二维码等。

4.2 自定义扫码功能

使用默认扫描器虽可以完成扫描功能,但是其样式过于简陋,下面通过自定义ScanPage和ScanOverlay更改扫描器样式。

4.2.1 自定义ZXingScanOverlay。

Xamarin.Forms 二维码扫描实践
Xamarin.Forms 二维码扫描实践

4.2.2 自定义ZXingCustomScanPage

Xamarin.Forms 二维码扫描实践

4.2.3 实现点击实现

Xamarin.Forms 二维码扫描实践

4.3、生成二维码功能

在点击事件中直接进行生成二维码的功能

Xamarin.Forms 二维码扫描实践
Xamarin.Forms 二维码扫描实践

五、侧边栏菜单实现

ScanBarCode项目的Models文件夹的HomeMenuItem文件的enum中添加

Xamarin.Forms 二维码扫描实践

ScanBarCode项目的Views文件夹的 MenuPage.xaml.cs文件中添加菜单项:

Xamarin.Forms 二维码扫描实践

ScanBarCode项目的Views文件夹的 MainPage.xaml.cs文件中的 NavigateFromMenu方法中内容:

Xamarin.Forms 二维码扫描实践
Xamarin.Forms 二维码扫描实践

源码

https://github.com/mzy666888/ScanBarCodeXamarin

参考

  1. 全部的扫码的代码全部来源于此BLOG:https://www.jianshu.com/p/a200de28597b
  2. https://github.com/HisCodeness/MvvmCross.Plugin.QRCode

结束语

小编用了3天的时间,终于把扫码功能研究出来了。在VS生成的项目中没有引用 Xamarin.Android.Support 相关包,导致个人一直认为需要把 ZXing.Net.Mobile的相关库升级到.netstandard 2.0才能使用呢。各位如果喜欢请给个关注,点个在看

Xamarin.Forms 二维码扫描实践

原文出处:微信公众号【DotNetCore学习站】,作者【芝麻麻雀】

原文链接:https://mp.weixin.qq.com/s/ow6Qp_TKYvZCteuuuFHnmg

本文观点不代表Dotnet9立场,转载请联系原作者。

发表评论

登录后才能评论