[Compose] Add Scaffold, Bottom Toolbar and Fab

build.gradle

@@ -2,7 +2,7 @@
 buildscript {
 
     ext{
-        kotlin_version = "1.5.31"
+        kotlin_version = "1.5.21"
         lifecycle_version = "2.4.0"
         room_version = "2.3.0"
         navigation_version = '2.3.5'

keypasscompose/build.gradle

@@ -48,18 +48,21 @@ android {
 }
 
 dependencies {
+    implementation project(":common")
 
     implementation 'androidx.core:core-ktx:1.7.0'
     implementation 'androidx.appcompat:appcompat:1.3.1'
     implementation 'com.google.android.material:material:1.4.0'
-    implementation "androidx.compose.ui:ui:$compose_version"
-    implementation "androidx.compose.material:material:$compose_version"
-    implementation "androidx.compose.ui:ui-tooling-preview:$compose_version"
+    implementation "androidx.compose.ui:ui:1.1.0-beta02"
+    implementation "androidx.compose.material:material:1.0.5"
+    implementation "androidx.compose.ui:ui-tooling-preview:1.0.5"
     implementation 'androidx.lifecycle:lifecycle-runtime-ktx:2.4.0'
     implementation 'androidx.activity:activity-compose:1.4.0'
     testImplementation 'junit:junit:4.+'
     androidTestImplementation 'androidx.test.ext:junit:1.1.3'
     androidTestImplementation 'androidx.test.espresso:espresso-core:3.4.0'
-    androidTestImplementation "androidx.compose.ui:ui-test-junit4:$compose_version"
-    debugImplementation "androidx.compose.ui:ui-tooling:$compose_version"
+    androidTestImplementation "androidx.compose.ui:ui-test-junit4:1.0.5"
+    debugImplementation "androidx.compose.ui:ui-tooling:1.0.5"
+
+    implementation 'androidx.compose.material3:material3:1.0.0-alpha01'
 }

keypasscompose/src/main/java/com/yogeshpaliyal/keypasscompose/MainActivity.kt

@@ -3,20 +3,63 @@ package com.yogeshpaliyal.keypasscompose
 import android.os.Bundle
 import androidx.activity.ComponentActivity
 import androidx.activity.compose.setContent
-import androidx.compose.material.MaterialTheme
-import androidx.compose.material.Surface
-import androidx.compose.material.Text
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material.FabPosition
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.Add
+import androidx.compose.material.icons.filled.Menu
+import androidx.compose.material.icons.filled.Star
+import androidx.compose.material3.*
 import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.tooling.preview.Preview
 import com.yogeshpaliyal.keypasscompose.ui.theme.KeyPassTheme
+import com.yogeshpaliyal.keypasscompose.ui.theme.Material3BottomAppBar
+import com.yogeshpaliyal.keypasscompose.ui.theme.Material3Scaffold
 
 class MainActivity : ComponentActivity() {
+    @OptIn(ExperimentalMaterial3Api::class)
     override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)
         setContent {
             KeyPassTheme {
                 // A surface container using the 'background' color from the theme
-                Surface(color = MaterialTheme.colors.background) {
+                Surface(color = MaterialTheme.colorScheme.background) {
+                    Material3Scaffold(bottomBar = {
+                        Material3BottomAppBar(cutoutShape = RoundedCornerShape(50)) {
+                            IconButton(
+                                onClick = {
+                                    /* doSomething() */
+                                }
+                            ) {
+                                Icon(Icons.Filled.Menu,"")
+                            }
+
+                            Spacer(Modifier.weight(1f, true))
+                            IconButton(
+                                onClick = {
+                                    /* doSomething() */
+                                }
+                            ) {
+                                Icon(Icons.Filled.Star,"")
+                            }
+                        }
+                    }, floatingActionButton = {
+                        FloatingActionButton(
+                            onClick = {
+
+                            },
+                            contentColor = Color.White,
+                            shape = RoundedCornerShape(50)
+                        ) {
+                            Icon(Icons.Filled.Add,"")
+                        }
+                    }, floatingActionButtonPosition = FabPosition.Center,
+                    isFloatingActionButtonDocked = true) {
+
+                    }
                     Greeting("Android")
                 }
             }

keypasscompose/src/main/java/com/yogeshpaliyal/keypasscompose/ui/theme/Material3Components.kt

@@ -0,0 +1,61 @@
+package com.yogeshpaliyal.keypasscompose.ui.theme
+
+import androidx.compose.foundation.layout.ColumnScope
+import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.RowScope
+import androidx.compose.material.*
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.contentColorFor
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.graphics.Shape
+import androidx.compose.ui.unit.Dp
+
+
+@Composable
+fun Material3BottomAppBar(
+    modifier: Modifier = Modifier,
+    backgroundColor: Color = MaterialTheme.colorScheme.surface,
+    contentColor: Color = contentColorFor(backgroundColor),
+    cutoutShape: Shape? = null,
+    elevation: Dp = AppBarDefaults.BottomAppBarElevation,
+    contentPadding: PaddingValues = AppBarDefaults.ContentPadding,
+    content: @Composable RowScope.() -> Unit
+) {
+    BottomAppBar(
+        modifier,
+        backgroundColor,
+        contentColor,
+        cutoutShape,
+        elevation,
+        contentPadding,
+        content
+    )
+}
+
+@Composable
+fun Material3Scaffold(modifier: Modifier = Modifier,
+                      scaffoldState: ScaffoldState = rememberScaffoldState(),
+                      topBar: @Composable () -> Unit = {},
+                      bottomBar: @Composable () -> Unit = {},
+                      snackbarHost: @Composable (SnackbarHostState) -> Unit = { SnackbarHost(it) },
+                      floatingActionButton: @Composable () -> Unit = {},
+                      floatingActionButtonPosition: FabPosition = FabPosition.End,
+                      isFloatingActionButtonDocked: Boolean = false,
+                      drawerContent: @Composable (ColumnScope.() -> Unit)? = null,
+                      drawerGesturesEnabled: Boolean = true,
+                      drawerShape: Shape = androidx.compose.material.MaterialTheme.shapes.large,
+                      drawerElevation: Dp = DrawerDefaults.Elevation,
+                      drawerBackgroundColor: Color = MaterialTheme.colorScheme.surface,
+                      drawerContentColor: Color = contentColorFor(
+                          drawerBackgroundColor
+                      ),
+                      drawerScrimColor: Color = DrawerDefaults.scrimColor,
+                      backgroundColor: Color = MaterialTheme.colorScheme.background,
+                      contentColor: Color = contentColorFor(
+                          backgroundColor
+                      ),
+                      content: @Composable (PaddingValues) -> Unit){
+    Scaffold(modifier, scaffoldState, topBar, bottomBar, snackbarHost, floatingActionButton, floatingActionButtonPosition, isFloatingActionButtonDocked, drawerContent, drawerGesturesEnabled, drawerShape, drawerElevation, drawerBackgroundColor, drawerContentColor, drawerScrimColor, backgroundColor, contentColor, content)
+}

keypasscompose/src/main/java/com/yogeshpaliyal/keypasscompose/ui/theme/Shape.kt

@@ -1,11 +1,2 @@
 package com.yogeshpaliyal.keypasscompose.ui.theme
 
-import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.material.Shapes
-import androidx.compose.ui.unit.dp
-
-val Shapes = Shapes(
-    small = RoundedCornerShape(4.dp),
-    medium = RoundedCornerShape(4.dp),
-    large = RoundedCornerShape(0.dp)
-)

keypasscompose/src/main/java/com/yogeshpaliyal/keypasscompose/ui/theme/Theme.kt

@@ -1,20 +1,20 @@
 package com.yogeshpaliyal.keypasscompose.ui.theme
 
 import androidx.compose.foundation.isSystemInDarkTheme
-import androidx.compose.material.MaterialTheme
-import androidx.compose.material.darkColors
-import androidx.compose.material.lightColors
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.darkColorScheme
+import androidx.compose.material3.lightColorScheme
 import androidx.compose.runtime.Composable
 
-private val DarkColorPalette = darkColors(
+private val DarkColorPalette = darkColorScheme(
     primary = Purple200,
-    primaryVariant = Purple700,
+    primaryContainer = Purple700,
     secondary = Teal200
 )
 
-private val LightColorPalette = lightColors(
+private val LightColorPalette = lightColorScheme(
     primary = Purple500,
-    primaryVariant = Purple700,
+    primaryContainer = Purple700,
     secondary = Teal200
 
     /* Other default colors to override
@@ -36,9 +36,8 @@ fun KeyPassTheme(darkTheme: Boolean = isSystemInDarkTheme(), content: @Composabl
     }
 
     MaterialTheme(
-        colors = colors,
+        colorScheme = colors,
         typography = Typography,
-        shapes = Shapes,
         content = content
     )
 }

keypasscompose/src/main/java/com/yogeshpaliyal/keypasscompose/ui/theme/Type.kt

@@ -1,6 +1,6 @@
 package com.yogeshpaliyal.keypasscompose.ui.theme
 
-import androidx.compose.material.Typography
+import androidx.compose.material3.Typography
 import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.text.font.FontFamily
 import androidx.compose.ui.text.font.FontWeight
@@ -8,7 +8,7 @@ import androidx.compose.ui.unit.sp
 
 // Set of Material typography styles to start with
 val Typography = Typography(
-    body1 = TextStyle(
+    bodyMedium = TextStyle(
         fontFamily = FontFamily.Default,
         fontWeight = FontWeight.Normal,
         fontSize = 16.sp