base clean ui structure

This commit is contained in:
Artemis 2025-03-04 14:59:02 +01:00
parent a79f289440
commit 2cb498bb37
7 changed files with 179 additions and 6 deletions

View file

@ -45,6 +45,7 @@ dependencies {
implementation(libs.androidx.lifecycle.runtime.ktx)
implementation(libs.androidx.activity.compose)
implementation(platform(libs.androidx.compose.bom))
implementation(libs.androidx.navigation.compose)
implementation(libs.androidx.ui)
implementation(libs.androidx.ui.graphics)
implementation(libs.androidx.ui.tooling.preview)

View file

@ -3,7 +3,19 @@ package pet.catcomm
import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.foundation.layout.padding
import androidx.compose.material3.Scaffold
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.ui.Modifier
import androidx.navigation.NavHostController
import androidx.navigation.compose.NavHost
import androidx.navigation.compose.composable
import androidx.navigation.compose.currentBackStackEntryAsState
import androidx.navigation.compose.rememberNavController
import pet.catcomm.ui.compose.BottomBar
import pet.catcomm.ui.compose.Peers
import pet.catcomm.ui.compose.TopBar
import pet.catcomm.ui.theme.CatCommTheme
class MainActivity : ComponentActivity() {
@ -11,9 +23,56 @@ class MainActivity : ComponentActivity() {
super.onCreate(savedInstanceState)
setContent {
CatCommTheme {
Peers()
}
CatCommApp()
}
}
}
@Composable
fun CatCommApp() {
val navController = rememberNavController()
val currentBackStack by navController.currentBackStackEntryAsState()
val currentCCDestination = currentBackStack?.destination
CatCommTheme {
Scaffold(
topBar = {
TopBar()
},
bottomBar = {
BottomBar(
pages = navBarTabs,
currentPageRoute = currentCCDestination?.route,
onSelect = { selected ->
navController.navigateSingleTo(selected.route)
}
)
}
) { innerPadding ->
CatCommNavHost(
navController = navController,
modifier = Modifier.padding(innerPadding),
)
}
}
}
@Composable
fun CatCommNavHost(
navController: NavHostController,
modifier: Modifier = Modifier,
) {
NavHost(
navController = navController,
startDestination = Overview.route,
modifier = modifier,
) {
composable(route = Overview.route) {
Peers()
}
composable(route = Settings.route) {
// TODO
}
}
}

View file

@ -0,0 +1,32 @@
package pet.catcomm
import androidx.annotation.StringRes
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Headphones
import androidx.compose.material.icons.filled.Settings
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.navigation.NavHostController
interface CCDestination {
val icon: ImageVector
@get:StringRes
val label: Int
val route: String
}
object Overview : CCDestination {
override val icon = Icons.Filled.Headphones
override val label = R.string.comms_tab_label
override val route = "overview"
}
object Settings : CCDestination {
override val icon = Icons.Filled.Settings
override val label = R.string.settings_tab_label
override val route = "settings"
}
val navBarTabs = listOf(Overview, Settings)
fun NavHostController.navigateSingleTo(route: String) =
this.navigate(route) { launchSingleTop = true }

View file

@ -0,0 +1,46 @@
package pet.catcomm.ui.compose
import androidx.compose.material3.Icon
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.NavigationBar
import androidx.compose.material3.NavigationBarItem
import androidx.compose.material3.NavigationBarItemDefaults
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.stringResource
import pet.catcomm.CCDestination
@Composable
fun BottomBar(
pages: List<CCDestination>,
currentPageRoute: String?,
onSelect: (CCDestination) -> Unit,
modifier: Modifier = Modifier,
) {
NavigationBar(
modifier = modifier,
containerColor = MaterialTheme.colorScheme.primary,
) {
pages.forEach { page ->
val label = stringResource(page.label)
NavigationBarItem(
colors = NavigationBarItemDefaults.colors(
selectedTextColor = MaterialTheme.colorScheme.onPrimary,
selectedIconColor = MaterialTheme.colorScheme.primary,
unselectedTextColor = MaterialTheme.colorScheme.onPrimary,
unselectedIconColor = MaterialTheme.colorScheme.onPrimary,
),
icon = {
Icon(
imageVector = page.icon,
contentDescription = label,
)
},
label = { Text(label) },
selected = page.route == currentPageRoute,
onClick = { onSelect(page) }
)
}
}
}

View file

@ -0,0 +1,34 @@
package pet.catcomm.ui.compose
import androidx.compose.foundation.layout.padding
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Text
import androidx.compose.material3.TopAppBar
import androidx.compose.material3.TopAppBarDefaults
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import pet.catcomm.R
@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun TopBar(
modifier: Modifier = Modifier
) {
TopAppBar(
title = { Text(stringResource(R.string.app_name)) },
colors = TopAppBarDefaults.topAppBarColors(
containerColor = MaterialTheme.colorScheme.primary,
titleContentColor = MaterialTheme.colorScheme.onPrimary,
),
)
}
@Preview(showBackground = true, widthDp = 180, heightDp = 120)
@Composable
fun TopBarPreview() {
TopBar(modifier = Modifier.padding(8.dp))
}

View file

@ -1,6 +1,5 @@
<resources>
<string name="app_name">CatComm</string>
<string name="title_home">Home</string>
<string name="title_dashboard">Dashboard</string>
<string name="title_notifications">Notifications</string>
<string name="comms_tab_label">Comms</string>
<string name="settings_tab_label">Settings</string>
</resources>

View file

@ -8,10 +8,12 @@ espressoCore = "3.6.1"
lifecycleRuntimeKtx = "2.8.7"
activityCompose = "1.10.1"
composeBom = "2025.02.00"
navigationCompose = "2.8.8"
[libraries]
androidx-core-ktx = { group = "androidx.core", name = "core-ktx", version.ref = "coreKtx" }
androidx-material-icons-extended = { module = "androidx.compose.material:material-icons-extended" }
androidx-navigation-compose = { module = "androidx.navigation:navigation-compose", version.ref = "navigationCompose" }
junit = { group = "junit", name = "junit", version.ref = "junit" }
androidx-junit = { group = "androidx.test.ext", name = "junit", version.ref = "junitVersion" }
androidx-espresso-core = { group = "androidx.test.espresso", name = "espresso-core", version.ref = "espressoCore" }