Generate QR code with Xamarin.Forms and Zxing

Question

I've seen alot about this online (old posts) but nothing seems to work for me. I'm trying to generate a QR code out of a string and display it in the app.

Here's what i had in the beginning

qrCode = new ZXingBarcodeImageView
{
    BarcodeFormat = BarcodeFormat.QR_CODE,
    BarcodeOptions = new QrCodeEncodingOptions
    {
        Height  = 50,
        Width   = 50
    },
    BarcodeValue = codeValue,
    VerticalOptions = LayoutOptions.CenterAndExpand,
    HorizontalOptions = LayoutOptions.CenterAndExpand
};

That works fine for Android but on IOS devices its not rendered at all. So after researching i tried to do it like this:

Image qrCode;

if (Device.OS == TargetPlatform.iOS)
{
    var writer = new BarcodeWriter
    {
        Format = BarcodeFormat.QR_CODE,
        Options = new ZXing.Common.EncodingOptions
        {
            Width = 50,
            Height = 50
        }
    };

    var b = writer.Write(codeValue);

    qrCode = new Image
    {
        Aspect = Aspect.AspectFill,
        VerticalOptions = LayoutOptions.CenterAndExpand,
        HorizontalOptions = LayoutOptions.CenterAndExpand,
        Source = ImageSource.FromStream(() =>
        {
            MemoryStream ms = new MemoryStream(b);
            ms.Position = 0;
            return ms;
        })
    };

}else{
    qrCode = new ZXingBarcodeImageView
    {
        BarcodeFormat = BarcodeFormat.QR_CODE,
        BarcodeOptions = new QrCodeEncodingOptions
        {
            Height  = 50,
            Width   = 50
        },
        BarcodeValue = codeValue,
        VerticalOptions = LayoutOptions.CenterAndExpand,
        HorizontalOptions = LayoutOptions.CenterAndExpand
    };
}

Content = new StackLayout
{
    Children = {
        header, lblExplenationText, qrCode
    },
    BackgroundColor = Color.White
};

But there is still nothing rendered at all.

ZXing.Mobile.Forms NuGet Package Version: 2.1.47 (newest)

Solution

It seems to be a known issue.
Luckily there is a workaround, to set a HeightRequest & WidthRequest, here is a working code example:

ZXingBarcodeImageView GenerateQR(string codeValue)
{
    var qrCode = new ZXingBarcodeImageView
    {
        BarcodeFormat = BarcodeFormat.QR_CODE,
        BarcodeOptions = new QrCodeEncodingOptions
        {
            Height = 350,
            Width = 350
        },
        BarcodeValue = codeValue,
        VerticalOptions = LayoutOptions.CenterAndExpand,
        HorizontalOptions = LayoutOptions.CenterAndExpand
    };
    // Workaround for iOS
    qrCode.WidthRequest = 350;
    qrCode.HeightRequest = 350;
    return qrCode;
}

Comments

[R15]

How can I expire QR code after 20 seconds?