darryncampbell / DataWedge-Expo-Sample

Sample application written with the Expo framework to show barcode scanning on Zebra mobile computers

Please be aware that this application / sample is provided as-is for demonstration purposes without any guarantee of support

Integrating DataWedge into your Expo application

Expo is a set of tools and services built around React Native that helps you develop, build, deploy and quickly iterate on cross platform applications using JavaScript or TypeScript.

We get occasional questions from our developer community how to write an Expo application targeting Zebra Android devices so I put together this unofficial sample. This sample uses DataWedge which is the recommended way to capture data - If you just want to run the sample jump to the Installation / quick start section below.

Using Expo with DataWedge

Anyone new to Expo will quickly come up against the "Managed workflow" vs. "Bare workflow" way of working. Expo has good documentation on the differences between the two and it is important to understand the differences because you can only interface with DataWedge using the 'Bare workflow'

DataWedge exposes an Intent-based API which uses Broadcast Intents to control the scanner and provides the ability to listen for scan events via Intent. The IntentLauncher API provided to 'managed' expo applications is not functional enough to interface with DataWedge, therefore a different ReactNative plugin is required.

• expo init <myApp>
• One of the bare workflow options, e.g. 'bare and minimal, just the essentials to get started'
• cd <myApp>
• yarn add react-native-datawedge-intents

Demo

There already exists an unofficial ReactNative sample for Zebra Android devices so I thought it would be worthwhile converting that to an Expo app. The Expo documentation has a section for converting an existing ReactNative app to Expo as well as a walkthrough of the bare workflow, so I followed those:

1. Cloned existing https://github.com/darryncampbell/DataWedgeReactNative project, made a copy of it in this repository and changed all references from 'ReactNative' to 'Expo'
2. yarn add react-native-unimodules
3. Important: Followed the instructions at https://docs.expo.io/bare/installing-unimodules/ to update my project
4. yarn install
5. I chose to add a script to my package.json to point yarn android to react-native run-android as the old DataWedgeReactNative project did not use yarn.
6. I wanted to show some use of the Expo SDK so I chose Device.
7. expo install expo-device
8. Modified the existing application to use the Expo Device API to print the device manufacturer at the top of the app

View this application running by following the installation / quick start section immediately below:

Installation / Quick Start

Assuming you have an Expo environment configured

• git clone https://github.com/darryncampbell/DataWedge-Expo-Sample.git
• cd DataWedge-Expo-Sample
• cd DataWedgeExpo
• yarn install
• yarn android

If you receive Task :app:validateSigningDebug FAILED then please see this StackOverflow post

Warnings

You will see this message if you are running a version of Datawedge prior to 6.3:

And this message if you are running Datawedge 6.3:

In either case, ensure you have a Datawedge profile on the device. You can do this by:

• Launching the Datawedge application
• (Prior to 6.3 only) Select Menu --> New Profile and name the profile ZebraExpoDemo
  • Associate the profile with com.datawedgeexpo.demo and with * Activities (Note: You need to have previously run the application on the device to complete this step)
  • Configure the intent output plugin to send broadcast intents to com.zebra.expodemo.ACTION