Use a Scaffold to lay things out

Signed-off-by: Harsh Shandilya <me@msfjarvis.dev>
This commit is contained in:
Harsh Shandilya 2020-08-22 14:49:39 +05:30
parent 04f2b20503
commit 6558ec7909
No known key found for this signature in database
GPG key ID: 366D7BBAD1031E80

View file

@ -2,8 +2,6 @@ package dev.msfjarvis.todo
import android.os.Bundle import android.os.Bundle
import androidx.appcompat.app.AppCompatActivity import androidx.appcompat.app.AppCompatActivity
import androidx.compose.foundation.Box
import androidx.compose.foundation.ContentGravity
import androidx.compose.foundation.Icon import androidx.compose.foundation.Icon
import androidx.compose.foundation.Text import androidx.compose.foundation.Text
import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.Row
@ -12,6 +10,7 @@ import androidx.compose.foundation.lazy.LazyColumnFor
import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.Card import androidx.compose.material.Card
import androidx.compose.material.FloatingActionButton import androidx.compose.material.FloatingActionButton
import androidx.compose.material.Scaffold
import androidx.compose.material.TopAppBar import androidx.compose.material.TopAppBar
import androidx.compose.material.icons.Icons import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.ExposurePlus1 import androidx.compose.material.icons.filled.ExposurePlus1
@ -45,40 +44,40 @@ class MainActivity : AppCompatActivity() {
fun TodoApp() { fun TodoApp() {
val items = remember { mutableStateListOf(TodoItem("Default item")) } val items = remember { mutableStateListOf(TodoItem("Default item")) }
Box(gravity = ContentGravity.Center) { Scaffold(
TopAppBar( topBar = { TopAppBar({ Text(text = "I can Compose?") }) },
title = { floatingActionButton = {
Text(text = "I can Compose?") FloatingActionButton(
} onClick = {
) items.add(TodoItem("Item ${items.size + 1}"))
LazyColumnFor(items = items, modifier = Modifier.padding(horizontal = 16.dp)) { todoItem -> },
Row( elevation = 8.dp,
modifier = Modifier.padding(vertical = 8.dp).fillParentMaxWidth(),
) { ) {
Card( Icon(asset = Icons.Filled.ExposurePlus1)
shape = RoundedCornerShape(8.dp), }
modifier = Modifier.fillParentMaxWidth(), },
backgroundColor = Color.Black bodyContent = {
LazyColumnFor(items = items, modifier = Modifier.padding(horizontal = 16.dp)) { todoItem ->
Row(
modifier = Modifier.padding(vertical = 8.dp).fillParentMaxWidth(),
) { ) {
Text( Card(
text = todoItem.title, shape = RoundedCornerShape(8.dp),
style = TextStyle( modifier = Modifier.fillParentMaxWidth(),
color = Color.White, backgroundColor = Color.Black
fontSize = 20.sp, ) {
textAlign = TextAlign.Center Text(
), text = todoItem.title,
modifier = Modifier.padding(16.dp), style = TextStyle(
) color = Color.White,
fontSize = 20.sp,
textAlign = TextAlign.Center
),
modifier = Modifier.padding(16.dp),
)
}
} }
} }
} }
FloatingActionButton( )
onClick = {
items.add(TodoItem("Item ${items.size + 1}"))
},
elevation = 8.dp,
) {
Icon(asset = Icons.Filled.ExposurePlus1)
}
}
} }