user3746886
user3746886

Reputation: 81

Xamarin Zxing Barcode-Scanner Overlay

I am trying to create an overlay for the zxing barcode scanner with Xamarin in Visual Studio, but I dont understand how to actually implement it.

I created a small layout for it, overlay.axml, which I want to be drawn on top of the camera view.

Overlay.axml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:minWidth="25px"
    android:minHeight="25px">
    <Space
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/space1"
        android:layout_weight="1" />
    <ToggleButton
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/tbtnTorch"
        android:layout_weight="0"
        android:textOn="Torch On"
        android:textOff="Torch Off" />
</LinearLayout>

Additionally, I think I need to create a class that inherits from View to bind the layout to it, but im unsure about that, this is what I got so far.

Overlay.cs:
public Overlay(Context context) : base(context)
{

}
public Overlay(Context context, IAttributeSet attrs) : base(context, attrs)
{

}

public Overlay(Context context, IAttributeSet attrs, int defStyle) : base(context, attrs, defStyle)
{

}

protected override void OnDraw(Android.Graphics.Canvas canvas)
{
    base.OnDraw(canvas);
}

I now would like to bind the overlay to my ZXing.scanner instance, but I am not sure how to do this. This is what I got so far.

MainActivity.cs:
scanner = new MobileBarcodeScanner(this);
options = new MobileBarcodeScannerOptions();
scanner.UseCustomOverlay = true;
scanner.CustomOverlay = new Overlay(this);

[...]

var result = await scanner.scan(options);

It works just as expected when not using an overlay, but with the overlay I just get a black screen when I start to scan. EDIT: Black Screen on Emulator, no overlay at all (like expected ?) on real device.

Upvotes: 3

Views: 4290

Answers (1)

Catalina
Catalina

Reputation: 2118

You don't need to create another Overlay class

Just inflate the overlay like this:

var zxingOverlay = LayoutInflater.FromContext(<YOUTCONTEXT>).Inflate(Resource.Layout.overlay, null);

and this to assign it to your scanner

scanner.CustomOverlay = zxingOverlay;

Upvotes: 1

Related Questions