Skip to content
2 changes: 0 additions & 2 deletions app/src/main/java/com/brainwallet/navigation/MainNav.kt
Original file line number Diff line number Diff line change
Expand Up @@ -136,6 +136,4 @@ fun NavGraphBuilder.mainNavGraph(
val route: Route.GameHub = navBackStackEntry.toRoute()
GameHubScreen(onNavigate = onNavigate)
}

// todo add more composable screens
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,179 @@
package com.brainwallet.ui.bentosections.gamehubbento

import androidx.compose.foundation.Image
import androidx.compose.foundation.background
import androidx.compose.foundation.border
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.fillMaxHeight
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material3.Card
import androidx.compose.material3.CardDefaults
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.geometry.Offset
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.Shadow
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.TextStyle
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.text.style.TextOverflow
import androidx.compose.ui.tooling.preview.PreviewLightDark
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import com.brainwallet.R
import com.brainwallet.ui.theme.BoldenVan
import com.brainwallet.ui.theme.IBMPlexSans
import com.brainwallet.ui.theme.bentoBorderGradient
import com.brainwallet.ui.theme.gameHubBackgroundGradient
import com.brainwallet.ui.theme.gameTaglineGradient
import com.brainwallet.ui.theme.gameTitleGradient

@Composable
fun GameHubBentoScreen(
modifier: Modifier = Modifier,
onClick: () -> Unit = {}
) {
val gameHubBackground = R.drawable.game_hub_bk
Card(
modifier = modifier.fillMaxWidth(),
shape = RoundedCornerShape(16.dp),
elevation = CardDefaults.cardElevation(defaultElevation = 0.dp),
onClick = onClick
) {
Box(
modifier = Modifier
.fillMaxWidth()
.weight(1f)
.background(brush = gameHubBackgroundGradient)
.border(
width = 0.7.dp,
brush = bentoBorderGradient,
shape = RoundedCornerShape(16.dp)
)
) {
Image(
painter = painterResource(gameHubBackground),
contentDescription = "game_hub_background",
modifier = Modifier.fillMaxSize(),
contentScale = ContentScale.Crop
)
val textWidthRatio = 0.85f
Column(
modifier = Modifier
.padding(start = 16.dp)
.fillMaxHeight(),
verticalArrangement = Arrangement.Center,
horizontalAlignment = Alignment.Start
) {
Box(
modifier = Modifier.fillMaxWidth(textWidthRatio)
.height(44.dp)
) {
Text(
text = "FALLINMOJI",
style = TextStyle(
fontFamily = BoldenVan,
fontWeight = FontWeight.Normal,
fontSize = 39.sp,
shadow = Shadow(
color = Color.Black.copy(alpha = 0.5f),
offset = Offset(x = 4f, y = 4f),
blurRadius = 4f
)
),
maxLines = 1,
overflow = TextOverflow.Ellipsis,
modifier = Modifier.fillMaxWidth(textWidthRatio)
)

Text(
text = "FALLINMOJI",
style = TextStyle(
brush = gameTitleGradient,
fontFamily = BoldenVan,
fontWeight = FontWeight.Normal,
fontSize = 39.sp
),
maxLines = 1,
overflow = TextOverflow.Ellipsis,
modifier = Modifier.fillMaxWidth(textWidthRatio)
)
}
Box(
modifier = Modifier.fillMaxWidth(textWidthRatio)
.padding(top = 1.dp)
) {
Text(
text = stringResource(R.string.game_hub_tagline),
style = TextStyle(
fontFamily = IBMPlexSans,
fontWeight = FontWeight.Medium,
fontSize = 13.sp,
shadow = Shadow(
color = Color.Black.copy(alpha = 0.5f),
offset = Offset(x = 4f, y = 4f),
blurRadius = 4f
)
),
maxLines = 1,
overflow = TextOverflow.Ellipsis,
modifier = Modifier.fillMaxWidth(textWidthRatio)
)
Text(
text = stringResource(R.string.game_hub_tagline),
style = TextStyle(
brush = gameTaglineGradient,
fontFamily = IBMPlexSans,
fontWeight = FontWeight.Medium,
fontSize = 13.sp
),
maxLines = 1,
overflow = TextOverflow.Ellipsis,
modifier = Modifier.fillMaxWidth(textWidthRatio)
)
}
}

Column(
modifier = Modifier
.padding(10.dp)
.fillMaxHeight(),
verticalArrangement = Arrangement.Top,
horizontalAlignment = Alignment.Start
) {
Text(
text = stringResource(R.string.game_hub_label),
color = Color.White,
style = TextStyle(
fontFamily = IBMPlexSans,
fontWeight = FontWeight.Normal,
fontSize = 10.sp
),
modifier = Modifier.padding(start = 1.dp, end = 1.dp)
.background(
color = Color.White.copy(alpha = 0.2f),
shape = RoundedCornerShape(6.dp)
).padding(horizontal = 10.dp, vertical = 2.dp)
)
}
}
}
}

@PreviewLightDark
@Composable
private fun GameHubBentoScreenPreview() {
Box(modifier = Modifier.height(120.dp)) {
GameHubBentoScreen()
}
}
Original file line number Diff line number Diff line change
@@ -1,6 +1,8 @@
package com.brainwallet.ui.composable

import androidx.compose.foundation.isSystemInDarkTheme
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.navigationBarsPadding
import androidx.compose.material3.Icon
import androidx.compose.material3.NavigationBar
import androidx.compose.material3.NavigationBarItem
Expand All @@ -10,8 +12,10 @@ import androidx.compose.ui.Modifier
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.tooling.preview.PreviewLightDark
import androidx.compose.ui.graphics.Color
import com.brainwallet.R
import com.brainwallet.navigation.Route
import com.brainwallet.ui.layoutconstants.bottomNavHeight
import com.grunt.brainwallet.core.presentation.theme.BrainwalletTheme

/**
Expand All @@ -28,9 +32,11 @@ fun BentoBottomNavBar(
modifier: Modifier = Modifier,
) {
NavigationBar(
modifier = modifier,
containerColor = BrainwalletTheme.colors.surface,
contentColor = BrainwalletTheme.colors.content
contentColor = BrainwalletTheme.colors.content,
modifier = modifier
.navigationBarsPadding()
.height(bottomNavHeight)
) {
NavigationBarItem(
selected = currentRoute is Route.Send,
Expand All @@ -41,7 +47,14 @@ fun BentoBottomNavBar(
contentDescription = stringResource(id = R.string.send_tab_description)
)
},
label = { Text("Send") }
label = { Text("Send") },
colors = androidx.compose.material3.NavigationBarItemDefaults.colors(
selectedIconColor = BrainwalletTheme.colors.content,
selectedTextColor = BrainwalletTheme.colors.content,
indicatorColor = Color.Transparent,
unselectedIconColor = BrainwalletTheme.colors.content.copy(0.8f),
unselectedTextColor = BrainwalletTheme.colors.content.copy(0.8f)
)
)
NavigationBarItem(
selected = currentRoute is Route.BuyReceive,
Expand All @@ -52,7 +65,14 @@ fun BentoBottomNavBar(
contentDescription = stringResource(id = R.string.buy_receive_tab_description)
)
},
label = { Text("Buy/Receive") }
label = { Text("Buy/Receive") },
colors = androidx.compose.material3.NavigationBarItemDefaults.colors(
selectedIconColor = BrainwalletTheme.colors.content,
selectedTextColor = BrainwalletTheme.colors.content,
indicatorColor = Color.Transparent,
unselectedIconColor = BrainwalletTheme.colors.content.copy(0.8f),
unselectedTextColor = BrainwalletTheme.colors.content.copy(0.8f)
)
)
NavigationBarItem(
selected = currentRoute is Route.GameHub,
Expand All @@ -63,7 +83,14 @@ fun BentoBottomNavBar(
contentDescription = stringResource(id = R.string.game_hub_tab_description)
)
},
label = { Text("Game Hub") }
label = { Text("Game Hub") },
colors = androidx.compose.material3.NavigationBarItemDefaults.colors(
selectedIconColor = BrainwalletTheme.colors.content,
selectedTextColor = BrainwalletTheme.colors.content,
indicatorColor = Color.Transparent,
unselectedIconColor = BrainwalletTheme.colors.content.copy(0.8f),
unselectedTextColor = BrainwalletTheme.colors.content.copy(0.8f)
)
)
NavigationBarItem(
selected = currentRoute is Route.History,
Expand All @@ -74,7 +101,14 @@ fun BentoBottomNavBar(
contentDescription = stringResource(id = R.string.history_tab_description)
)
},
label = { Text("History") }
label = { Text("History") },
colors = androidx.compose.material3.NavigationBarItemDefaults.colors(
selectedIconColor = BrainwalletTheme.colors.content,
selectedTextColor = BrainwalletTheme.colors.content,
indicatorColor = Color.Transparent,
unselectedIconColor = BrainwalletTheme.colors.content.copy(0.8f),
unselectedTextColor = BrainwalletTheme.colors.content.copy(0.8f)
)
)
}
}
Expand Down
11 changes: 11 additions & 0 deletions app/src/main/java/com/brainwallet/ui/layoutconstants/Constants.kt
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
package com.brainwallet.ui.layoutconstants

import androidx.compose.ui.unit.dp

val topAppBarHtPlus = 64.dp + 16.dp
val balanceGameBentoHeight = 105.dp
val bottomNavHeight = 85.dp
val gameHubHeight = 120.dp
val transRowHeight = 60.dp

val mainHeightComponentsFactor = balanceGameBentoHeight + gameHubHeight + transRowHeight + bottomNavHeight
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,6 @@ import com.brainwallet.ui.composable.LargeButton
import com.grunt.brainwallet.core.presentation.theme.BrainwalletTheme
import org.koin.compose.viewmodel.koinViewModel

// TODO: wip
@Composable
fun BuyReceiveScreen(
onNavigate: OnNavigate,
Expand Down
Loading