diff --git a/app/src/main/java/dev/msfjarvis/todo/MainActivity.kt b/app/src/main/java/dev/msfjarvis/todo/MainActivity.kt index 9f130d04..d2321032 100644 --- a/app/src/main/java/dev/msfjarvis/todo/MainActivity.kt +++ b/app/src/main/java/dev/msfjarvis/todo/MainActivity.kt @@ -3,21 +3,33 @@ package dev.msfjarvis.todo import android.os.Bundle import androidx.appcompat.app.AppCompatActivity import androidx.compose.foundation.Text +import androidx.compose.foundation.clickable import androidx.compose.foundation.layout.padding import androidx.compose.foundation.lazy.LazyColumnFor +import androidx.compose.material.AlertDialog import androidx.compose.material.FloatingActionButton import androidx.compose.material.MaterialTheme +import androidx.compose.material.OutlinedTextField import androidx.compose.material.Scaffold import androidx.compose.material.TopAppBar import androidx.compose.runtime.Composable +import androidx.compose.runtime.MutableState import androidx.compose.runtime.collectAsState import androidx.compose.runtime.getValue +import androidx.compose.runtime.mutableStateOf +import androidx.compose.runtime.remember import androidx.compose.runtime.rememberCoroutineScope +import androidx.compose.runtime.setValue import androidx.compose.ui.Modifier import androidx.compose.ui.platform.setContent import androidx.compose.ui.semantics.semantics import androidx.compose.ui.semantics.testTag +import androidx.compose.ui.text.TextStyle +import androidx.compose.ui.text.font.FontStyle +import androidx.compose.ui.text.input.TextFieldValue +import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.unit.dp +import androidx.compose.ui.unit.sp import androidx.ui.tooling.preview.Preview import dev.msfjarvis.todo.compose.utils.IconResource import dev.msfjarvis.todo.data.model.TodoItem @@ -50,12 +62,20 @@ fun TodoApp( onAdd: (item: TodoItem) -> Unit, onDelete: (item: TodoItem) -> Unit, ) { + val showingDialog = remember { mutableStateOf(false) } + + if (showingDialog.value) { + ItemAddDialog( + showingDialog = showingDialog, + onAdd = onAdd, + ) + } Scaffold( topBar = { TopAppBar({ Text(text = "I can Compose?") }) }, floatingActionButton = { FloatingActionButton( - onClick = { onAdd.invoke(TodoItem("Item ${items.size + 1}")) }, + onClick = { showingDialog.value = true }, elevation = 8.dp, modifier = Modifier.semantics { testTag = "fab" } ) { @@ -76,6 +96,50 @@ fun TodoApp( ) } +@Composable +fun ItemAddDialog( + showingDialog: MutableState, + onAdd: (item: TodoItem) -> Unit, +) { + var newItemName by mutableStateOf(TextFieldValue("")) + AlertDialog( + onDismissRequest = { + showingDialog.value = false + }, + text = { + OutlinedTextField( + value = newItemName, + onValueChange = { newItemName = it }, + label = { + Text( + text = "Name", + ) + }, + ) + }, + title = { + Text( + text = "Create new item", + ) + }, + confirmButton = { + Text( + text = "Add", + modifier = Modifier.padding(16.dp).clickable(onClick = { + onAdd.invoke(TodoItem(newItemName.text)) + newItemName = TextFieldValue("") + showingDialog.value = false + }), + style = TextStyle( + fontSize = 18.sp, + textAlign = TextAlign.End, + fontStyle = FontStyle.Normal, + ), + ) + } + ) +} + @Preview @Composable fun PreviewApp() {