Scan Screen Adjustements

app/src/main/java/to/bitkit/ui/screens/scanner/QrScanningScreen.kt

@@ -10,13 +10,19 @@ import androidx.camera.core.ImageAnalysis
 import androidx.camera.core.Preview
 import androidx.camera.lifecycle.ProcessCameraProvider
 import androidx.camera.view.PreviewView
-import androidx.compose.foundation.Canvas
 import androidx.compose.foundation.background
-import androidx.compose.foundation.border
 import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material.Icon
+import androidx.compose.material.IconButton
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.DisposableEffect
 import androidx.compose.runtime.LaunchedEffect
@@ -27,15 +33,10 @@ import androidx.compose.runtime.remember
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
 import androidx.compose.ui.draw.clipToBounds
-import androidx.compose.ui.geometry.CornerRadius
-import androidx.compose.ui.geometry.Offset
-import androidx.compose.ui.geometry.Rect
-import androidx.compose.ui.geometry.Size
-import androidx.compose.ui.graphics.BlendMode
-import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.platform.LocalContext
-import androidx.compose.ui.platform.LocalDensity
+import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.viewinterop.AndroidView
@@ -49,9 +50,11 @@ import kotlinx.coroutines.Dispatchers
 import kotlinx.coroutines.withContext
 import to.bitkit.R
 import to.bitkit.ui.appViewModel
+import to.bitkit.ui.components.PrimaryButton
 import to.bitkit.ui.scaffold.AppTopBar
 import to.bitkit.ui.scaffold.ScreenColumn
 import to.bitkit.ui.shared.util.gradientBackground
+import to.bitkit.ui.theme.Colors
 import to.bitkit.utils.Logger
 import java.util.concurrent.Executors
 
@@ -65,6 +68,7 @@ fun QrScanningScreen(
     // TODO maybe replace & drop accompanist permissions
     val cameraPermissionState = rememberPermissionState(Manifest.permission.CAMERA)
     val lensFacing by remember { mutableIntStateOf(CameraSelector.LENS_FACING_BACK) }
+    var isFlashlightOn by remember { mutableStateOf(false) }
 
     val lifecycleOwner = LocalLifecycleOwner.current
     DisposableEffect(lifecycleOwner) {
@@ -140,7 +144,10 @@ fun QrScanningScreen(
         grantedContent = {
             ScreenColumn(modifier = Modifier.gradientBackground()) {
                 AppTopBar(stringResource(R.string.title_scan), onBackClick = { navController.popBackStack() })
-                Content(previewView = previewView)
+                Content(previewView = previewView, onClickCamera = {
+                    isFlashlightOn = !isFlashlightOn
+                    camera?.cameraControl?.enableTorch(isFlashlightOn)
+                })
             }
         }
     )
@@ -149,46 +156,75 @@ fun QrScanningScreen(
 @Composable
 private fun Content(
     previewView: PreviewView,
+    onClickCamera : () -> Unit,
     modifier: Modifier = Modifier,
 ) {
-    Box(modifier = modifier.fillMaxSize()) {
-        AndroidView(
-            modifier = Modifier
-                .fillMaxSize()
-                .clipToBounds(),
-            factory = { previewView.apply { setLayerType(LAYER_TYPE_HARDWARE, null) } }
-        )
-        val (widthInPx, heightInPx, radiusInPx) = with(LocalDensity.current) {
-            remember {
-                Triple(350.dp.toPx(), 350.dp.toPx(), 16.dp.toPx())
-            }
-        }
-
+    Column(
+        modifier = modifier
+            .fillMaxSize()
+            .padding(horizontal = 16.dp)
+    ) {
         Box(
-            modifier = Modifier
-                .fillMaxSize()
-                .background(Color.Black.copy(alpha = .5f)),
-            contentAlignment = Alignment.Center,
+            modifier = modifier
+                .fillMaxWidth()
+                .clip(RoundedCornerShape(16.dp))
+                .weight(1f)
         ) {
-            Canvas(
+            AndroidView(
+                modifier = Modifier
+                    .fillMaxSize()
+                    .clipToBounds(),
+                factory = { previewView.apply { setLayerType(LAYER_TYPE_HARDWARE, null) } }
+            )
+
+            IconButton(
+                onClick = {}, //TODO IMPLEMENT
                 modifier = Modifier
-                    .size(350.dp)
-                    .border(1.dp, Color.White, RoundedCornerShape(16.dp))
+                    .padding(16.dp)
+                    .clip(CircleShape)
+                    .background(
+                        Colors.White64
+                    )
+                    .size(48.dp)
+                    .align(Alignment.TopStart)
             ) {
-                val offset = Offset(
-                    x = (size.width - widthInPx) / 2,
-                    y = (size.height - heightInPx) / 2,
+                Icon(
+                    painter = painterResource(R.drawable.ic_image_square),
+                    contentDescription = null,
+                    tint = Colors.White
                 )
-                val cutoutRect = Rect(offset, Size(widthInPx, heightInPx))
+            }
 
-                drawRoundRect(
-                    topLeft = cutoutRect.topLeft,
-                    size = cutoutRect.size,
-                    cornerRadius = CornerRadius(radiusInPx, radiusInPx),
-                    color = Color.Transparent,
-                    blendMode = BlendMode.Clear
+            IconButton(
+                onClick = onClickCamera,
+                modifier = Modifier
+                    .padding(16.dp)
+                    .clip(CircleShape)
+                    .background(
+                        Colors.White64
+                    )
+                    .size(48.dp)
+                    .align(Alignment.TopEnd)
+            ) {
+                Icon(
+                    painter = painterResource(R.drawable.ic_flashlight),
+                    contentDescription = null,
+                    tint = Colors.White
                 )
             }
         }
+        Spacer(modifier = Modifier.height(16.dp))
+        PrimaryButton(
+            icon = {
+                Icon(
+                    painterResource(R.drawable.ic_clipboard_text_simple),
+                    contentDescription = null,
+                    tint = Colors.White
+                )
+            },
+            text = stringResource(R.string.other__qr_paste),
+            onClick = {} //TODO IMPLEMENT
+        )
+        Spacer(modifier = Modifier.height(16.dp))
     }
 }

app/src/main/res/drawable/ic_flashlight.xml

@@ -0,0 +1,23 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="24"
+    android:viewportHeight="24">
+  <path
+      android:pathData="M18,7.25C18,7.412 17.947,7.57 17.85,7.7L15.9,10.3C15.803,10.43 15.75,10.588 15.75,10.75V21C15.75,21.199 15.671,21.39 15.53,21.53C15.39,21.671 15.199,21.75 15,21.75H9C8.801,21.75 8.61,21.671 8.47,21.53C8.329,21.39 8.25,21.199 8.25,21V10.75C8.25,10.588 8.197,10.43 8.1,10.3L6.15,7.7C6.053,7.57 6,7.412 6,7.25V6H18V7.25Z"
+      android:strokeAlpha="0.2"
+      android:fillColor="#ffffff"
+      android:fillAlpha="0.2"/>
+  <path
+      android:pathData="M5.689,1.939C5.971,1.658 6.352,1.5 6.75,1.5H17.25C17.648,1.5 18.029,1.658 18.311,1.939C18.592,2.221 18.75,2.602 18.75,3V7.25C18.75,7.575 18.645,7.89 18.45,8.15L16.5,10.75L16.5,21C16.5,21.398 16.342,21.779 16.061,22.061C15.779,22.342 15.398,22.5 15,22.5H9C8.602,22.5 8.221,22.342 7.939,22.061C7.658,21.779 7.5,21.398 7.5,21L7.5,10.75L5.55,8.15C5.355,7.89 5.25,7.575 5.25,7.25V3C5.25,2.602 5.408,2.221 5.689,1.939ZM6.75,3L6.75,7.25L8.7,9.85C8.895,10.11 9,10.425 9,10.75V21H15V10.75C15,10.425 15.105,10.11 15.3,9.85L17.25,7.25V3H6.75Z"
+      android:fillColor="#ffffff"
+      android:fillType="evenOdd"/>
+  <path
+      android:pathData="M12,10.5C12.414,10.5 12.75,10.836 12.75,11.25V14.25C12.75,14.664 12.414,15 12,15C11.586,15 11.25,14.664 11.25,14.25V11.25C11.25,10.836 11.586,10.5 12,10.5Z"
+      android:fillColor="#ffffff"
+      android:fillType="evenOdd"/>
+  <path
+      android:pathData="M5.25,6C5.25,5.586 5.586,5.25 6,5.25H18C18.414,5.25 18.75,5.586 18.75,6C18.75,6.414 18.414,6.75 18,6.75H6C5.586,6.75 5.25,6.414 5.25,6Z"
+      android:fillColor="#ffffff"
+      android:fillType="evenOdd"/>
+</vector>

app/src/main/res/drawable/ic_image_square.xml

@@ -0,0 +1,22 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="24"
+    android:viewportHeight="24">
+  <path
+      android:pathData="M3.75,16.5V4.5C3.75,4.301 3.829,4.11 3.97,3.97C4.11,3.829 4.301,3.75 4.5,3.75H19.5C19.699,3.75 19.89,3.829 20.03,3.97C20.171,4.11 20.25,4.301 20.25,4.5V15L20.25,15L16.28,11.03C16.14,10.89 15.949,10.811 15.75,10.811C15.551,10.811 15.36,10.89 15.22,11.03L11.03,15.22C10.89,15.36 10.699,15.439 10.5,15.439C10.301,15.439 10.11,15.36 9.97,15.22L8.03,13.28C7.89,13.14 7.699,13.061 7.5,13.061C7.301,13.061 7.11,13.14 6.97,13.28L3.75,16.5Z"
+      android:strokeAlpha="0.2"
+      android:fillColor="#ffffff"
+      android:fillAlpha="0.2"/>
+  <path
+      android:pathData="M9.375,9.75C9.996,9.75 10.5,9.246 10.5,8.625C10.5,8.004 9.996,7.5 9.375,7.5C8.754,7.5 8.25,8.004 8.25,8.625C8.25,9.246 8.754,9.75 9.375,9.75Z"
+      android:fillColor="#ffffff"/>
+  <path
+      android:pathData="M3,4.5C3,3.672 3.672,3 4.5,3H19.5C20.328,3 21,3.672 21,4.5V19.5C21,20.328 20.328,21 19.5,21H4.5C3.672,21 3,20.328 3,19.5V4.5ZM19.5,4.5H4.5V19.5H19.5V4.5Z"
+      android:fillColor="#ffffff"
+      android:fillType="evenOdd"/>
+  <path
+      android:pathData="M14.689,10.5C14.971,10.219 15.352,10.061 15.75,10.061C16.148,10.061 16.529,10.219 16.811,10.5L16.28,11.03L16.811,10.5L20.78,14.469C21.073,14.762 21.073,15.237 20.78,15.53C20.487,15.823 20.013,15.823 19.72,15.53L15.75,11.561L11.561,15.75C11.279,16.031 10.898,16.189 10.5,16.189C10.102,16.189 9.721,16.031 9.439,15.75L7.5,13.811L4.28,17.03C3.987,17.323 3.513,17.323 3.22,17.03C2.927,16.737 2.927,16.263 3.22,15.97L6.439,12.75L6.944,13.255L6.439,12.75C6.721,12.469 7.102,12.311 7.5,12.311C7.898,12.311 8.279,12.469 8.561,12.75L8.03,13.28L8.561,12.75L10.5,14.689L14.689,10.5Z"
+      android:fillColor="#ffffff"
+      android:fillType="evenOdd"/>
+</vector>