Skip to content
Merged
Show file tree
Hide file tree
Changes from 11 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions Fruitties/androidApp/build.gradle.kts
Original file line number Diff line number Diff line change
Expand Up @@ -76,6 +76,7 @@ dependencies {
implementation(libs.compose.ui)
implementation(libs.compose.ui.tooling.preview)
implementation(libs.compose.material3)
implementation(libs.androidx.material.icons.core)
implementation(libs.androidx.activity.compose)
implementation(libs.androidx.paging.compose.android)
implementation(libs.androidx.lifecycle.viewmodel.compose)
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -34,6 +34,7 @@ import androidx.navigation3.runtime.rememberSavedStateNavEntryDecorator
import androidx.navigation3.ui.NavDisplay
import androidx.navigation3.ui.rememberSceneSetupNavEntryDecorator
import com.example.fruitties.android.ui.CartScreen
import com.example.fruitties.android.ui.FruittieScreen
import com.example.fruitties.android.ui.ListScreen
import kotlinx.serialization.Serializable

Expand All @@ -43,6 +44,9 @@ data object ListScreenKey : NavKey
@Serializable
data object CartScreenKey : NavKey

@Serializable
data class FruittieScreenKey(val id: Long) : NavKey

class MainActivity : ComponentActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
Expand Down Expand Up @@ -75,11 +79,23 @@ fun NavApp() {
entryProvider = entryProvider {
entry<ListScreenKey> {
ListScreen(
onFruittieClick = {
backStack.add(FruittieScreenKey(it.id))
},
onClickViewCart = {
backStack.add(CartScreenKey)
},
)
}
entry<FruittieScreenKey> {
FruittieScreen(
fruittieId = it.id,
onNavBarBack = {
backStack.removeIf { it is FruittieScreenKey }
},
)
}

entry<CartScreenKey> {
CartScreen(
onNavBarBack = {
Expand All @@ -90,3 +106,4 @@ fun NavApp() {
},
)
}

Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@
package com.example.fruitties.android.ui

import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.WindowInsets
import androidx.compose.foundation.layout.WindowInsetsSides
Expand All @@ -25,15 +26,20 @@ import androidx.compose.foundation.layout.only
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.safeDrawing
import androidx.compose.foundation.layout.systemBars
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.layout.windowInsetsBottomHeight
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.automirrored.filled.ArrowBack
import androidx.compose.material3.CenterAlignedTopAppBar
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.FilledIconButton
import androidx.compose.material3.HorizontalDivider
import androidx.compose.material3.Icon
import androidx.compose.material3.IconButton
import androidx.compose.material3.IconButtonColors
import androidx.compose.material3.IconButtonDefaults
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Scaffold
import androidx.compose.material3.Text
Expand All @@ -43,12 +49,15 @@ import androidx.compose.runtime.collectAsState
import androidx.compose.runtime.getValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.platform.LocalContext
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.unit.dp
import androidx.lifecycle.viewmodel.compose.viewModel
import com.example.fruitties.android.R
import com.example.fruitties.android.di.App
import com.example.fruitties.model.CartItemDetails
import com.example.fruitties.viewmodel.CartViewModel
import com.example.fruitties.viewmodel.creationExtras

Expand Down Expand Up @@ -81,7 +90,7 @@ fun CartScreen(onNavBarBack: () -> Unit) {
}
},
title = {
Text(text = stringResource(R.string.frutties))
Text(text = stringResource(R.string.cart))
},
colors = TopAppBarDefaults.topAppBarColors(
containerColor = MaterialTheme.colorScheme.primary,
Expand All @@ -108,14 +117,17 @@ fun CartScreen(onNavBarBack: () -> Unit) {
val cartItemCount = cartState.totalItemCount
Text(
text = "Cart has $cartItemCount items",
modifier = Modifier.padding(8.dp),
)
HorizontalDivider()
LazyColumn(
modifier = Modifier.fillMaxWidth(),
horizontalAlignment = Alignment.CenterHorizontally,
) {
items(cartState.cartDetails) { cartItem ->
Text(text = "${cartItem.fruittie.name}: ${cartItem.count}")
CartItem(
cartItem = cartItem,
decreaseCountClick = viewModel::decreaseCountClick,
increaseCountClick = viewModel::increaseCountClick,
)
}
item {
Spacer(
Expand All @@ -128,3 +140,39 @@ fun CartScreen(onNavBarBack: () -> Unit) {
}
}
}

@Composable
fun CartItem(
cartItem: CartItemDetails,
increaseCountClick: (CartItemDetails) -> Unit,
decreaseCountClick: (CartItemDetails) -> Unit,
) {
Row(
verticalAlignment = Alignment.CenterVertically,
) {
Text(text = "${cartItem.count}x")
Spacer(Modifier.width(8.dp))
Text(text = cartItem.fruittie.name)
Spacer(Modifier.weight(1f))
FilledIconButton(
onClick = { decreaseCountClick(cartItem) },
colors = IconButtonDefaults.filledIconButtonColors(containerColor = MaterialTheme.colorScheme.error),
) {
Text(
text = "-",
color = MaterialTheme.colorScheme.onPrimary,
textAlign = TextAlign.Center,
)
}
FilledIconButton(
onClick = { increaseCountClick(cartItem) },
colors = IconButtonDefaults.filledIconButtonColors(containerColor = Color.Green),
) {
Text(
text = "+",
color = MaterialTheme.colorScheme.onPrimary,
textAlign = TextAlign.Center,
)
}
}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,130 @@
package com.example.fruitties.android.ui

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.padding
import androidx.compose.foundation.layout.width
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.automirrored.filled.ArrowBack
import androidx.compose.material.icons.filled.ShoppingCart
import androidx.compose.material3.CircularProgressIndicator
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.FloatingActionButton
import androidx.compose.material3.Icon
import androidx.compose.material3.IconButton
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Scaffold
import androidx.compose.material3.Text
import androidx.compose.material3.TopAppBar
import androidx.compose.runtime.Composable
import androidx.compose.runtime.collectAsState
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.platform.LocalContext
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.unit.dp
import androidx.lifecycle.viewmodel.compose.viewModel
import com.example.fruitties.android.R
import com.example.fruitties.android.di.App
import com.example.fruitties.model.Fruittie
import com.example.fruitties.viewmodel.FruittieViewModel
import com.example.fruitties.viewmodel.FruittieViewModel.Companion.FRUITTIE_ID_KEY
import com.example.fruitties.viewmodel.creationExtras

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun FruittieScreen(
fruittieId: Long,
onNavBarBack: () -> Unit
) {
val app = LocalContext.current.applicationContext as App

val viewModel: FruittieViewModel = viewModel(
factory = FruittieViewModel.Factory,
extras = creationExtras(app.container) {
set(FRUITTIE_ID_KEY, fruittieId)
},
)

val state = viewModel.state.collectAsState().value

FruittieScreen(
state = state,
onNavBarBack = onNavBarBack,
addToCart = { viewModel.addToCart(it) }
)
}

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun FruittieScreen(
state: FruittieViewModel.State,
addToCart: (Fruittie) -> Unit,
onNavBarBack: () -> Unit
) {
Scaffold(
topBar = {
TopAppBar(
title = {
Text(
(state as? FruittieViewModel.State.Content)?.fruittie?.name
?: stringResource(R.string.loading)
)
},
actions = {
val inCart = (state as? FruittieViewModel.State.Content)?.inCart ?: 0
Text(stringResource(R.string.in_cart, inCart))
Spacer(Modifier.width(8.dp))
},
navigationIcon = {
IconButton(onClick = onNavBarBack) {
Icon(
imageVector = Icons.AutoMirrored.Filled.ArrowBack,
contentDescription = stringResource(R.string.navigate_back),
)
}
},
)
},
floatingActionButton = {
// Check if state is loaded
if (state !is FruittieViewModel.State.Content) return@Scaffold

FloatingActionButton(
shape = MaterialTheme.shapes.extraLarge,
onClick = { addToCart(state.fruittie) }
) {
Row(
modifier = Modifier.padding(
horizontal = 16.dp
),
verticalAlignment = Alignment.CenterVertically
) {
Icon(
Icons.Filled.ShoppingCart,
contentDescription = null
)
Spacer(Modifier.width(8.dp))
Text(text = stringResource(R.string.add_to_cart))
}
}
}
) {
Column(
horizontalAlignment = Alignment.CenterHorizontally,
modifier = Modifier
.padding(it)
.fillMaxSize()
) {
when (state) {
FruittieViewModel.State.Loading -> CircularProgressIndicator()
is FruittieViewModel.State.Content -> {
Text(state.fruittie.fullName)
Text(state.fruittie.calories)
}
}
}
}
}
Loading
Loading