diff --git a/Ledger/app/build.gradle.kts b/Ledger/app/build.gradle.kts index 0a8e726..b0b0628 100644 --- a/Ledger/app/build.gradle.kts +++ b/Ledger/app/build.gradle.kts @@ -5,12 +5,12 @@ plugins { android { namespace = "at.xaxa.ledger" - compileSdk = 34 + compileSdk = 35 defaultConfig { applicationId = "at.xaxa.ledger" minSdk = 29 - targetSdk = 34 + targetSdk = 35 versionCode = 1 versionName = "1.0" diff --git a/Ledger/app/src/main/java/at/xaxa/ledger/ui/LedgerUI.kt b/Ledger/app/src/main/java/at/xaxa/ledger/ui/LedgerUI.kt new file mode 100644 index 0000000..d631980 --- /dev/null +++ b/Ledger/app/src/main/java/at/xaxa/ledger/ui/LedgerUI.kt @@ -0,0 +1,201 @@ +package at.xaxa.ledger.ui + +import androidx.compose.foundation.BorderStroke +import androidx.compose.foundation.layout.Arrangement +import androidx.compose.foundation.layout.Box +import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.PaddingValues +import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.fillMaxHeight +import androidx.compose.foundation.layout.fillMaxSize +import androidx.compose.foundation.layout.fillMaxWidth +import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.layout.requiredHeight +import androidx.compose.foundation.layout.requiredWidth +import androidx.compose.foundation.layout.size +import androidx.compose.foundation.layout.wrapContentHeight +import androidx.compose.foundation.layout.wrapContentSize +import androidx.compose.foundation.layout.wrapContentWidth +import androidx.compose.foundation.shape.RoundedCornerShape +import androidx.compose.material3.Button +import androidx.compose.material3.ButtonDefaults +import androidx.compose.material3.MaterialTheme +import androidx.compose.material3.Surface +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.draw.clip +import androidx.compose.ui.graphics.Color +import androidx.compose.ui.text.TextStyle +import androidx.compose.ui.text.font.FontWeight +import androidx.compose.ui.text.style.TextAlign +import androidx.compose.ui.tooling.preview.Preview +import androidx.compose.ui.unit.dp +import androidx.compose.ui.unit.em +import androidx.compose.ui.unit.sp + + +// region Horizontal Card +@Composable +fun HorizontalCard(modifier: Modifier = Modifier, name: String, date: String, amount:String) { + Surface( + shape = RoundedCornerShape(12.dp), + color = Color(0xfff9f9f9), + border = BorderStroke(1.dp, Color(0xffc6c6c6)), + modifier = modifier + .requiredWidth(width = 360.dp) + .requiredHeight(height = 80.dp) + .clip(shape = RoundedCornerShape(12.dp)) + ) { + Row( + modifier = Modifier + .fillMaxSize() + .padding(16.dp) + ) { + LayoutMediaText(modifier, name, date, amount) + } + } +} + +@Composable +fun LayoutMediaText(modifier: Modifier = Modifier, name: String, date: String, amount:String) { + Row( + verticalAlignment = Alignment.CenterVertically, + modifier = modifier + .fillMaxWidth() + ) { + Column( + verticalArrangement = Arrangement.spacedBy(4.dp, Alignment.Top), + modifier = Modifier + .weight(1f) + ) { + Text( + text = name, + color = Color(0xff1b1b1b), + lineHeight = 1.5.em, + style = TextStyle( + fontSize = 16.sp, + fontWeight = FontWeight.Medium, + letterSpacing = 0.15.sp + ) + ) + Text( + text = date, + color = Color(0xff1b1b1b), + lineHeight = 1.43.em, + style = TextStyle( + fontSize = 14.sp, + letterSpacing = 0.25.sp + ) + ) + } + Box( + modifier = Modifier + .fillMaxHeight() + .wrapContentWidth() // Allow the Box to wrap its content width + .padding(start = 16.dp), // Add some padding to separate from the Column + contentAlignment = Alignment.Center + ) { + Text( + text = amount, + fontSize = 30.sp, // Set the desired font size + modifier = Modifier.wrapContentSize() // Ensure the text wraps its content + ) + } + } +} + +@Preview(widthDp = 360, heightDp = 80) +@Composable +private fun HorizontalCardPreview() { + HorizontalCard(Modifier, "McDonald's", "12th Feb, 23:32am", "-124234.00€") +} +// endregion + +// region Button Success +@Composable +fun ButtonSuccess(modifier: Modifier = Modifier, text: String, onClick: () -> Unit) { + Button( + onClick = onClick, + shape = RoundedCornerShape(10.dp), + colors = ButtonDefaults.buttonColors(containerColor = Color(0xff61a483)), + contentPadding = PaddingValues(horizontal = 24.dp, vertical = 10.dp), + modifier = modifier + .requiredHeight(height = 40.dp) + ) { + Column( + verticalArrangement = Arrangement.spacedBy(8.dp, Alignment.CenterVertically), + horizontalAlignment = Alignment.CenterHorizontally, + modifier = Modifier + .requiredHeight(height = 40.dp) + ) { + Row( + horizontalArrangement = Arrangement.spacedBy(8.dp, Alignment.CenterHorizontally), + verticalAlignment = Alignment.CenterVertically, + modifier = Modifier + .fillMaxSize() + ) { + Text( + text = text, + color = Color.White, + textAlign = TextAlign.Center, + lineHeight = 1.43.em, + style = MaterialTheme.typography.labelLarge, + modifier = Modifier + .wrapContentHeight(align = Alignment.CenterVertically)) + } + } + } +} + +@Preview() +@Composable +private fun ButtonSuccessPreview() { + ButtonSuccess(Modifier, "Success", onClick = { println("success") }) +} +// endregion + +// region Button Danger +@Composable +fun ButtonDanger(modifier: Modifier = Modifier, text: String, onClick: () -> Unit) { + Button( + onClick = onClick, + shape = RoundedCornerShape(10.dp), + colors = ButtonDefaults.buttonColors(containerColor = Color(0xffc14d4d)), + contentPadding = PaddingValues(horizontal = 24.dp, vertical = 10.dp), + modifier = modifier + .requiredHeight(height = 40.dp) + ) { + Column( + verticalArrangement = Arrangement.spacedBy(8.dp, Alignment.CenterVertically), + horizontalAlignment = Alignment.CenterHorizontally, + modifier = Modifier + .requiredHeight(height = 40.dp) + ) { + Row( + horizontalArrangement = Arrangement.spacedBy(8.dp, Alignment.CenterHorizontally), + verticalAlignment = Alignment.CenterVertically, + modifier = Modifier + .fillMaxSize() + ) { + Text( + text = text, + color = Color.White, + textAlign = TextAlign.Center, + lineHeight = 1.43.em, + style = MaterialTheme.typography.labelLarge, + modifier = Modifier + .wrapContentHeight(align = Alignment.CenterVertically)) + } + } + } +} + +@Preview() +@Composable +private fun ButtonDangerPreview() { + ButtonDanger(Modifier, "Danger", onClick = { println("success") }) +} +// endregion +