Skip to content

Commit

Permalink
Merge pull request #14 from mende273/create_ui_shared_package
Browse files Browse the repository at this point in the history
Create ui shared package and move BottomNavigationBar and TopAppBar
  • Loading branch information
mende273 authored Mar 7, 2023
2 parents 9b86615 + a49194a commit 89dfd05
Show file tree
Hide file tree
Showing 3 changed files with 109 additions and 85 deletions.
92 changes: 7 additions & 85 deletions app/src/main/java/com/jumrukovski/quotescompose/MainActivity.kt
Original file line number Diff line number Diff line change
Expand Up @@ -8,98 +8,20 @@ import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.padding
import androidx.compose.material3.*
import androidx.compose.runtime.Composable
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Scaffold
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.unit.dp
import com.jumrukovski.quotescompose.ui.theme.*
import com.jumrukovski.quotescompose.ui.shared.BottomNavigationBar
import com.jumrukovski.quotescompose.ui.shared.Toolbar
import com.jumrukovski.quotescompose.ui.theme.PrimaryBackgroundColor
import com.jumrukovski.quotescompose.ui.theme.QuotesComposeTheme

class MainActivity : ComponentActivity() {

@OptIn(ExperimentalMaterial3Api::class)
@Composable
private fun Toolbar(
topMenuItems: List<MainActivityMenuItem>,
onActionClick: (MainActivityMenuItem) -> Unit = {}
) {
TopAppBar(
modifier = Modifier.background(MaterialTheme.colorScheme.PrimaryBackgroundColor),
title = { Text(stringResource(R.string.app_name)) },
colors = TopAppBarDefaults.topAppBarColors(
containerColor = MaterialTheme.colorScheme.PrimaryBackgroundColor,
scrolledContainerColor = MaterialTheme.colorScheme.PrimaryBackgroundColor,
navigationIconContentColor = MaterialTheme.colorScheme.PrimaryTextColor,
titleContentColor = MaterialTheme.colorScheme.PrimaryTextColor,
actionIconContentColor = MaterialTheme.colorScheme.PrimaryTextColor
),
actions = {
topMenuItems.forEach { topMenuItem ->
TopMenuItem(topMenuItem = topMenuItem, onActionClick = { onActionClick(it) })
}
}
)
}

@Composable
private fun TopMenuItem(
topMenuItem: MainActivityMenuItem,
onActionClick: (MainActivityMenuItem) -> Unit = {}
) {
IconButton(onClick = { onActionClick(topMenuItem) }) {
Icon(
painter = painterResource(id = topMenuItem.drawable),
contentDescription = topMenuItem.title,
tint = MaterialTheme.colorScheme.onSurface
)
}
}

//todo do it differently
data class MainActivityMenuItem(val title: String, @DrawableRes val drawable: Int)

@Composable
private fun BottomNavigationBar(onItemClick: (BottomMenuItem) -> Unit = {}) {
val selectedIndex = remember { mutableStateOf(0) }

NavigationBar(
modifier = Modifier,
contentColor = MaterialTheme.colorScheme.NavigationBarItemRippleColor,
tonalElevation = 0.dp,
containerColor = MaterialTheme.colorScheme.NavigationBarBackgroundColor,
content = {
BottomMenuItem.values().forEachIndexed { index, menuItem ->
NavigationBarItem(
selected = selectedIndex.value == index,
onClick = {
selectedIndex.value = index
onItemClick(BottomMenuItem.values()[index])
},
label = { Text(text = stringResource(id = menuItem.titleTextId)) },
enabled = true,
icon = {
Icon(
painter = painterResource(id = menuItem.icon),
contentDescription = stringResource(id = menuItem.titleTextId)
)
},
alwaysShowLabel = true,
colors = NavigationBarItemDefaults.colors(
selectedIconColor = MaterialTheme.colorScheme.NavigationBarSelectedItemColor,
unselectedIconColor = MediumDarkGreyColor,
selectedTextColor = MaterialTheme.colorScheme.NavigationBarSelectedItemColor,
unselectedTextColor = MediumDarkGreyColor,
indicatorColor = MaterialTheme.colorScheme.NavigationBarBackgroundColor
)
)
}
}
)
}

override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)

Expand All @@ -114,7 +36,7 @@ class MainActivity : ComponentActivity() {
QuotesComposeTheme {
Scaffold(
topBar = {
Toolbar(topMenuItems) { menuItem ->
Toolbar(stringResource(id = R.string.app_name), topMenuItems) { menuItem ->
//todo handle top menu item
}
},
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,54 @@
package com.jumrukovski.quotescompose.ui.shared

import androidx.compose.material3.*
import androidx.compose.runtime.Composable
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.unit.dp
import com.jumrukovski.quotescompose.BottomMenuItem
import com.jumrukovski.quotescompose.ui.theme.MediumDarkGreyColor
import com.jumrukovski.quotescompose.ui.theme.NavigationBarBackgroundColor
import com.jumrukovski.quotescompose.ui.theme.NavigationBarItemRippleColor
import com.jumrukovski.quotescompose.ui.theme.NavigationBarSelectedItemColor

@Composable
fun BottomNavigationBar(onItemClick: (BottomMenuItem) -> Unit = {}) {
val selectedIndex = remember { mutableStateOf(0) }

NavigationBar(
modifier = Modifier,
contentColor = MaterialTheme.colorScheme.NavigationBarItemRippleColor,
tonalElevation = 0.dp,
containerColor = MaterialTheme.colorScheme.NavigationBarBackgroundColor,
content = {
BottomMenuItem.values().forEachIndexed { index, menuItem ->
NavigationBarItem(
selected = selectedIndex.value == index,
onClick = {
selectedIndex.value = index
onItemClick(BottomMenuItem.values()[index])
},
label = { Text(text = stringResource(id = menuItem.titleTextId)) },
enabled = true,
icon = {
Icon(
painter = painterResource(id = menuItem.icon),
contentDescription = stringResource(id = menuItem.titleTextId)
)
},
alwaysShowLabel = true,
colors = NavigationBarItemDefaults.colors(
selectedIconColor = MaterialTheme.colorScheme.NavigationBarSelectedItemColor,
unselectedIconColor = MediumDarkGreyColor,
selectedTextColor = MaterialTheme.colorScheme.NavigationBarSelectedItemColor,
unselectedTextColor = MediumDarkGreyColor,
indicatorColor = MaterialTheme.colorScheme.NavigationBarBackgroundColor
)
)
}
}
)
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,48 @@
package com.jumrukovski.quotescompose.ui.shared

import androidx.compose.foundation.background
import androidx.compose.material3.*
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.painterResource
import com.jumrukovski.quotescompose.MainActivity
import com.jumrukovski.quotescompose.ui.theme.PrimaryBackgroundColor
import com.jumrukovski.quotescompose.ui.theme.PrimaryTextColor

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun Toolbar(title:String,
topMenuItems: List<MainActivity.MainActivityMenuItem>,
onActionClick: (MainActivity.MainActivityMenuItem) -> Unit = {}
) {
TopAppBar(
modifier = Modifier.background(MaterialTheme.colorScheme.PrimaryBackgroundColor),
title = { Text(title) },
colors = TopAppBarDefaults.topAppBarColors(
containerColor = MaterialTheme.colorScheme.PrimaryBackgroundColor,
scrolledContainerColor = MaterialTheme.colorScheme.PrimaryBackgroundColor,
navigationIconContentColor = MaterialTheme.colorScheme.PrimaryTextColor,
titleContentColor = MaterialTheme.colorScheme.PrimaryTextColor,
actionIconContentColor = MaterialTheme.colorScheme.PrimaryTextColor
),
actions = {
topMenuItems.forEach { topMenuItem ->
TopMenuItem(topMenuItem = topMenuItem, onActionClick = { onActionClick(it) })
}
}
)
}

@Composable
private fun TopMenuItem(
topMenuItem: MainActivity.MainActivityMenuItem,
onActionClick: (MainActivity.MainActivityMenuItem) -> Unit = {}
) {
IconButton(onClick = { onActionClick(topMenuItem) }) {
Icon(
painter = painterResource(id = topMenuItem.drawable),
contentDescription = topMenuItem.title,
tint = MaterialTheme.colorScheme.onSurface
)
}
}

0 comments on commit 89dfd05

Please sign in to comment.