From be04c2648530f97d14572a67137c30c54cb37295 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Sylwester=20Zieli=C5=84ski?=
 <sylwester.zielinski@nordicsemi.no>
Date: Tue, 3 May 2022 14:57:53 +0200
Subject: [PATCH] Change scrollable for Output section

---
 .../android/uart/view/UARTContentView.kt      | 75 +++++++++++++------
 .../src/main/res/drawable/ic_sync_down.xml    | 11 +++
 .../main/res/drawable/ic_sync_down_off.xml    | 15 ++++
 profile_uart/src/main/res/values/strings.xml  |  2 +
 4 files changed, 79 insertions(+), 24 deletions(-)
 create mode 100644 profile_uart/src/main/res/drawable/ic_sync_down.xml
 create mode 100644 profile_uart/src/main/res/drawable/ic_sync_down_off.xml

diff --git a/profile_uart/src/main/java/no/nordicsemi/android/uart/view/UARTContentView.kt b/profile_uart/src/main/java/no/nordicsemi/android/uart/view/UARTContentView.kt
index 14f0a027..86d1614d 100644
--- a/profile_uart/src/main/java/no/nordicsemi/android/uart/view/UARTContentView.kt
+++ b/profile_uart/src/main/java/no/nordicsemi/android/uart/view/UARTContentView.kt
@@ -1,6 +1,9 @@
 package no.nordicsemi.android.uart.view
 
+import android.util.Log
 import androidx.compose.foundation.layout.*
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.foundation.lazy.rememberLazyListState
 import androidx.compose.foundation.rememberScrollState
 import androidx.compose.foundation.verticalScroll
 import androidx.compose.material.icons.Icons
@@ -8,9 +11,7 @@ import androidx.compose.material.icons.filled.Add
 import androidx.compose.material.icons.filled.Delete
 import androidx.compose.material.icons.filled.Edit
 import androidx.compose.material3.*
-import androidx.compose.runtime.Composable
-import androidx.compose.runtime.mutableStateOf
-import androidx.compose.runtime.rememberCoroutineScope
+import androidx.compose.runtime.*
 import androidx.compose.runtime.saveable.rememberSaveable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -215,6 +216,8 @@ private fun DeleteConfigurationDialog(onEvent: (UARTViewEvent) -> Unit, onDismis
 
 @Composable
 private fun OutputSection(records: List<UARTRecord>, onEvent: (UARTViewEvent) -> Unit) {
+    val scrollDown = remember { mutableStateOf(true) }
+
     Column(
         horizontalAlignment = Alignment.CenterHorizontally,
         modifier = Modifier.fillMaxSize()
@@ -227,41 +230,65 @@ private fun OutputSection(records: List<UARTRecord>, onEvent: (UARTViewEvent) ->
             SectionTitle(
                 resId = R.drawable.ic_output,
                 title = stringResource(R.string.uart_output),
-                modifier = Modifier
+                modifier = Modifier,
+                menu = { Menu(scrollDown, onEvent) }
             )
-
-            IconButton(onClick = { onEvent(ClearOutputItems) }) {
-                Icon(
-                    Icons.Default.Delete,
-                    contentDescription = "Clear items.",
-                )
-            }
         }
 
         Spacer(modifier = Modifier.size(16.dp))
 
-        val coroutineScope = rememberCoroutineScope()
-        val scrollState = rememberScrollState()
+        val listState = rememberLazyListState()
 
-        Column(modifier = Modifier
-            .fillMaxWidth()
-            .verticalScroll(scrollState)
-            .onGloballyPositioned {
-                coroutineScope.launch {
-                    scrollState.animateScrollTo(Int.MAX_VALUE)
-                }
-            }
+        LazyColumn(
+            userScrollEnabled = !scrollDown.value,
+            modifier = Modifier
+                .fillMaxWidth(),
+            state = listState
         ) {
             if (records.isEmpty()) {
-                Text(text = stringResource(id = R.string.uart_output_placeholder))
+                item { Text(text = stringResource(id = R.string.uart_output_placeholder)) }
             } else {
                 records.forEach {
-                    MessageItem(record = it)
+                    item {
+                        MessageItem(record = it)
 
-                    Spacer(modifier = Modifier.height(16.dp))
+                        Spacer(modifier = Modifier.height(16.dp))
+                    }
                 }
             }
         }
+
+        LaunchedEffect(records) {
+            if (!scrollDown.value || records.isEmpty()) {
+                return@LaunchedEffect
+            }
+            launch {
+                listState.scrollToItem(records.lastIndex)
+            }
+        }
+    }
+}
+
+@Composable
+private fun Menu(scrollDown: MutableState<Boolean>, onEvent: (UARTViewEvent) -> Unit) {
+    val icon = when (scrollDown.value) {
+        true -> R.drawable.ic_sync_down_off
+        false -> R.drawable.ic_sync_down
+    }
+    Row {
+        IconButton(onClick = { scrollDown.value = !scrollDown.value }) {
+            Icon(
+                painter = painterResource(id = icon),
+                contentDescription = stringResource(id = R.string.uart_scroll_down)
+            )
+        }
+
+        IconButton(onClick = { onEvent(ClearOutputItems) }) {
+            Icon(
+                Icons.Default.Delete,
+                contentDescription = stringResource(id = R.string.uart_clear_items),
+            )
+        }
     }
 }
 
diff --git a/profile_uart/src/main/res/drawable/ic_sync_down.xml b/profile_uart/src/main/res/drawable/ic_sync_down.xml
new file mode 100644
index 00000000..43315763
--- /dev/null
+++ b/profile_uart/src/main/res/drawable/ic_sync_down.xml
@@ -0,0 +1,11 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:tint="#000000"
+    android:viewportWidth="24"
+    android:viewportHeight="24">
+
+    <path
+        android:fillColor="@android:color/white"
+        android:pathData="M3.8,12.18c-0.2,-0.86 -0.3,-1.76 -0.3,-2.68c0,-2.84 0.99,-5.45 2.63,-7.5L7.2,3.07C5.82,4.85 5,7.08 5,9.5c0,0.88 0.11,1.74 0.32,2.56l1.62,-1.62L8,11.5L4.5,15L1,11.5l1.06,-1.06L3.8,12.18zM13.85,11.62l-2.68,-5.37c-0.37,-0.74 -1.27,-1.04 -2.01,-0.67C8.41,5.96 8.11,6.86 8.48,7.6l4.81,9.6L10.05,18c-0.33,0.09 -0.59,0.33 -0.7,0.66L9,19.78l6.19,2.25c0.5,0.17 1.28,0.02 1.75,-0.22l5.51,-2.75c0.89,-0.45 1.32,-1.48 1,-2.42l-1.43,-4.27c-0.27,-0.82 -1.04,-1.37 -1.9,-1.37h-4.56c-0.31,0 -0.62,0.07 -0.89,0.21L13.85,11.62" />
+</vector>
diff --git a/profile_uart/src/main/res/drawable/ic_sync_down_off.xml b/profile_uart/src/main/res/drawable/ic_sync_down_off.xml
new file mode 100644
index 00000000..2b431aa6
--- /dev/null
+++ b/profile_uart/src/main/res/drawable/ic_sync_down_off.xml
@@ -0,0 +1,15 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:tint="#000000"
+    android:viewportWidth="24"
+    android:viewportHeight="24">
+    <path
+        android:fillColor="@android:color/white"
+        android:pathData="M3.8,12.18c-0.2,-0.86 -0.3,-1.76 -0.3,-2.68c0,-2.84 0.99,-5.45 2.63,-7.5L7.2,3.07C5.82,4.85 5,7.08 5,9.5c0,0.88 0.11,1.74 0.32,2.56l1.62,-1.62L8,11.5L4.5,15L1,11.5l1.06,-1.06L3.8,12.18zM13.85,11.62l-2.68,-5.37c-0.37,-0.74 -1.27,-1.04 -2.01,-0.67C8.41,5.96 8.11,6.86 8.48,7.6l4.81,9.6L10.05,18c-0.33,0.09 -0.59,0.33 -0.7,0.66L9,19.78l6.19,2.25c0.5,0.17 1.28,0.02 1.75,-0.22l5.51,-2.75c0.89,-0.45 1.32,-1.48 1,-2.42l-1.43,-4.27c-0.27,-0.82 -1.04,-1.37 -1.9,-1.37h-4.56c-0.31,0 -0.62,0.07 -0.89,0.21L13.85,11.62" />
+
+    <path
+        android:fillColor="@android:color/white"
+        android:pathData="M19,6.41L17.59,5 12,10.59 6.41,5 5,6.41 10.59,12 5,17.59 6.41,19 12,13.41 17.59,19 19,17.59 13.41,12z" />
+
+</vector>
diff --git a/profile_uart/src/main/res/values/strings.xml b/profile_uart/src/main/res/values/strings.xml
index 7a069e45..9593605b 100644
--- a/profile_uart/src/main/res/values/strings.xml
+++ b/profile_uart/src/main/res/values/strings.xml
@@ -53,6 +53,8 @@
     <string name="uart_delete_dialog_confirm">Confirm</string>
     <string name="uart_delete_dialog_cancel">Cancel</string>
 
+    <string name="uart_clear_items">Clear items.</string>
+    <string name="uart_scroll_down">Click to constantly scroll view to the latest available log.</string>
     <string name="uart_input_log">--&gt; %s</string>
     <string name="uart_output_log" tools:ignore="TypographyDashes">&lt;-- %s</string>
 </resources>