How to use ZXing in MVVM?

Question

By the moment I am using the scanner in code behind in this way:

View:

<zxing:ZXingScannerView x:Name="ucZXingScannerView" IsScanning="True" IsAnalyzing="True" ScanResultCommand="{Binding CodigoQr, Mode=TwoWay}" OnScanResult="ucZXingScannerView_OnScanResult" />

Code behind: 

        void ucZXingScannerView_OnScanResult(ZXing.Result result)
{
    Device.BeginInvokeOnMainThread(() =>
    {
        ScannerViewModel miViewModel = this.BindingContext as ScannerViewModel;

        miViewModel.CodigoQr = result.Text + " (type: " + result.BarcodeFormat.ToString() + ")";

        ucZXingScannerView.IsScanning = false;
        ucZXingScannerView.IsAnalyzing = false;
    });
}

But I would like to avoid to have code in the code behind, so I am trying this:

View:

<zxing:ZXingScannerView x:Name="ucZXingScannerView" IsScanning="True" IsAnalyzing="True" ScanResultCommand="{Binding CodigoQr, Mode=TwoWay}" OnScanResult="{Binding ResultadoQrCommand}" />

View Model:

public Command<ZXing.Result> ResultadoQrCommand { get; private set; }

private void OnresultadoQr(ZXing.Result paramResultado)
{
    CodigoQr = "Prueba";
}

But in this case a get an error in the xaml code that tells "event OnScanResult can only bound to properties of delegate ScanResultDelegate".

My command in the view model has the same parameters that the method of the code behind and I don't be able to find the solution.

How could I define the command in the view model to can bind to the view model?

Also I have tried to use the ScanResult command:

The view:

<zxing:ZXingScannerView x:Name="ucZXingScannerView" IsScanning="True" IsAnalyzing="True" ScanResultCommand="{Binding ScanResultCommand}" />

View model:

public ScannerViewModel()
{
    ScanResultCommand = new Command<ZXing.Result>((x) => OnScanResultCommand(x), (x) => true);
}

public Command<ZXing.Result> ScanResultCommand { get; private set; }

private void OnScanResultCommand(ZXing.Result paramResultado)
{
    CodigoQr = paramResultado.Text;
}

But the command is not rised.

Thanks.

Answer 1

Hello,

Welcome to Microsoft Q&A!

1 . OnScanResult is event , we can't bind a Command property to an event .

2 . ScanResultCommand is a ICommand without declaring generic type , we can't assign an Action with parameter to it .

The correct way : bind Result as well , and get it from ScanResultCommand in viewmodel .

Xaml

   <zxing:ZXingScannerView x:Name="ucZXingScannerView"   
                               IsScanning="True"   
                               IsAnalyzing="True"  
                               Result="{Binding Result}"  
                               ScanResultCommand="{Binding ScanCommand }" />  

ViewModel

   public class ViewModel  
       {  
     
           public ViewModel()  
           {  
               ScanCommand = new Command(OnScanResultCommand);  
           }  
     
           private void OnScanResultCommand()  
           {  
               var text = Result.Text;  
           }  
     
           public Result Result { get; set; }  
           public Command ScanCommand { get; set; }  
     
       }  

Best Regards,
Cole Xia

---

If the response is helpful, please click "Accept Answer" and upvote it.
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.