Loupe

[Xamarin] Scanner un QRCode dans une application Xamarin.Forms

Scanner des QRCodes (ou des codes barres) dans une application Xamarin.Forms est très simple grâce au projet ZXing, qui a été porté sur Xamarin (et pour tous les devices: iOS, Android et Windows Phone).

 

Pour implémenter la fonctionnalité, il faut d’abord ajouter une référence au compsant ZXing. Ensuite, et comme cela se fait pour beaucoup d’autres fonctionnalités, il nous faut un pont, une passerelle entre le projet Forms (le projet “Shared” ou PCL) et les différentes implémentations UI. Pour cela, nous allons utiliser le DependencyService pour enregistrer une interface et créer ses différentes implémentation.

L’interface en elle-même est très simple:

public interface IQrCodeScanningService
{
    Task<string> ScanAsync();
}

Et voici son implémentation dans le projet Windows Phone:

public class QrCodeScanningService : IQrCodeScanningService
{
    public async Task<string> ScanAsync()
    {
        var scanner = new ZXing.Mobile.MobileBarcodeScanner(App.RootFrame.Dispatcher);
        var scanResults = await scanner.Scan();

        return scanResults.Text;
    }
}

Maintenant, regardons l’implémentation sur la version Android (bien sur, il reste possible de créer une implémentation iOS):

public class QrCodeScanningService : IQrCodeScanningService
{
    public async Task<string> ScanAsync()
    {
        var scanner = new ZXing.Mobile.MobileBarcodeScanner(Application.Context);
        var scanResults = await scanner.Scan();

        return scanResults.Text;
    }
}

Comme vous pouvez le voir, chaque version est différente (le constructeur de MobileBarcodeScanner prends des paramètres différents, en fonction de la plateforme).

Pour chaque implémentation, il ne faut pas oublier d’ajouter l’attribut Dependency afin que le container IoC de Xamarin.Forms (accessible via la classe DependencyService) puisse enregistrer l’interface et son implémentation:

// Windows Phone
[assembly: Dependency (typeof(QrCodeScanningService))]
namespace QrCodeScanningWithXamarin.WinPhone.Helpers

// Android
[assembly: Dependency(typeof(QrCodeScanningService))]
namespace QrCodeScanningWithXamarin.Droid.Helpers

A présent, dans le projet Forms, nous pouvons utiliser le DependencyService pour récupérer l’instance de la classe qui implémente notre interface:

var scanButton = new Button
{
    Text = "Launch scan"
};
scanButton.Clicked += async (sender, args) =>
{
    var url = await DependencyService.Get<IQrCodeScanningService>().ScanAsync();
    
    Device.OpenUri(new Uri(url));
};

En lançant l’application et en cliquant sur le bouton, vous apercevrez un overlay qui vous permettra de scanner un QRCode ou un code barre. Une fois la vue chargée à l’écran, appuyer dessus pour déclencher l’auto-focus et la reconnaissance du code

 

Happy coding! :)

Ces billets pourraient aussi vous intéresser

Vous nous direz ?!

Commentaires

comments powered by Disqus