Update Jetpack Compose 1.0.0-alpha06 + Updated ModalBottomSheet conta…

…iner and minor changes
serbelga · Oct 31, 2020 · afec7cf · afec7cf
1 parent f89f1f0
commit afec7cf
Show file tree

Hide file tree

Showing 7 changed files with 87 additions and 37 deletions.
diff --git a/app/src/main/java/com/sergiobelda/todometer/ui/home/HomeScreen.kt b/app/src/main/java/com/sergiobelda/todometer/ui/home/HomeScreen.kt
@@ -16,12 +16,12 @@
 
 package com.sergiobelda.todometer.ui.home
 
-import androidx.compose.foundation.Icon
 import androidx.compose.foundation.Image
 import androidx.compose.foundation.Text
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
@@ -33,13 +33,14 @@ import androidx.compose.foundation.layout.wrapContentHeight
 import androidx.compose.foundation.lazy.LazyColumnFor
 import androidx.compose.foundation.lazy.LazyColumnForIndexed
 import androidx.compose.foundation.shape.CircleShape
+import androidx.compose.material.AmbientEmphasisLevels
 import androidx.compose.material.BottomAppBar
 import androidx.compose.material.Button
 import androidx.compose.material.Divider
-import androidx.compose.material.EmphasisAmbient
 import androidx.compose.material.ExperimentalMaterialApi
 import androidx.compose.material.FabPosition
 import androidx.compose.material.FloatingActionButton
+import androidx.compose.material.Icon
 import androidx.compose.material.IconButton
 import androidx.compose.material.LinearProgressIndicator
 import androidx.compose.material.ListItem
@@ -50,11 +51,11 @@ import androidx.compose.material.ModalBottomSheetValue
 import androidx.compose.material.ProvideEmphasis
 import androidx.compose.material.Scaffold
 import androidx.compose.material.Surface
+import androidx.compose.material.TextButton
 import androidx.compose.material.contentColorFor
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.outlined.AccountCircle
 import androidx.compose.material.icons.rounded.Add
-import androidx.compose.material.icons.rounded.Favorite
 import androidx.compose.material.icons.rounded.Menu
 import androidx.compose.material.icons.rounded.MoreVert
 import androidx.compose.material.rememberModalBottomSheetState
@@ -88,19 +89,7 @@ fun HomeScreen(
         sheetState = sheetState,
         sheetElevation = 16.dp,
         sheetContent = {
-            Column(modifier = Modifier.preferredHeight(320.dp)) {
-                Text(
-                    text = stringResource(id = R.string.projects).toUpperCase(Locale.ROOT),
-                    style = typography.overline
-                )
-                LazyColumnFor(items = mainViewModel.projectList) { project ->
-                    ListItem(
-                        modifier = Modifier.clickable(onClick = {}),
-                        text = { Text(text = project.name) },
-                        icon = { Icon(Icons.Rounded.Favorite) }
-                    )
-                }
-            }
+            SheetContainer(mainViewModel = mainViewModel, addProject)
         }
     ) {
         Scaffold(
@@ -114,12 +103,14 @@ fun HomeScreen(
                         contentColor = contentColorFor(colors.surface),
                         cutoutShape = CircleShape
                     ) {
-                        IconButton(onClick = { sheetState.show() }) {
-                            Icon(Icons.Rounded.Menu)
-                        }
-                        Spacer(modifier = Modifier.weight(1f))
-                        IconButton(onClick = { /* doSomething() */ }) {
-                            Icon(Icons.Rounded.MoreVert)
+                        ProvideEmphasis(emphasis = AmbientEmphasisLevels.current.medium) {
+                            IconButton(onClick = { sheetState.show() }) {
+                                Icon(Icons.Rounded.Menu)
+                            }
+                            Spacer(modifier = Modifier.weight(1f))
+                            IconButton(onClick = { /* doSomething() */ }) {
+                                Icon(Icons.Rounded.MoreVert)
+                            }
                         }
                     }
                 }
@@ -140,7 +131,7 @@ fun HomeScreen(
                 }
             },
             floatingActionButtonPosition = FabPosition.Center,
-            // isFloatingActionButtonDocked = true
+            isFloatingActionButtonDocked = true
         )
     }
 }
@@ -159,15 +150,63 @@ fun ToDometerTopBar() {
                 modifier = Modifier.height(56.dp).fillMaxWidth()
             ) {
                 ToDometerTitle(modifier = Modifier.align(Alignment.Center))
-                IconButton(onClick = {}, modifier = Modifier.align(Alignment.CenterEnd)) {
-                    Icon(Icons.Outlined.AccountCircle)
+                ProvideEmphasis(emphasis = AmbientEmphasisLevels.current.medium) {
+                    IconButton(onClick = {}, modifier = Modifier.align(Alignment.CenterEnd)) {
+                        Icon(Icons.Outlined.AccountCircle)
+                    }
                 }
             }
             Divider(thickness = 1.dp, color = colors.outline)
         }
     }
 }
 
+@Composable
+fun SheetContainer(mainViewModel: MainViewModel, addProject: () -> Unit) {
+    Column(modifier = Modifier.preferredHeight(480.dp)) {
+        Row(
+            verticalAlignment = Alignment.CenterVertically,
+            modifier = Modifier.height(56.dp).padding(start = 16.dp, end = 16.dp)
+        ) {
+            Text(
+                text = stringResource(id = R.string.projects).toUpperCase(Locale.ROOT),
+                style = typography.overline
+            )
+            Spacer(modifier = Modifier.weight(1f))
+            TextButton(onClick = addProject) {
+                Icon(asset = Icons.Rounded.Add)
+                Text(text = stringResource(id = R.string.add_project))
+            }
+        }
+        Divider(thickness = 1.dp, color = colors.outline)
+        LazyColumnFor(items = mainViewModel.projectList, modifier = Modifier.preferredHeight(240.dp)) { project ->
+            ProvideEmphasis(emphasis = AmbientEmphasisLevels.current.medium) {
+                ListItem(
+                    modifier = Modifier.clickable(onClick = {}),
+                    text = { Text(text = project.name) },
+                    icon = { Icon(vectorResource(id = R.drawable.ic_baseline_book_24)) }
+                )
+            }
+        }
+        Divider(thickness = 1.dp, color = colors.outline)
+        Row(
+            verticalAlignment = Alignment.CenterVertically,
+            modifier = Modifier.height(56.dp).padding(start = 16.dp, end = 16.dp)
+        ) {
+            Text(
+                text = stringResource(id = R.string.tags).toUpperCase(Locale.ROOT),
+                style = typography.overline
+            )
+            Spacer(modifier = Modifier.weight(1f))
+            TextButton(onClick = {}) {
+                Icon(asset = Icons.Rounded.Add)
+                Text(text = stringResource(id = R.string.add_tag))
+            }
+        }
+        Divider(thickness = 1.dp, color = colors.outline)
+    }
+}
+
 @Composable
 fun ProjectTasksListView(
     mainViewModel: MainViewModel,
@@ -185,7 +224,7 @@ fun ProjectTasksListView(
             } else {
                 0f
             }
-        ProvideEmphasis(emphasis = EmphasisAmbient.current.medium) {
+        ProvideEmphasis(emphasis = AmbientEmphasisLevels.current.medium) {
             Text(
                 ProgressUtil.getPercentage(progress),
                 style = typography.body1,
@@ -229,8 +268,7 @@ fun EmptyProjectTaskListView(addProject: () -> Unit) {
             Text(stringResource(id = R.string.you_have_not_any_project))
             Button(
                 modifier = Modifier.align(Alignment.CenterHorizontally).padding(16.dp),
-                onClick = addProject,
-                elevation = 0.dp
+                onClick = addProject
             ) {
                 Text(stringResource(id = R.string.add_project))
             }

diff --git a/app/src/main/java/com/sergiobelda/todometer/ui/home/TaskItem.kt b/app/src/main/java/com/sergiobelda/todometer/ui/home/TaskItem.kt
@@ -25,8 +25,8 @@ import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
+import androidx.compose.material.AmbientEmphasisLevels
 import androidx.compose.material.Card
-import androidx.compose.material.EmphasisAmbient
 import androidx.compose.material.IconButton
 import androidx.compose.material.MaterialTheme.colors
 import androidx.compose.material.ProvideEmphasis
@@ -71,7 +71,7 @@ fun TaskItem(
                 verticalAlignment = Alignment.CenterVertically,
                 modifier = Modifier.padding(start = 16.dp)
             ) {
-                ProvideEmphasis(emphasis = EmphasisAmbient.current.medium) {
+                ProvideEmphasis(emphasis = AmbientEmphasisLevels.current.medium) {
                     Icon(Icons.Rounded.DateRange, modifier = Modifier.padding(end = 8.dp))
                 }
                 when (task.state) {
@@ -98,7 +98,7 @@ fun TaskItem(
                     }
                 }
             }
-            ProvideEmphasis(emphasis = EmphasisAmbient.current.medium) {
+            ProvideEmphasis(emphasis = AmbientEmphasisLevels.current.medium) {
                 Text(
                     task.description,
                     modifier = Modifier.padding(start = 16.dp, end = 16.dp, bottom = 16.dp),

diff --git a/app/src/main/java/com/sergiobelda/todometer/ui/theme/Color.kt b/app/src/main/java/com/sergiobelda/todometer/ui/theme/Color.kt
@@ -23,5 +23,5 @@ val blue = Color(0xFF4285f4)
 val orange = Color(0xFFF86734)
 val navy = Color(0xFF073042)
 val background = Color(0xFFFFFFFF)
-val outlineDark = Color(255, 255, 255, alpha = 50)
-val outlineLight = Color(0, 0, 0, alpha = 50)
+val outlineDark = Color(255, 255, 255, alpha = 12)
+val outlineLight = Color(0, 0, 0, alpha = 12)
diff --git a/app/src/main/res/drawable/ic_baseline_book_24.xml b/app/src/main/res/drawable/ic_baseline_book_24.xml
@@ -0,0 +1,10 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="24"
+    android:viewportHeight="24"
+    android:tint="?attr/colorControlNormal">
+  <path
+      android:fillColor="@android:color/white"
+      android:pathData="M18,2H6c-1.1,0 -2,0.9 -2,2v16c0,1.1 0.9,2 2,2h12c1.1,0 2,-0.9 2,-2V4c0,-1.1 -0.9,-2 -2,-2zM6,4h5v8l-2.5,-1.5L6,12V4z"/>
+</vector>
diff --git a/app/src/main/res/values/strings.xml b/app/src/main/res/values/strings.xml
@@ -9,4 +9,6 @@
     <string name="description">Description</string>
     <string name="you_have_not_any_project">You haven\'t any project</string>
     <string name="save">Save</string>
+    <string name="tags">Tags</string>
+    <string name="add_tag">Add tag</string>
 </resources>
diff --git a/build.gradle b/build.gradle
@@ -1,7 +1,7 @@
 // Top-level build file where you can add configuration options common to all sub-projects/modules.
 buildscript {
     ext {
-        compose_version = '1.0.0-alpha04'
+        compose_version = '1.0.0-alpha06'
         dagger_hilt_version = '2.28.3-alpha'
     }
     ext.kotlin_version = "1.4.10"
@@ -10,7 +10,7 @@ buildscript {
         jcenter()
     }
     dependencies {
-        classpath "com.android.tools.build:gradle:4.2.0-alpha13"
+        classpath "com.android.tools.build:gradle:4.2.0-alpha15"
         classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version"
         classpath "com.google.dagger:hilt-android-gradle-plugin:$dagger_hilt_version"
     }

diff --git a/gradle/wrapper/gradle-wrapper.properties b/gradle/wrapper/gradle-wrapper.properties
@@ -1,6 +1,6 @@
-#Tue Oct 06 20:52:32 CEST 2020
+#Fri Oct 30 23:57:12 CET 2020
 distributionBase=GRADLE_USER_HOME
-distributionUrl=https\://services.gradle.org/distributions/gradle-6.6.1-bin.zip
+distributionUrl=https\://services.gradle.org/distributions/gradle-6.7-bin.zip
 distributionPath=wrapper/dists
 zipStorePath=wrapper/dists
 zipStoreBase=GRADLE_USER_HOME