diff --git a/app/src/main/java/com/ouday/cryptowalletsample/home/components/BillOptionsComposable.kt b/app/src/main/java/com/ouday/cryptowalletsample/home/components/BillOptionsComposable.kt index bd45f9b..fcb6aef 100644 --- a/app/src/main/java/com/ouday/cryptowalletsample/home/components/BillOptionsComposable.kt +++ b/app/src/main/java/com/ouday/cryptowalletsample/home/components/BillOptionsComposable.kt @@ -1,15 +1,7 @@ package com.ouday.cryptowalletsample.home.components import androidx.compose.foundation.background -import androidx.compose.foundation.layout.Box -import androidx.compose.foundation.layout.Column -import androidx.compose.foundation.layout.fillMaxHeight -import androidx.compose.foundation.layout.fillMaxWidth -import androidx.compose.foundation.layout.height -import androidx.compose.foundation.layout.padding -import androidx.compose.foundation.layout.size -import androidx.compose.foundation.layout.width -import androidx.compose.foundation.layout.wrapContentHeight +import androidx.compose.foundation.layout.* import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.material3.Icon import androidx.compose.material3.IconButton @@ -21,21 +13,16 @@ import androidx.compose.ui.draw.clip import androidx.compose.ui.graphics.painter.Painter import androidx.compose.ui.platform.LocalContext import androidx.compose.ui.text.style.TextAlign -import androidx.compose.ui.unit.dp -import androidx.compose.ui.unit.sp -import coil.compose.rememberAsyncImagePainter +import androidx.compose.ui.res.stringResource import com.ouday.cryptowalletsample.R import com.ouday.cryptowalletsample.bills.data.model.Bill -import com.ouday.cryptowalletsample.ui.theme.Size -import com.ouday.cryptowalletsample.ui.theme.Space -import com.ouday.cryptowalletsample.ui.theme.Colors -import com.ouday.cryptowalletsample.ui.theme.Typography +import com.ouday.cryptowalletsample.ui.theme.* +import coil.compose.rememberAsyncImagePainter import coil.decode.SvgDecoder import coil.imageLoader import coil.request.ImageRequest import com.ouday.cryptowalletsample.common.getImageUrl - @Composable fun BillOptionItem( bill: Bill, @@ -57,8 +44,8 @@ fun BillOptionItem( Column( modifier = Modifier - .width(40.dp) - .height(80.dp) + .width(Size.size2XMax) + .height(Size.sizeMax) ) { Box( modifier = Modifier @@ -71,7 +58,7 @@ fun BillOptionItem( Column(horizontalAlignment = Alignment.CenterHorizontally) { Icon( painter = painter, - contentDescription = bill.billName, + contentDescription = stringResource(id = R.string.bill_option_description, bill.billName), modifier = Modifier .size(Size.sizeLarge) .padding(Space.space2XSmall), @@ -86,7 +73,7 @@ fun BillOptionItem( .fillMaxWidth() .fillMaxHeight(), textAlign = TextAlign.Center, - style = Typography.caption.copy(fontSize = 8.sp) + style = Typography.caption.copy(fontSize = Typography.caption.fontSize) ) } -} \ No newline at end of file +} diff --git a/app/src/main/java/com/ouday/cryptowalletsample/home/components/CreditCardComposable.kt b/app/src/main/java/com/ouday/cryptowalletsample/home/components/CreditCardComposable.kt index 8f505e3..a59e982 100644 --- a/app/src/main/java/com/ouday/cryptowalletsample/home/components/CreditCardComposable.kt +++ b/app/src/main/java/com/ouday/cryptowalletsample/home/components/CreditCardComposable.kt @@ -26,10 +26,10 @@ import com.ouday.cryptowalletsample.ui.theme.Typography fun CreditCardComposable(cardInfo: CreditCardInfo, modifier: Modifier = Modifier) { Box( modifier = modifier - .height(Size.sizeXMax) // Using Size from CryptoWalletSampleTheme - .clip(RoundedCornerShape(MaterialCornerRadius.radiusMedium)) // Using MaterialCornerRadius from CryptoWalletSampleTheme - .background(Colors.surface) // Using Colors from CryptoWalletSampleTheme - .padding(Space.spaceMedium) // Using Space from CryptoWalletSampleTheme + .height(Size.sizeXMax) + .clip(RoundedCornerShape(MaterialCornerRadius.radiusMedium)) + .background(Colors.surface) + .padding(Space.spaceMedium) ) { ConstraintLayout( modifier = Modifier.fillMaxSize() @@ -38,8 +38,8 @@ fun CreditCardComposable(cardInfo: CreditCardInfo, modifier: Modifier = Modifier Text( text = cardInfo.cardType, - color = Colors.onSurface, - style = Typography.h6, + color = Colors.onSurface, + style = Typography.h6, modifier = Modifier.constrainAs(cardType) { top.linkTo(parent.top, margin = Space.spaceMedium) start.linkTo(parent.start, margin = Space.spaceMedium) @@ -48,8 +48,8 @@ fun CreditCardComposable(cardInfo: CreditCardInfo, modifier: Modifier = Modifier Text( text = cardInfo.cardNumber, // Masked number for privacy - color = Colors.onSurface, - style = Typography.h6, + color = Colors.onSurface, + style = Typography.h6, modifier = Modifier.constrainAs(cardNumber) { top.linkTo(cardType.bottom, margin = Space.spaceSmall) end.linkTo(parent.end, margin = Space.spaceMedium) @@ -58,8 +58,8 @@ fun CreditCardComposable(cardInfo: CreditCardInfo, modifier: Modifier = Modifier Text( text = stringResource(R.string.due_date, cardInfo.dueDate), - color = Colors.onSurface, - style = Typography.subtitle1, + color = Colors.onSurface, + style = Typography.subtitle1, modifier = Modifier.constrainAs(dueDate) { top.linkTo(cardNumber.bottom, margin = Space.spaceSmall) start.linkTo(parent.start, margin = Space.spaceMedium) @@ -68,7 +68,7 @@ fun CreditCardComposable(cardInfo: CreditCardInfo, modifier: Modifier = Modifier Text( text = cardInfo.amountDue, - color = Colors.onSurface, + color = Colors.onSurface, style = Typography.h4.copy(fontWeight = FontWeight.Bold), modifier = Modifier.constrainAs(amount) { top.linkTo(dueDate.bottom, margin = Space.spaceSmall) @@ -85,15 +85,15 @@ fun CreditCardComposable(cardInfo: CreditCardInfo, modifier: Modifier = Modifier ) { Text( text = stringResource(R.string.pay), - style = Typography.button, + style = Typography.button, color = Colors.onSurface ) } Text( text = cardInfo.paymentStatus, - color = Colors.onSurface, - style = Typography.overline, + color = Colors.onSurface, + style = Typography.overline, modifier = Modifier.constrainAs(paymentStatus) { start.linkTo(parent.start, margin = Space.spaceMedium) bottom.linkTo(payButton.top, margin = Space.spaceSmall) diff --git a/app/src/main/java/com/ouday/cryptowalletsample/home/components/LoanCardComposable.kt b/app/src/main/java/com/ouday/cryptowalletsample/home/components/LoanCardComposable.kt index 64bea6b..6675fec 100644 --- a/app/src/main/java/com/ouday/cryptowalletsample/home/components/LoanCardComposable.kt +++ b/app/src/main/java/com/ouday/cryptowalletsample/home/components/LoanCardComposable.kt @@ -2,26 +2,22 @@ package com.ouday.cryptowalletsample.home.components import androidx.compose.foundation.Image import androidx.compose.foundation.background -import androidx.compose.foundation.layout.Box -import androidx.compose.foundation.layout.fillMaxSize -import androidx.compose.foundation.layout.fillMaxWidth -import androidx.compose.foundation.layout.height -import androidx.compose.foundation.layout.size +import androidx.compose.foundation.layout.* import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.material.LinearProgressIndicator -import androidx.compose.material.MaterialTheme import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.Color import androidx.compose.ui.res.painterResource -import androidx.compose.ui.unit.dp -import androidx.constraintlayout.compose.ConstrainedLayoutReference +import androidx.compose.ui.res.stringResource import androidx.constraintlayout.compose.ConstraintLayout import androidx.constraintlayout.compose.ConstraintLayoutScope +import androidx.constraintlayout.compose.ConstrainedLayoutReference import com.ouday.cryptowalletsample.R import com.ouday.cryptowalletsample.subscriptions.data.model.Subscription +import com.ouday.cryptowalletsample.ui.theme.* @Composable fun LoanCardComposable( @@ -38,7 +34,7 @@ fun LoanCardComposable( CardImageBox( imageResourceId = R.drawable.ic_car, - imageContentDescription = content.imageContentDescription, + imageContentDescription = stringResource(R.string.image_content_description, content.imageContentDescription), imageBoxRef = imageBox ) @@ -86,11 +82,10 @@ fun ConstraintLayoutScope.CardImageBox( imageContentDescription: String, imageBoxRef: ConstrainedLayoutReference ) { - // Implementation for CardImageBox Box( modifier = Modifier - .size(40.dp) - .background(Color.White, RoundedCornerShape(8.dp)) + .size(Size.sizeLarge) + .background(Color.White, RoundedCornerShape(MaterialCornerRadius.radiusSmall)) .constrainAs(imageBoxRef) { top.linkTo(parent.top) start.linkTo(parent.start) @@ -100,7 +95,7 @@ fun ConstraintLayoutScope.CardImageBox( painter = painterResource(id = imageResourceId), contentDescription = imageContentDescription, modifier = Modifier - .size(30.dp) + .size(Size.sizeMedium) .align(Alignment.Center) ) } @@ -111,10 +106,10 @@ fun ConstraintLayoutScope.CardPriceText( priceText: String, priceRef: ConstrainedLayoutReference ) { - // Implementation for CardPriceText Text( text = priceText, - style = MaterialTheme.typography.h6, + style = Typography.h6, + color = Colors.onSurface, modifier = Modifier.constrainAs(priceRef) { top.linkTo(parent.top) end.linkTo(parent.end) @@ -130,9 +125,10 @@ fun ConstraintLayoutScope.CardModelText( ) { Text( text = modelText, - style = MaterialTheme.typography.subtitle1, + style = Typography.subtitle1, + color = Colors.onSurface, modifier = Modifier.constrainAs(modelRef) { - top.linkTo(imageBoxRef.bottom, margin = 8.dp) + top.linkTo(imageBoxRef.bottom, margin = Space.spaceSmall) start.linkTo(parent.start) } ) @@ -147,12 +143,12 @@ fun ConstraintLayoutScope.CardProgressIndicator( LinearProgressIndicator( progress = progressFraction, backgroundColor = Color.LightGray, - color = Color.Blue, + color = Colors.success, modifier = Modifier .fillMaxWidth() - .height(8.dp) + .height(Size.sizeXSmall) .constrainAs(progressRef) { - top.linkTo(modelRef.bottom, margin = 8.dp) + top.linkTo(modelRef.bottom, margin = Space.spaceSmall) start.linkTo(parent.start) end.linkTo(parent.end) } @@ -167,9 +163,10 @@ fun ConstraintLayoutScope.CardNextBillingText( ) { Text( text = nextText, - style = MaterialTheme.typography.caption, + style = Typography.caption, + color = Colors.onSurface, modifier = Modifier.constrainAs(nextBillingRef) { - top.linkTo(priceRef.bottom, margin = 4.dp) + top.linkTo(priceRef.bottom, margin = Space.space2XSmall) end.linkTo(parent.end) } ) @@ -183,9 +180,10 @@ fun ConstraintLayoutScope.CardBillingDateText( ) { Text( text = billingDateText, - style = MaterialTheme.typography.body1, + style = Typography.body1, + color = Colors.onSurface, modifier = Modifier.constrainAs(billingDateRef) { - top.linkTo(nextBillingRef.bottom, margin = 4.dp) + top.linkTo(nextBillingRef.bottom, margin = Space.space2XSmall) end.linkTo(parent.end) } ) @@ -199,11 +197,12 @@ fun ConstraintLayoutScope.CardProgressText( ) { Text( text = progressText, - style = MaterialTheme.typography.caption, + style = Typography.caption, + color = Colors.onSurface, modifier = Modifier.constrainAs(progressTextRef) { top.linkTo(progressRef.top) bottom.linkTo(progressRef.bottom) end.linkTo(progressRef.end) } ) -} \ No newline at end of file +} diff --git a/app/src/main/java/com/ouday/cryptowalletsample/home/ui/view/HomeScreen.kt b/app/src/main/java/com/ouday/cryptowalletsample/home/ui/view/HomeScreen.kt index 02287b4..49d9581 100644 --- a/app/src/main/java/com/ouday/cryptowalletsample/home/ui/view/HomeScreen.kt +++ b/app/src/main/java/com/ouday/cryptowalletsample/home/ui/view/HomeScreen.kt @@ -1,32 +1,21 @@ package com.ouday.cryptowalletsample.home.ui.view import androidx.compose.foundation.background -import androidx.compose.foundation.layout.Arrangement -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.fillMaxWidth -import androidx.compose.foundation.layout.height -import androidx.compose.foundation.layout.padding -import androidx.compose.foundation.layout.width +import androidx.compose.foundation.layout.* import androidx.compose.foundation.lazy.LazyRow import androidx.compose.foundation.rememberScrollState import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.foundation.verticalScroll import androidx.compose.material3.Text -import androidx.compose.runtime.Composable -import androidx.compose.runtime.LaunchedEffect -import androidx.compose.runtime.collectAsState -import androidx.compose.runtime.getValue +import androidx.compose.runtime.* import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.draw.clip +import androidx.compose.ui.res.stringResource import androidx.compose.ui.unit.dp import androidx.hilt.navigation.compose.hiltViewModel -import com.google.accompanist.pager.HorizontalPager -import com.google.accompanist.pager.HorizontalPagerIndicator -import com.google.accompanist.pager.rememberPagerState +import com.google.accompanist.pager.* +import com.ouday.cryptowalletsample.R import com.ouday.cryptowalletsample.common.FlowState import com.ouday.cryptowalletsample.common.HandleFlowState import com.ouday.cryptowalletsample.creditcards.data.model.CreditCardInfo @@ -34,10 +23,7 @@ import com.ouday.cryptowalletsample.home.components.BillOptionItem import com.ouday.cryptowalletsample.home.components.CreditCardComposable import com.ouday.cryptowalletsample.home.components.LoanCardComposable import com.ouday.cryptowalletsample.home.ui.viewmodel.HomeViewModel -import com.ouday.cryptowalletsample.ui.theme.Size -import com.ouday.cryptowalletsample.ui.theme.Space -import com.ouday.cryptowalletsample.ui.theme.Colors -import com.ouday.cryptowalletsample.ui.theme.Typography +import com.ouday.cryptowalletsample.ui.theme.* @Composable fun HomeScreen(modifier: Modifier = Modifier, viewModel: HomeViewModel = hiltViewModel()) { @@ -52,17 +38,19 @@ fun HomeScreen(modifier: Modifier = Modifier, viewModel: HomeViewModel = hiltVie CreditCards(viewModel = viewModel) Spacer(modifier = Modifier.height(Space.spaceMedium)) Text( - text = "Bill Payments", + text = stringResource(id = R.string.bill_payments), style = Typography.subtitle1, - modifier = Modifier.padding(start = Space.spaceLarge) + modifier = Modifier.padding(start = Space.spaceLarge), + color = Colors.onSurface ) Spacer(modifier = Modifier.height(Space.spaceSmall)) BillOptionsComposable(viewModel = viewModel) Spacer(modifier = Modifier.height(Space.spaceSmall)) Text( - text = "Active Loans", + text = stringResource(id = R.string.active_loans), style = Typography.subtitle1, - modifier = Modifier.padding(start = Space.spaceLarge) + modifier = Modifier.padding(start = Space.spaceLarge), + color = Colors.onSurface ) Spacer(modifier = Modifier.height(Space.spaceSmall)) Subscriptions(viewModel = viewModel) @@ -104,7 +92,6 @@ fun Subscriptions(viewModel: HomeViewModel = hiltViewModel()) { ) } - @Composable fun Test() { } @@ -179,4 +166,4 @@ fun CreditCardsPager(creditCards: List) { inactiveColor = Colors.primary.copy(alpha = 0.6f) ) } -} \ No newline at end of file +} diff --git a/app/src/main/java/com/ouday/cryptowalletsample/subscriptions/ui/view/SubscriptionScreen.kt b/app/src/main/java/com/ouday/cryptowalletsample/subscriptions/ui/view/SubscriptionScreen.kt index 7527e40..10fe647 100644 --- a/app/src/main/java/com/ouday/cryptowalletsample/subscriptions/ui/view/SubscriptionScreen.kt +++ b/app/src/main/java/com/ouday/cryptowalletsample/subscriptions/ui/view/SubscriptionScreen.kt @@ -1,17 +1,10 @@ package com.ouday.cryptowalletsample.subscriptions.ui.view import androidx.compose.foundation.background -import androidx.compose.foundation.layout.Box -import androidx.compose.foundation.layout.Column -import androidx.compose.foundation.layout.fillMaxWidth -import androidx.compose.foundation.layout.height -import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.layout.* import androidx.compose.foundation.lazy.LazyColumn import androidx.compose.foundation.shape.RoundedCornerShape -import androidx.compose.runtime.Composable -import androidx.compose.runtime.LaunchedEffect -import androidx.compose.runtime.collectAsState -import androidx.compose.runtime.getValue +import androidx.compose.runtime.* import androidx.compose.ui.Modifier import androidx.compose.ui.draw.clip import androidx.hilt.navigation.compose.hiltViewModel @@ -20,9 +13,7 @@ import com.ouday.cryptowalletsample.common.HandleFlowState import com.ouday.cryptowalletsample.home.components.LoanCardComposable import com.ouday.cryptowalletsample.subscriptions.data.model.Subscription import com.ouday.cryptowalletsample.subscriptions.ui.viewmodel.SubscriptionViewModel -import com.ouday.cryptowalletsample.ui.theme.Size -import com.ouday.cryptowalletsample.ui.theme.Space -import com.ouday.cryptowalletsample.ui.theme.Colors +import com.ouday.cryptowalletsample.ui.theme.* @Composable fun SubscriptionScreen(modifier: Modifier = Modifier, viewModel: SubscriptionViewModel = hiltViewModel()) { @@ -66,4 +57,4 @@ fun SubscriptionsList(subscriptions: List, modifier: Modifier = Mo } } } -} \ No newline at end of file +} diff --git a/app/src/main/res/values/strings.xml b/app/src/main/res/values/strings.xml index e8b59b7..c320c89 100644 --- a/app/src/main/res/values/strings.xml +++ b/app/src/main/res/values/strings.xml @@ -6,4 +6,9 @@ Not Paid Due Date %1$s PAY + Bill Payments + Active Loans + %1$s bill option + %1$s image + \ No newline at end of file