Update README to note that example can not be launched directly

Additionally update the app.js layout to harmonize the appearance and
add a cordova/package.json file which is require for a cordova app
starting with cordova-android 10.

Author: mpost

example/README.md

@@ -3,6 +3,9 @@
 ## Prerequisites
 
 To run the example it is recommended to use the [Tabris.js CLI](https://www.npmjs.com/package/tabris-cli).
+
+The example can not be run directly from this directory since cordova doesn't allow to consume plugins if they are contained in a parent folder. Instead copy the example to an unrelated directory and adjust the `config.xml` of the example to point the `tabris-plugin-barcode-scanner` directory.
+
 ## Running the Example
 
 Using the Tabris.js CLI the example can be started by running:

example/cordova/config.xml

@@ -5,7 +5,7 @@
         version="3.1.0"
         android-packageName="com.eclipsesource.tabris.barcodescanner.example"
         android-versionCode="1">
-  <name>Tabris.js Barcode Scanner Plugin Example</name>
+  <name>Barcode scanner example for Tabris.js</name>
   <description>Example for the Tabris.js Barcode Scanner plugin.</description>
   <author email="[email protected]" href="https://tabrisjs.com">EclipseSource</author>
 

example/cordova/package.json

@@ -0,0 +1,3 @@
+{
+  "name": "tabris-plugin-barcode-scanner-example"
+}

example/src/app.js

@@ -19,29 +19,35 @@ let scanner = new esbarcodescanner.BarcodeScannerView({
 let controls = new Composite({
   id: 'controls',
   left: 0, right: 0, bottom: 0,
+  elevation: 2,
   background: '#FAFAFA',
 }).appendTo(contentView);
 
 let barcodeTextView = new TextView({
-  left: 0, top: 0, right: 0, height: 64,
-  text: '<i><b>Waiting for barcode...</b></i>',
+  left: 0, top: 0, right: 0, height: 48,
+  text: '<i>Scanning for barcode...</i>',
   markupEnabled: true,
   lineSpacing: 1.2,
   font: '16px',
   alignment: 'centerX',
-  background: 'white',
-  elevation: 2
+}).appendTo(controls);
+
+new Composite({
+  top: "prev()", left: 0, right: 0, height: 1,
+  background: '#00000022',
 }).appendTo(controls);
 
 let formatPicker = new Picker({
   left: 16, top: 'prev() 16', right: 16,
   itemCount: BARCODES.length,
+  selectionIndex: 0,
   itemText: (index) => BARCODES[index],
 }).appendTo(controls);
 
 new Picker({
   left: 16, top: 'prev() 16', right: 16,
   itemCount: SCALE_MODES.length,
+  selectionIndex: 0,
   itemText: (index) => SCALE_MODES[index],
 }).onSelect((event) => scanner.scaleMode = SCALE_MODES[event.index])
   .appendTo(controls);