From 3b60a5bcaf042511dd355abc3c627fcf35411f0e Mon Sep 17 00:00:00 2001 From: Alex Baker Date: Fri, 18 Oct 2024 01:15:54 -0500 Subject: [PATCH] Add 'Add task' button to Android Wear Button doesn't do anything yet --- .../composeResources/values/strings.xml | 1 + wear/build.gradle.kts | 3 +- .../org/tasks/presentation/MainActivity.kt | 1 + .../presentation/screens/TaskListScreen.kt | 91 ++++++++++++------- .../org/tasks/presentation/theme/Theme.kt | 10 +- 5 files changed, 67 insertions(+), 39 deletions(-) diff --git a/kmp/src/commonMain/composeResources/values/strings.xml b/kmp/src/commonMain/composeResources/values/strings.xml index 93e45f6d3..88eff118d 100644 --- a/kmp/src/commonMain/composeResources/values/strings.xml +++ b/kmp/src/commonMain/composeResources/values/strings.xml @@ -28,4 +28,5 @@ yesterday Today today + Add task \ No newline at end of file diff --git a/wear/build.gradle.kts b/wear/build.gradle.kts index 253a64858..dec38b3fd 100644 --- a/wear/build.gradle.kts +++ b/wear/build.gradle.kts @@ -1,6 +1,7 @@ plugins { alias(libs.plugins.android.application) alias(libs.plugins.jetbrains.kotlin.android) + alias(libs.plugins.jetbrains.compose) alias(libs.plugins.kotlin.compose.compiler) } @@ -42,10 +43,10 @@ android { dependencies { coreLibraryDesugaring(libs.desugar.jdk.libs) + implementation(compose.components.resources) implementation(projects.wearDatalayer) implementation(projects.kmp) implementation(libs.play.services.wearable) - implementation(platform(libs.androidx.compose)) implementation(libs.androidx.paging.compose) implementation(libs.androidx.ui) implementation(libs.androidx.ui.graphics) diff --git a/wear/src/main/java/org/tasks/presentation/MainActivity.kt b/wear/src/main/java/org/tasks/presentation/MainActivity.kt index 567ae897d..42e57f634 100644 --- a/wear/src/main/java/org/tasks/presentation/MainActivity.kt +++ b/wear/src/main/java/org/tasks/presentation/MainActivity.kt @@ -62,6 +62,7 @@ class MainActivity : ComponentActivity() { uiItems = taskListItems, onComplete = { taskListViewModel.completeTask(it) }, onClick = { navController.navigate("task_edit/$it") }, + addTask = {}, ) } composable( diff --git a/wear/src/main/java/org/tasks/presentation/screens/TaskListScreen.kt b/wear/src/main/java/org/tasks/presentation/screens/TaskListScreen.kt index ab3b618c5..e8c903dc7 100644 --- a/wear/src/main/java/org/tasks/presentation/screens/TaskListScreen.kt +++ b/wear/src/main/java/org/tasks/presentation/screens/TaskListScreen.kt @@ -6,6 +6,7 @@ import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.padding import androidx.compose.material.icons.Icons +import androidx.compose.material.icons.outlined.Add import androidx.compose.material.icons.outlined.CheckBox import androidx.compose.material.icons.outlined.CheckBoxOutlineBlank import androidx.compose.material.icons.outlined.Repeat @@ -15,6 +16,7 @@ import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.Color import androidx.compose.ui.graphics.painter.ColorPainter import androidx.compose.ui.text.style.TextAlign +import androidx.compose.ui.text.style.TextOverflow import androidx.compose.ui.unit.dp import androidx.paging.compose.LazyPagingItems import androidx.wear.compose.material.Button @@ -28,8 +30,11 @@ import com.google.android.horologist.compose.layout.ScalingLazyColumn import com.google.android.horologist.compose.layout.ScreenScaffold import com.google.android.horologist.compose.layout.rememberResponsiveColumnState import com.google.android.horologist.compose.paging.items +import org.jetbrains.compose.resources.stringResource import org.tasks.GrpcProto import org.tasks.kmp.org.tasks.themes.ColorProvider +import tasks.kmp.generated.resources.Res +import tasks.kmp.generated.resources.add_task @OptIn(ExperimentalHorologistApi::class) @Composable @@ -37,6 +42,7 @@ fun TaskListScreen( uiItems: LazyPagingItems, onComplete: (Long) -> Unit, onClick: (Long) -> Unit, + addTask: () -> Unit, ) { val columnState = rememberResponsiveColumnState() ScreenScaffold( @@ -46,24 +52,59 @@ fun TaskListScreen( modifier = Modifier.fillMaxSize(), columnState = columnState, ) { + item { + TaskCard( + text = stringResource(Res.string.add_task), + icon = { + Icon( + imageVector = Icons.Outlined.Add, + tint = MaterialTheme.colors.onPrimary, + contentDescription = null, + modifier = Modifier.padding(12.dp), + ) + }, + backgroundColor = MaterialTheme.colors.primary, + contentColor = MaterialTheme.colors.onPrimary, + onClick = addTask, + ) + } items( items = uiItems, key = { item -> "${item.type}_${item.id}" }, ) { item -> if (item == null) { TaskCard( - task = GrpcProto.UiItem.getDefaultInstance(), - showCheckbox = false, - onComplete = {}, + text = "", + icon = {}, onClick = {}, ) } else { when (item.type) { GrpcProto.UiItemType.Task -> TaskCard( - task = item, - showCheckbox = true, - onComplete = { onComplete(item.id) }, + text = item.title, + icon = { + Button( + onClick = { onComplete(item.id) }, + colors = ButtonDefaults.iconButtonColors(), + ) { + Icon( + imageVector = when { + item.completed -> Icons.Outlined.CheckBox + item.repeating -> Icons.Outlined.Repeat + else -> Icons.Outlined.CheckBoxOutlineBlank + }, + tint = Color( + ColorProvider.priorityColor( + item.priority, + isDarkMode = true, + desaturate = true + ) + ), + contentDescription = null, + ) + } + }, onClick = { onClick(item.id) }, ) @@ -95,44 +136,26 @@ fun GroupSeparator( @Composable fun TaskCard( - task: GrpcProto.UiItem, - showCheckbox: Boolean, - onComplete: () -> Unit, + text: String, + icon: @Composable () -> Unit = {}, + backgroundColor: Color = MaterialTheme.colors.surface, + contentColor: Color = MaterialTheme.colors.onSurface, onClick: () -> Unit, ) { Card( onClick = onClick, - backgroundPainter = ColorPainter(MaterialTheme.colors.surface), + backgroundPainter = ColorPainter(backgroundColor), contentPadding = PaddingValues(start = 0.dp, top = 0.dp, end = 12.dp, bottom = 0.dp), ) { Row( verticalAlignment = Alignment.CenterVertically, ) { - if (showCheckbox) { - Button( - onClick = onComplete, - colors = ButtonDefaults.iconButtonColors(), - ) { - Icon( - imageVector = when { - task.completed -> Icons.Outlined.CheckBox - task.repeating -> Icons.Outlined.Repeat - else -> Icons.Outlined.CheckBoxOutlineBlank - }, - tint = Color( - ColorProvider.priorityColor( - task.priority, - isDarkMode = true, - desaturate = true - ) - ), - contentDescription = null, - ) - } - } + icon() Text( - text = task.title, - modifier = Modifier.padding(vertical = 12.dp) + text = text, + maxLines = 2, + overflow = TextOverflow.Ellipsis, + color = contentColor, ) } } diff --git a/wear/src/main/java/org/tasks/presentation/theme/Theme.kt b/wear/src/main/java/org/tasks/presentation/theme/Theme.kt index 0e89db4d3..e7ccc3637 100644 --- a/wear/src/main/java/org/tasks/presentation/theme/Theme.kt +++ b/wear/src/main/java/org/tasks/presentation/theme/Theme.kt @@ -1,17 +1,19 @@ package org.tasks.presentation.theme import androidx.compose.runtime.Composable +import androidx.compose.ui.graphics.Color import androidx.wear.compose.material.MaterialTheme +import org.tasks.kmp.org.tasks.themes.ColorProvider @Composable fun TasksTheme( content: @Composable () -> Unit ) { - /** - * Empty theme to customize for your app. - * See: https://developer.android.com/jetpack/compose/designsystems/custom - */ MaterialTheme( + colors = MaterialTheme.colors.copy( + primary = Color(ColorProvider.BLUE_500), + onPrimary = Color.White, + ), content = content ) } \ No newline at end of file