feat(android): implement QR code scanner (#1124)

tido64 · web-flow · commit d0b8f6d6aad3 · 2022-10-06T18:21:50.000+02:00
diff --git a/android/app/build.gradle b/android/app/build.gradle
@@ -66,6 +66,7 @@ project.ext.react = [
     appName              : getAppName(),
     applicationId        : getApplicationId(),
     architectures        : getArchitectures(),
+    enableCamera         : !getSingleAppMode(),
     enableFabric         : isFabricEnabled(project),
     enableFlipper        : getFlipperVersion(rootDir),
     enableHermes         : true,
@@ -258,6 +259,12 @@ android {
     }
 
     sourceSets {
+        if (project.ext.react.enableCamera) {
+            main.java.srcDirs += "src/camera/java"
+        } else {
+            main.java.srcDirs += "src/no-camera/java"
+        }
+
         if (project.ext.react.enableFlipper) {
             debug.java.srcDirs += "src/flipper/java"
         }
@@ -350,6 +357,12 @@ dependencies {
     androidTestImplementation libraries.androidJUnit
     androidTestImplementation libraries.androidEspressoCore
 
+    if (project.ext.react.enableCamera) {
+        implementation libraries.androidCamera
+        implementation libraries.androidCameraMlKitVision
+        implementation libraries.mlKitBarcodeScanning
+    }
+
     if (project.ext.react.enableFlipper) {
         def flipperVersion = project.ext.react.enableFlipper
         debugImplementation("com.facebook.flipper:flipper:${flipperVersion}") {
diff --git a/android/app/src/camera/java/com/microsoft/reacttestapp/camera/MainActivityExtensions.kt b/android/app/src/camera/java/com/microsoft/reacttestapp/camera/MainActivityExtensions.kt
@@ -0,0 +1,63 @@
+package com.microsoft.reacttestapp.camera
+
+import android.Manifest
+import android.content.DialogInterface
+import android.content.pm.PackageManager
+import androidx.appcompat.app.AlertDialog
+import androidx.core.app.ActivityCompat
+import androidx.core.content.ContextCompat
+import com.google.android.material.snackbar.Snackbar
+import com.microsoft.reacttestapp.MainActivity
+import com.microsoft.reacttestapp.R
+import com.microsoft.reacttestapp.testApp
+
+fun MainActivity.canUseCamera(): Boolean {
+    return ContextCompat.checkSelfPermission(
+        this,
+        Manifest.permission.CAMERA
+    ) == PackageManager.PERMISSION_GRANTED
+}
+
+fun MainActivity.scanForQrCode() {
+    when {
+        canUseCamera() -> {
+            val fragment = QRCodeScannerFragment(mainThreadHandler) {
+                AlertDialog
+                    .Builder(this)
+                    .setTitle(R.string.is_this_the_right_url)
+                    .setMessage(it)
+                    .setPositiveButton(R.string.yes) { _: DialogInterface, _: Int ->
+                        testApp.reloadJSFromServer(this, it)
+                    }
+                    .setNegativeButton(R.string.no) { _: DialogInterface, _: Int ->
+                        // Nothing to do
+                    }
+                    .show()
+            }
+            fragment.show(supportFragmentManager, QRCodeScannerFragment.TAG)
+        }
+        shouldShowRequestPermissionRationale(Manifest.permission.CAMERA) -> {
+            Snackbar
+                .make(
+                    findViewById(R.id.recyclerview),
+                    R.string.camera_usage_description,
+                    Snackbar.LENGTH_LONG
+                )
+                .setAction(android.R.string.ok) {
+                    ActivityCompat.requestPermissions(
+                        this,
+                        arrayOf(Manifest.permission.CAMERA),
+                        MainActivity.REQUEST_CODE_PERMISSIONS
+                    )
+                }
+                .show()
+        }
+        else -> {
+            ActivityCompat.requestPermissions(
+                this,
+                arrayOf(Manifest.permission.CAMERA),
+                MainActivity.REQUEST_CODE_PERMISSIONS
+            )
+        }
+    }
+}
diff --git a/android/app/src/camera/java/com/microsoft/reacttestapp/camera/QRCodeScannerFragment.kt b/android/app/src/camera/java/com/microsoft/reacttestapp/camera/QRCodeScannerFragment.kt
@@ -0,0 +1,104 @@
+package com.microsoft.reacttestapp.camera
+
+import android.os.Bundle
+import android.os.Handler
+import android.view.LayoutInflater
+import android.view.View
+import android.view.ViewGroup
+import androidx.camera.core.ImageCapture.CAPTURE_MODE_MINIMIZE_LATENCY
+import androidx.camera.mlkit.vision.MlKitAnalyzer
+import androidx.camera.view.CameraController.COORDINATE_SYSTEM_VIEW_REFERENCED
+import androidx.camera.view.LifecycleCameraController
+import androidx.camera.view.PreviewView
+import androidx.core.util.Consumer
+import androidx.fragment.app.DialogFragment
+import com.google.mlkit.vision.barcode.BarcodeScanner
+import com.google.mlkit.vision.barcode.BarcodeScannerOptions
+import com.google.mlkit.vision.barcode.BarcodeScanning
+import com.google.mlkit.vision.barcode.common.Barcode
+import com.microsoft.reacttestapp.R
+import java.util.concurrent.Executors
+
+class QRCodeScannerFragment(
+    private val mainThreadHandler: Handler,
+    private val consumer: Consumer<String>
+) : DialogFragment() {
+
+    companion object {
+        const val TAG = "QRCodeScannerFragment"
+    }
+
+    private var barcodeScanner: BarcodeScanner? = null
+
+    private val cameraController by lazy {
+        LifecycleCameraController(requireContext())
+    }
+
+    private val cameraExecutor by lazy {
+        Executors.newSingleThreadExecutor()
+    }
+
+    override fun onCreate(savedInstanceState: Bundle?) {
+        super.onCreate(savedInstanceState)
+
+        val scanner = BarcodeScanning.getClient(
+            BarcodeScannerOptions.Builder()
+                .setBarcodeFormats(Barcode.FORMAT_QR_CODE)
+                .build()
+        )
+
+        cameraController.imageCaptureMode = CAPTURE_MODE_MINIMIZE_LATENCY
+        cameraController.setImageAnalysisAnalyzer(
+            cameraExecutor,
+            MlKitAnalyzer(
+                listOf(scanner),
+                COORDINATE_SYSTEM_VIEW_REFERENCED,
+                cameraExecutor
+            ) {
+                it.getValue(scanner)?.let { barcodes ->
+                    for (barcode in barcodes) {
+                        when (barcode.valueType) {
+                            Barcode.TYPE_URL -> {
+                                // Close the scanner otherwise it will keep posting results
+                                scanner.close()
+                                mainThreadHandler.post {
+                                    dismiss()
+                                    consumer.accept(barcode.url?.url)
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+        )
+
+        barcodeScanner = scanner
+    }
+
+    override fun onCreateView(
+        inflater: LayoutInflater,
+        container: ViewGroup?,
+        savedInstanceState: Bundle?
+    ): View {
+        val view = inflater.inflate(R.layout.camera_view, container, false)
+        cameraController.bindToLifecycle(viewLifecycleOwner)
+
+        val previewView = view.findViewById<PreviewView>(R.id.preview_view)
+        previewView.controller = cameraController
+
+        return view
+    }
+
+    override fun onStart() {
+        super.onStart()
+        dialog?.window?.setLayout(
+            ViewGroup.LayoutParams.MATCH_PARENT,
+            ViewGroup.LayoutParams.MATCH_PARENT
+        )
+    }
+
+    override fun onDestroyView() {
+        super.onDestroyView()
+        barcodeScanner?.close()
+    }
+}
diff --git a/android/app/src/main/AndroidManifest.xml b/android/app/src/main/AndroidManifest.xml
@@ -3,7 +3,10 @@
     xmlns:tools="http://schemas.android.com/tools"
     package="com.microsoft.reacttestapp">
 
+    <uses-feature android:name="android.hardware.camera.any" />
+
     <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
+    <uses-permission android:name="android.permission.CAMERA" />
     <uses-permission android:name="android.permission.INTERNET" />
 
     <application
diff --git a/android/app/src/main/java/com/microsoft/reacttestapp/MainActivity.kt b/android/app/src/main/java/com/microsoft/reacttestapp/MainActivity.kt
@@ -3,15 +3,20 @@ package com.microsoft.reacttestapp
 import android.app.Activity
 import android.content.Intent
 import android.os.Bundle
+import android.os.Looper
 import android.view.LayoutInflater
 import android.widget.TextView
+import androidx.core.os.HandlerCompat
 import androidx.recyclerview.widget.DividerItemDecoration
 import androidx.recyclerview.widget.LinearLayoutManager
 import androidx.recyclerview.widget.RecyclerView
 import com.facebook.react.ReactActivity
 import com.facebook.react.bridge.ReactContext
 import com.facebook.react.modules.systeminfo.ReactNativeVersion
+import com.facebook.react.packagerconnection.PackagerConnectionSettings
 import com.google.android.material.appbar.MaterialToolbar
+import com.microsoft.reacttestapp.camera.canUseCamera
+import com.microsoft.reacttestapp.camera.scanForQrCode
 import com.microsoft.reacttestapp.component.ComponentActivity
 import com.microsoft.reacttestapp.component.ComponentBottomSheetDialogFragment
 import com.microsoft.reacttestapp.component.ComponentListAdapter
@@ -20,6 +25,15 @@ import com.microsoft.reacttestapp.manifest.Component
 import com.microsoft.reacttestapp.react.BundleSource
 
 class MainActivity : ReactActivity() {
+
+    companion object {
+        const val REQUEST_CODE_PERMISSIONS = 42
+    }
+
+    val mainThreadHandler by lazy {
+        HandlerCompat.createAsync(Looper.getMainLooper())
+    }
+
     private var didInitialNavigation = false
 
     private val newComponentViewModel = { component: Component ->
@@ -76,7 +90,7 @@ class MainActivity : ReactActivity() {
                 didInitialNavigation =
                     savedInstanceState?.getBoolean("didInitialNavigation", false) == true
 
-                if (components.count() > 0) {
+                if (components.isNotEmpty()) {
                     val index =
                         if (components.count() == 1) 0 else session.lastOpenedComponent(checksum)
                     index?.let {
@@ -97,7 +111,7 @@ class MainActivity : ReactActivity() {
                 setupRecyclerView(components, checksum)
             }
 
-            components.count() > 0 -> {
+            components.isNotEmpty() -> {
                 val slug = BuildConfig.ReactTestApp_singleApp
                 val component = components.find { it.slug == slug }
                     ?: throw IllegalArgumentException("No component with slug: $slug")
@@ -111,6 +125,20 @@ class MainActivity : ReactActivity() {
         }
     }
 
+    override fun onRequestPermissionsResult(
+        requestCode: Int,
+        permissions: Array<out String>,
+        grantResults: IntArray
+    ) {
+        if (requestCode == REQUEST_CODE_PERMISSIONS) {
+            if (canUseCamera()) {
+                scanForQrCode()
+            }
+        } else {
+            super.onRequestPermissionsResult(requestCode, permissions, grantResults)
+        }
+    }
+
     override fun onSaveInstanceState(outState: Bundle) {
         outState.putBoolean("didInitialNavigation", didInitialNavigation)
         super.onSaveInstanceState(outState)
@@ -158,6 +186,7 @@ class MainActivity : ReactActivity() {
                     true
                 }
                 R.id.load_from_dev_server -> {
+                    PackagerConnectionSettings(this).debugServerHost = ""
                     reload(BundleSource.Server)
                     true
                 }
@@ -167,6 +196,10 @@ class MainActivity : ReactActivity() {
                     session.shouldRememberLastComponent = enable
                     true
                 }
+                R.id.scan_qr_code -> {
+                    scanForQrCode()
+                    true
+                }
                 R.id.show_dev_options -> {
                     reactInstanceManager.devSupportManager.showDevOptionsDialog()
                     true
diff --git a/android/app/src/main/java/com/microsoft/reacttestapp/TestApp.kt b/android/app/src/main/java/com/microsoft/reacttestapp/TestApp.kt
@@ -1,5 +1,6 @@
 package com.microsoft.reacttestapp
 
+import android.app.Activity
 import android.app.Application
 import android.content.Context
 import com.facebook.react.PackageList
@@ -17,6 +18,10 @@ class TestApp : Application(), ReactApplication {
     private lateinit var reactNativeBundleNameProvider: ReactBundleNameProvider
     private lateinit var reactNativeHostInternal: TestAppReactNativeHost
 
+    fun reloadJSFromServer(activity: Activity?, bundleURL: String) {
+        reactNativeHostInternal.reloadJSFromServer(activity, bundleURL)
+    }
+
     override fun onCreate() {
         super.onCreate()
 
diff --git a/android/app/src/main/java/com/microsoft/reacttestapp/component/ComponentActivity.kt b/android/app/src/main/java/com/microsoft/reacttestapp/component/ComponentActivity.kt
@@ -92,6 +92,7 @@ class ComponentActivity : ReactActivity() {
 
     override fun onOptionsItemSelected(item: MenuItem): Boolean {
         if (android.R.id.home == item.itemId) {
+            @Suppress("DEPRECATION")
             onBackPressed()
             return true
         }
diff --git a/android/app/src/main/java/com/microsoft/reacttestapp/react/TestAppReactNativeHost.kt b/android/app/src/main/java/com/microsoft/reacttestapp/react/TestAppReactNativeHost.kt
@@ -3,6 +3,7 @@ package com.microsoft.reacttestapp.react
 import android.app.Activity
 import android.app.Application
 import android.content.Context
+import android.net.Uri
 import android.util.Log
 import com.facebook.hermes.reactexecutor.HermesExecutorFactory
 import com.facebook.react.PackageList
@@ -19,6 +20,7 @@ import com.facebook.react.devsupport.DevServerHelper
 import com.facebook.react.devsupport.InspectorPackagerConnection.BundleStatus
 import com.facebook.react.devsupport.interfaces.DevSupportManager
 import com.facebook.react.modules.systeminfo.ReactNativeVersion
+import com.facebook.react.packagerconnection.PackagerConnectionSettings
 import com.facebook.soloader.SoLoader
 import com.microsoft.reacttestapp.BuildConfig
 import com.microsoft.reacttestapp.R
@@ -134,6 +136,17 @@ class TestAppReactNativeHost(
         onBundleSourceChanged?.invoke(newSource)
     }
 
+    fun reloadJSFromServer(activity: Activity?, bundleURL: String) {
+        val uri = Uri.parse(bundleURL)
+        PackagerConnectionSettings(activity).debugServerHost =
+            if (uri.port > 0) {
+                "${uri.host}:${uri.port}"
+            } else {
+                uri.host
+            }
+        reload(activity, BundleSource.Server)
+    }
+
     override fun createReactInstanceManager(): ReactInstanceManager {
         ReactMarker.logMarker(ReactMarkerConstants.BUILD_REACT_INSTANCE_MANAGER_START)
         val reactInstanceManager = ReactInstanceManager.builder()
diff --git a/android/app/src/main/res/layout/camera_view.xml b/android/app/src/main/res/layout/camera_view.xml
@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="utf-8"?>
+<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent">
+
+    <androidx.camera.view.PreviewView
+        android:id="@+id/preview_view"
+        android:layout_width="match_parent"
+        android:layout_height="match_parent" />
+
+</FrameLayout>
diff --git a/android/app/src/main/res/menu/top_app_bar.xml b/android/app/src/main/res/menu/top_app_bar.xml
@@ -17,6 +17,11 @@
         android:contentDescription="@string/content_description_remember_last_component"
         android:title="@string/remember_last_component"
         app:showAsAction="never" />
+    <item
+        android:id="@+id/scan_qr_code"
+        android:contentDescription="@string/content_description_scan_qr_code"
+        android:title="@string/scan_qr_code"
+        app:showAsAction="never" />
     <item
         android:id="@+id/show_dev_options"
         android:contentDescription="@string/content_description_show_dev_options"
diff --git a/android/app/src/main/res/values/strings.xml b/android/app/src/main/res/values/strings.xml
diff --git a/android/app/src/no-camera/java/com/microsoft/reacttestapp/camera/MainActivityExtensions.kt b/android/app/src/no-camera/java/com/microsoft/reacttestapp/camera/MainActivityExtensions.kt
diff --git a/android/app/src/test/java/com/microsoft/reacttestapp/ManifestTest.kt b/android/app/src/test/java/com/microsoft/reacttestapp/ManifestTest.kt
diff --git a/android/dependencies.gradle b/android/dependencies.gradle
diff --git a/android/test-app-util.gradle b/android/test-app-util.gradle

Original file line number	Diff line number	Diff line change
`@@ -92,6 +92,7 @@ class ComponentActivity : ReactActivity() {`
`92`	`92`
`93`	`93`	`override fun onOptionsItemSelected(item: MenuItem): Boolean {`
`94`	`94`	`if (android.R.id.home == item.itemId) {`
	`95`	`+ @Suppress("DEPRECATION")`
`95`	`96`	`onBackPressed()`
`96`	`97`	`return true`
`97`	`98`	`}`