fixed bug with back button navigation, color

app/src/main/java/com/example/to_docompose/ui/screens/list/EmptyContent.kt

@@ -1,5 +1,6 @@
 package com.example.to_docompose.ui.screens.list
 
+import androidx.compose.foundation.isSystemInDarkTheme
 import androidx.compose.foundation.layout.*
 import androidx.compose.material.*
 import androidx.compose.runtime.Composable
@@ -12,11 +13,12 @@ import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import com.example.to_docompose.R
+import com.example.to_docompose.ui.theme.LightColorBackground
 
 @Composable
 @Preview
 fun EmptyContent() {
-    Surface(modifier = Modifier.fillMaxSize()) {
+    Surface(modifier = Modifier.fillMaxSize(), color = if(isSystemInDarkTheme()) LocalContentColor.current else LightColorBackground) {
         Column(
             horizontalAlignment = Alignment.CenterHorizontally,
             verticalArrangement = Arrangement.Center,
@@ -26,7 +28,9 @@ fun EmptyContent() {
             Icon(
                 painter = painterResource(id = R.drawable.empty_note),
                 contentDescription = "Sad Face",
-                modifier = Modifier.alpha(ContentAlpha.medium).size(128.dp)
+                modifier = Modifier
+                    .alpha(ContentAlpha.medium)
+                    .size(128.dp)
             )
             Text(
                 text = stringResource(R.string.empty_container_string),

app/src/main/java/com/example/to_docompose/ui/screens/list/List Screen.kt

@@ -1,26 +1,29 @@
 package com.example.to_docompose.ui.screens.list
 
 import android.annotation.SuppressLint
-import android.util.Log
+import androidx.compose.foundation.isSystemInDarkTheme
+import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.material.*
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.outlined.Add
 import androidx.compose.runtime.*
+import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.tooling.preview.Preview
 import com.example.to_docompose.R
 import com.example.to_docompose.data.models.Priority
+import com.example.to_docompose.ui.theme.DarkColorBackground
+import com.example.to_docompose.ui.theme.LightColorBackground
 import com.example.to_docompose.ui.util.Action
 import com.example.to_docompose.ui.util.RequestState
 import com.example.to_docompose.ui.viewmodels.SharedViewModel
-import kotlinx.coroutines.delay
 import kotlinx.coroutines.launch
 
 @SuppressLint("UnusedMaterialScaffoldPaddingParameter")
 @Composable
 fun ListScreen(
-    onTaskClick: (Int) -> Unit = {},
+    onTaskClick: (Int) -> Unit,
     sharedViewModel: SharedViewModel
 ) {
     //called everytime list screen opens to have updated task
@@ -53,9 +56,19 @@ fun ListScreen(
     Scaffold(
         scaffoldState = scaffoldState,
         content = @Composable {
-            ListContent(allTasks = allTask, toTaskScreen = onTaskClick, searchedTasks = searchedTask, searchAppBarState = listAppBarState) {
-                sharedViewModel.updateFieldsWithCurrentSelectedTask(it)
-                sharedViewModel.action.value = Action.DELETE
+            Surface(
+                modifier = Modifier.fillMaxSize(),
+                color = if (isSystemInDarkTheme()) MaterialTheme.colors.surface else LightColorBackground
+            ) {
+                ListContent(
+                    allTasks = allTask,
+                    toTaskScreen = onTaskClick,
+                    searchedTasks = searchedTask,
+                    searchAppBarState = listAppBarState
+                ) {
+                    sharedViewModel.updateFieldsWithCurrentSelectedTask(it)
+                    sharedViewModel.action.value = Action.DELETE
+                }
             }
         },
         floatingActionButton = { ListScreenFAB(

app/src/main/java/com/example/to_docompose/ui/screens/list/ListContent.kt

@@ -13,12 +13,14 @@ import androidx.compose.foundation.isSystemInDarkTheme
 import androidx.compose.foundation.layout.*
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.lazy.items
+import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material.*
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.Delete
 import androidx.compose.runtime.*
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.RectangleShape
 import androidx.compose.ui.res.stringResource
@@ -43,44 +45,54 @@ fun ListContent(
     toTaskScreen: (Int) -> Unit,
     searchAppBarState: ListAppBarState,
     onSwipeToDismiss: (ToDoTask) -> Unit,
-){
-    if(searchAppBarState == ListAppBarState.TRIGGERED){
-        if(searchedTasks is RequestState.Loading)
+) {
+    if (searchAppBarState == ListAppBarState.TRIGGERED) {
+        if (searchedTasks is RequestState.Loading)
             LoadingList()
-        else if(searchedTasks is RequestState.Success)
-            DisplayContent(tasks = searchedTasks.data, toTaskScreen = toTaskScreen, onSwipeToDismiss)
-    }
-    else{
-        if(allTasks is RequestState.Loading)
+        else if (searchedTasks is RequestState.Success)
+            DisplayContent(
+                tasks = searchedTasks.data,
+                toTaskScreen = toTaskScreen,
+                onSwipeToDismiss
+            )
+    } else {
+        if (allTasks is RequestState.Loading)
             LoadingList()
         else if (allTasks is RequestState.Success)
-        DisplayContent(tasks = allTasks.data, toTaskScreen = toTaskScreen, onSwipeToDismiss)
+            DisplayContent(tasks = allTasks.data, toTaskScreen = toTaskScreen, onSwipeToDismiss)
     }
 }
 
 @Composable
-fun DisplayContent(tasks: List<ToDoTask>, toTaskScreen: (Int) -> Unit, onSwipeToDismiss: (ToDoTask) -> Unit){
-    if(tasks.isEmpty())
+fun DisplayContent(
+    tasks: List<ToDoTask>,
+    toTaskScreen: (Int) -> Unit,
+    onSwipeToDismiss: (ToDoTask) -> Unit
+) {
+    if (tasks.isEmpty())
         EmptyContent()
     else
         DisplayTask(tasks = tasks, toTaskScreen = toTaskScreen, onSwipeToDismiss = onSwipeToDismiss)
 }
 
 @OptIn(ExperimentalMaterialApi::class)
 @Composable
-fun DisplayTask(tasks: List<ToDoTask>, toTaskScreen: (Int) -> Unit, onSwipeToDismiss: (ToDoTask) -> Unit){
-    LazyColumn{
+fun DisplayTask(
+    tasks: List<ToDoTask>,
+    toTaskScreen: (Int) -> Unit,
+    onSwipeToDismiss: (ToDoTask) -> Unit
+) {
+    LazyColumn() {
         items(
             items = tasks,
             key = {
                 it.hashCode()
             }
-        ){ task ->
+        ) { task ->
             val scope = rememberCoroutineScope()
             var itemAppeared by remember { mutableStateOf(false) }
             val dismissedState = rememberDismissState(confirmStateChange = {
-                if(it == DismissValue.DismissedToStart)
-                {
+                if (it == DismissValue.DismissedToStart) {
                     scope.launch {
                         itemAppeared = false
                         delay(300)
@@ -90,21 +102,30 @@ fun DisplayTask(tasks: List<ToDoTask>, toTaskScreen: (Int) -> Unit, onSwipeToDis
                 true
             })
 
-            val offsetX: Dp by animateDpAsState(if(dismissedState.targetValue == DismissValue.Default) (-70).dp else 0.dp)
-            val dismissedBackground: Color by animateColorAsState(if(dismissedState.targetValue == DismissValue.Default) Color(0xFFFC5E03) else Color.Red)
-            LaunchedEffect(key1 = true){
+            val offsetX: Dp by animateDpAsState(if (dismissedState.targetValue == DismissValue.Default) (-70).dp else 0.dp)
+            val dismissedBackground: Color by animateColorAsState(
+                if (dismissedState.targetValue == DismissValue.Default) Color(
+                    0xFFFC5E03
+                ) else Color.Red
+            )
+            LaunchedEffect(key1 = true) {
                 itemAppeared = true
             }
             AnimatedVisibility(
-                visible=  itemAppeared,
+                visible = itemAppeared,
                 enter = expandVertically(animationSpec = tween(durationMillis = 300)),
                 exit = shrinkVertically(animationSpec = tween(durationMillis = 300)),
             ) {
                 SwipeToDismiss(
                     state = dismissedState,
-                    background = { DismissedBackground(offsetX = offsetX, background = dismissedBackground) },
+                    background = {
+                        DismissedBackground(
+                            offsetX = offsetX,
+                            background = dismissedBackground
+                        )
+                    },
                     directions = setOf(DismissDirection.EndToStart),
-                    dismissThresholds = {FractionalThreshold(.25f)},
+                    dismissThresholds = { FractionalThreshold(.25f) },
                     dismissContent = {
                         ListItem(toDoTask = task, toTaskScreen = toTaskScreen)
                     }
@@ -120,76 +141,87 @@ fun DisplayTask(tasks: List<ToDoTask>, toTaskScreen: (Int) -> Unit, onSwipeToDis
 fun ListItem(
     toDoTask: ToDoTask,
     toTaskScreen: (taskId: Int) -> Unit
-){
+) {
     Surface(
-        modifier = Modifier.fillMaxWidth(),
-        shape = RectangleShape,
-        elevation = 2.dp,
+        modifier = Modifier
+            .fillMaxWidth()
+            .padding(8.dp),
+        shape = RoundedCornerShape(12.dp),
+        elevation = 4.dp,
         onClick = { toTaskScreen(toDoTask.id) }) {
-            Column(modifier = Modifier
+        Column(
+            modifier = Modifier
                 .padding(all = 12.dp)
-                .fillMaxWidth()) {
+                .fillMaxWidth()
+        ) {
 
-                Row()
-                {
-                    Text(
-                        text = toDoTask.title,
-                        style = MaterialTheme.typography.h5,
-                        fontWeight = FontWeight.Bold,
-                        color = MaterialTheme.colors.primary,
-                        maxLines = 1,
-                        modifier = Modifier.weight(9f)
-                    )
-                    Box(modifier = Modifier
+            Row()
+            {
+                Text(
+                    text = toDoTask.title,
+                    style = MaterialTheme.typography.h5,
+                    fontWeight = FontWeight.Bold,
+                    color = MaterialTheme.colors.primary,
+                    maxLines = 1,
+                    modifier = Modifier.weight(9f)
+                )
+                Box(
+                    modifier = Modifier
                         .fillMaxWidth()
                         .padding(top = 6.dp)
-                        .weight(1f), contentAlignment = Alignment.TopEnd){
-                        Canvas(modifier = Modifier.size(16.dp)){
-                            drawCircle(color = toDoTask.priority.color)
-                        }
+                        .weight(1f), contentAlignment = Alignment.TopEnd
+                ) {
+                    Canvas(modifier = Modifier.size(16.dp)) {
+                        drawCircle(color = toDoTask.priority.color)
                     }
                 }
-                toDoTask.description?.let {
-                    Text(
-                        text = it,
-                        style = MaterialTheme.typography.subtitle1,
-                        maxLines = 2,
-                        overflow = TextOverflow.Ellipsis,
-                        modifier = Modifier.padding(top = 4.dp, start = 8.dp)
-                    )
-                }
             }
+            toDoTask.description?.let {
+                Text(
+                    text = it,
+                    style = MaterialTheme.typography.subtitle1,
+                    maxLines = 2,
+                    overflow = TextOverflow.Ellipsis,
+                    modifier = Modifier.padding(top = 4.dp, start = 8.dp)
+                )
+            }
+        }
     }
 }
 
 @Composable
-fun LoadingList(){
-    Box(modifier = Modifier.fillMaxSize(), contentAlignment = Alignment.Center){
+fun LoadingList() {
+    Box(modifier = Modifier.fillMaxSize(), contentAlignment = Alignment.Center) {
         DotsCollision()
     }
 }
 
 @Composable
-fun DismissedBackground(offsetX: Dp, background: Color){
-    Box(modifier = Modifier
-        .fillMaxSize()
-        .background(color = background),
-        contentAlignment = Alignment.CenterEnd
-    ){
-        Icon(
+fun DismissedBackground(offsetX: Dp, background: Color) {
+    Surface(shape = RoundedCornerShape(12.dp)) {
+        Box(
             modifier = Modifier
-                .padding(16.dp)
-                .offset(x = offsetX),
-            imageVector = Icons.Filled.Delete,
-            tint = if(isSystemInDarkTheme()) Color.Black else Color.White,
-            contentDescription = stringResource(R.string.delete_task),
-        )
+                .padding(8.dp)
+                .fillMaxSize()
+                .clip(RoundedCornerShape(13.dp))
+                .background(color = background),
+            contentAlignment = Alignment.CenterEnd
+        ) {
+            Icon(
+                modifier = Modifier
+                    .padding(16.dp)
+                    .offset(x = offsetX),
+                imageVector = Icons.Filled.Delete,
+                tint = if (isSystemInDarkTheme()) Color.Black else Color.White,
+                contentDescription = stringResource(R.string.delete_task),
+            )
+        }
     }
 }
 
 @Composable
 @Preview()
-fun ListItemPreview(){
+fun ListItemPreview() {
     ListItem(
         toDoTask = ToDoTask(
             title = "Long Long Again Long Sample Title",

app/src/main/java/com/example/to_docompose/ui/screens/task/TaskScreen.kt

@@ -4,6 +4,7 @@ import android.annotation.SuppressLint
 import android.content.Context
 import android.util.Log
 import android.widget.Toast
+import androidx.activity.compose.BackHandler
 import androidx.compose.material.Scaffold
 import androidx.compose.runtime.*
 import androidx.compose.ui.platform.LocalContext
@@ -20,6 +21,9 @@ fun TaskScreen(task: ToDoTask?, toListScreen: (Action) -> Unit, sharedViewModel:
     val desc by sharedViewModel.description
     val priority by sharedViewModel.priority
     val context = LocalContext.current
+    BackHandler(enabled = true) {
+        toListScreen(Action.NO_ACTION)
+    }
     Scaffold(topBar = {
         TaskAppBar(
             task = task,

app/src/main/java/com/example/to_docompose/ui/theme/Color.kt

@@ -14,7 +14,8 @@ val LowPriorityColor = Color(0XFF00C980)
 val MediumPriorityColor = Color(0XFFFFC114)
 val HighPriorityColor = Color(0XFFFF4646)
 val NonePriorityColor = Color.LightGray
-
+val LightColorBackground = Color(0xFEE9E5E9)
+val DarkColorBackground = Color(0xFE1F1F1F)
 val Colors.splashScreenBackground : Color
     @Composable
     get() = if(isSystemInDarkTheme()) Color.Black else Purple700