Xamarin.Forms QR Code Scan 二维码扫描的Android App

环境配置

• VS2017
• Xamarin.Forms   .Net Standard 2.0

具体实现使用的是一个老项目了「ZXing.Net.Mobile」：https://github.com/Redth/ZXing.Net.Mobile

 

1. 新建项目 | QrCode3 & QrCode3.Android

     新建项目如下图。（iOS应用不进行开发，具体操作详情请参考上文连接）

2. 添加 NuGet 包 | QrCode3 & QrCode3.Android

3. 添加 Android 权限 | QrCode3.Android

       可另行添加闪光灯权限： FLASHLIGHT

4. MainActivity 初始化 | QrCode3.Android

   MainActivity 中的 OnCreate 函数中添加代码:

MobileBarcodeScanner.Initialize(this.Application);

5. 添加接口 interface IQrCodeScanningService | QrCode3

namespace QrCode3.Service
{
    public interface IQrCodeScanningService
    {
		Task<string> ScanAsync();
	}
}

6. 实现接口 QrCodeScanningService | QrCode3.Android

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;

using Android.App;
using Android.Content;
using Android.OS;
using Android.Runtime;
using Xamarin.Forms;
using QrCode3.Service;
using ZXing.Mobile;
using System.Threading.Tasks;

[assembly: Dependency(typeof(QrCode3.Droid.Services.QrCodeScanningService))]

namespace QrCode3.Droid.Services
{
	public class QrCodeScanningService : IQrCodeScanningService
	{
		public async Task<string> ScanAsync()
		{
			var optionsDefault = new MobileBarcodeScanningOptions();
			var optionsCustom = new MobileBarcodeScanningOptions()
			{
				//UseFrontCameraIfAvailable = true,
				//Check diferents formats in http://barcode.tec-it.com/en
				// PossibleFormats = new List<ZXing.BarcodeFormat> {  ZXing.BarcodeFormat.CODE_128 }
			};
			var scanner = new MobileBarcodeScanner()
			{
				TopText = "对准二维码 / 条形码",
				BottomText = "触摸屏幕来聚焦"
			};

			var scanResults = await scanner.Scan(optionsCustom);

			//Fix by Ale 2017-07-06
			return (scanResults != null) ? scanResults.Text : string.Empty;
		}

	}
}

7. 修改主页面并添加调用的按钮 | QrCode3

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:QrCode3"
             x:Class="QrCode3.MainPage">

    <StackLayout>
		<!-- Place new controls here -->
		<Button Text="Start" x:Name="btnScan" />
		<Entry x:Name="barcode" Placeholder="Todo" />
		<Button Text="打开扫描页面" x:Name="btnScan2" Clicked="BtnScan2_Clicked"/>
		<Label Text="Welcome to Xamarin.Forms!" 
           HorizontalOptions="Center"
           VerticalOptions="CenterAndExpand" />
    </StackLayout>

</ContentPage>

		private async void BtnScan_Clicked(object sender, EventArgs e)
		{
			var scanner = DependencyService.Get<IQrCodeScanningService>();
			var result = await scanner.ScanAsync();
			if(result != null)
				barcode.Text = result;
		}

8. 添加自定义扫描页面并调用 | QrCode3

     自定义页面参考 https://gist.github.com/jfversluis/8e9acedafc3ef3fd6e279d9ccf08ff53

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
			 xmlns:zxing="clr-namespace:ZXing.Net.Mobile.Forms;assembly=ZXing.Net.Mobile.Forms"
             x:Class="QrCode3.ScanPage">
    <ContentPage.Content>
		<Grid>
			<Grid.RowDefinitions>
				<RowDefinition Height="*" />
				<RowDefinition Height="Auto" />
				<RowDefinition Height="*" />
			</Grid.RowDefinitions>

			<BoxView Grid.Row="0" BackgroundColor="Chocolate"/>
				<zxing:ZXingScannerView Grid.Row="1" x:Name="_scanView" 
										OnScanResult="Handle_OnScanResult" IsScanning="true"
                                WidthRequest="200" HeightRequest="200" />
			<BoxView Grid.Row="2" BackgroundColor="Blue" />
		</Grid>
	</ContentPage.Content>
</ContentPage>

		public void Handle_OnScanResult(Result result)
		{
			Device.BeginInvokeOnMainThread(async () =>
			{
				await DisplayAlert("Scanned result", result.Text, "OK");
			});
		}