Feature: Navigation Bar
This commit is contained in:
parent
cb8684b5d3
commit
f4b684e093
@ -5,12 +5,12 @@ plugins {
|
||||
|
||||
android {
|
||||
namespace = "com.example.android_programming"
|
||||
compileSdk = 33
|
||||
compileSdk = 34
|
||||
|
||||
defaultConfig {
|
||||
applicationId = "com.example.android_programming"
|
||||
minSdk = 24
|
||||
targetSdk = 33
|
||||
targetSdk = 34
|
||||
versionCode = 1
|
||||
versionName = "1.0"
|
||||
|
||||
@ -51,14 +51,14 @@ android {
|
||||
|
||||
dependencies {
|
||||
|
||||
implementation("androidx.core:core-ktx:1.9.0")
|
||||
implementation("androidx.core:core-ktx:1.12.0")
|
||||
implementation("androidx.lifecycle:lifecycle-runtime-ktx:2.6.2")
|
||||
implementation("androidx.activity:activity-compose:1.7.2")
|
||||
implementation(platform("androidx.compose:compose-bom:2023.03.00"))
|
||||
implementation("androidx.compose.ui:ui")
|
||||
implementation("androidx.compose.ui:ui-graphics")
|
||||
implementation("androidx.compose.ui:ui-tooling-preview")
|
||||
implementation("androidx.compose.material3:material3")
|
||||
implementation("androidx.compose.material:material")
|
||||
testImplementation("junit:junit:4.13.2")
|
||||
androidTestImplementation("androidx.test.ext:junit:1.1.5")
|
||||
androidTestImplementation("androidx.test.espresso:espresso-core:3.5.1")
|
||||
@ -66,4 +66,6 @@ dependencies {
|
||||
androidTestImplementation("androidx.compose.ui:ui-test-junit4")
|
||||
debugImplementation("androidx.compose.ui:ui-tooling")
|
||||
debugImplementation("androidx.compose.ui:ui-test-manifest")
|
||||
|
||||
implementation("androidx.navigation:navigation-compose:2.7.3")
|
||||
}
|
@ -3,44 +3,13 @@ package com.example.android_programming
|
||||
import android.os.Bundle
|
||||
import androidx.activity.ComponentActivity
|
||||
import androidx.activity.compose.setContent
|
||||
import androidx.compose.foundation.layout.fillMaxSize
|
||||
import androidx.compose.material3.MaterialTheme
|
||||
import androidx.compose.material3.Surface
|
||||
import androidx.compose.material3.Text
|
||||
import androidx.compose.runtime.Composable
|
||||
import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
import com.example.android_programming.ui.theme.AndroidProgrammingTheme
|
||||
import com.example.android_programming.Navigation.Navigate
|
||||
|
||||
class MainActivity : ComponentActivity() {
|
||||
override fun onCreate(savedInstanceState: Bundle?) {
|
||||
super.onCreate(savedInstanceState)
|
||||
setContent {
|
||||
AndroidProgrammingTheme {
|
||||
// A surface container using the 'background' color from the theme
|
||||
Surface(
|
||||
modifier = Modifier.fillMaxSize(),
|
||||
color = MaterialTheme.colorScheme.background
|
||||
) {
|
||||
Greeting("Android")
|
||||
}
|
||||
}
|
||||
Navigate()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@Composable
|
||||
fun Greeting(name: String, modifier: Modifier = Modifier) {
|
||||
Text(
|
||||
text = "Hello $name!",
|
||||
modifier = modifier
|
||||
)
|
||||
}
|
||||
|
||||
@Preview(showBackground = true)
|
||||
@Composable
|
||||
fun GreetingPreview() {
|
||||
AndroidProgrammingTheme {
|
||||
Greeting("Android")
|
||||
}
|
||||
}
|
@ -0,0 +1,31 @@
|
||||
package com.example.android_programming.Navigation
|
||||
|
||||
import androidx.compose.runtime.Composable
|
||||
import androidx.navigation.NavHostController
|
||||
import androidx.navigation.compose.NavHost
|
||||
import androidx.navigation.compose.composable
|
||||
import com.example.android_programming.Screens.HomeScreen
|
||||
import com.example.android_programming.Screens.LikeScreen
|
||||
import com.example.android_programming.Screens.OrderScreen
|
||||
import com.example.android_programming.Screens.ProfileScreen
|
||||
|
||||
@Composable
|
||||
fun NavController(navController: NavHostController){
|
||||
NavHost(
|
||||
navController = navController,
|
||||
startDestination = NavItem.Home.route
|
||||
){
|
||||
composable(NavItem.Home.route){
|
||||
HomeScreen()
|
||||
}
|
||||
composable(NavItem.Like.route){
|
||||
LikeScreen()
|
||||
}
|
||||
composable(NavItem.Order.route){
|
||||
OrderScreen()
|
||||
}
|
||||
composable(NavItem.Profile.route){
|
||||
ProfileScreen()
|
||||
}
|
||||
}
|
||||
}
|
@ -0,0 +1,15 @@
|
||||
package com.example.android_programming.Navigation
|
||||
|
||||
import androidx.compose.material.icons.Icons
|
||||
import androidx.compose.material.icons.filled.Favorite
|
||||
import androidx.compose.material.icons.filled.Home
|
||||
import androidx.compose.material.icons.filled.Person
|
||||
import androidx.compose.material.icons.filled.ShoppingCart
|
||||
import androidx.compose.ui.graphics.vector.ImageVector
|
||||
|
||||
sealed class NavItem (val route: String, val icon: ImageVector){
|
||||
object Home : NavItem("home", Icons.Default.Home)
|
||||
object Like : NavItem("like", Icons.Default.Favorite)
|
||||
object Order : NavItem("order", Icons.Default.ShoppingCart)
|
||||
object Profile : NavItem("profile", Icons.Default.Person)
|
||||
}
|
@ -0,0 +1,82 @@
|
||||
package com.example.android_programming.Navigation
|
||||
|
||||
import android.annotation.SuppressLint
|
||||
import androidx.compose.foundation.background
|
||||
import androidx.compose.foundation.layout.padding
|
||||
import androidx.compose.foundation.layout.size
|
||||
import androidx.compose.foundation.shape.CircleShape
|
||||
import androidx.compose.material.BottomNavigation
|
||||
import androidx.compose.material.BottomNavigationItem
|
||||
import androidx.compose.material.Icon
|
||||
import androidx.compose.material.Scaffold
|
||||
import androidx.compose.runtime.Composable
|
||||
import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.graphics.Color
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
import androidx.compose.ui.unit.dp
|
||||
import androidx.navigation.compose.currentBackStackEntryAsState
|
||||
import androidx.navigation.compose.rememberNavController
|
||||
|
||||
@SuppressLint("UnusedMaterialScaffoldPaddingParameter")
|
||||
@Composable
|
||||
fun Navigate(){
|
||||
val navController = rememberNavController()
|
||||
val listItem = listOf(
|
||||
NavItem.Home,
|
||||
NavItem.Like,
|
||||
NavItem.Order,
|
||||
NavItem.Profile,
|
||||
)
|
||||
|
||||
Scaffold(bottomBar = {
|
||||
BottomNavigation(
|
||||
backgroundColor = Color.White
|
||||
) {
|
||||
val navBackStackEntry = navController.currentBackStackEntryAsState()
|
||||
val currentState = navBackStackEntry.value
|
||||
|
||||
listItem.forEach { it ->
|
||||
val isSelected = currentState?.destination?.route == it.route
|
||||
|
||||
BottomNavigationItem(
|
||||
selected = isSelected,
|
||||
onClick = {
|
||||
if(!isSelected){
|
||||
navController.graph.startDestinationRoute?.let {
|
||||
navController.popBackStack(it, inclusive = true)
|
||||
}
|
||||
navController.navigate(it.route){
|
||||
launchSingleTop
|
||||
}
|
||||
}
|
||||
navController.navigate(it.route)
|
||||
|
||||
},
|
||||
icon = {
|
||||
val iconModifier = if (isSelected) {
|
||||
Modifier
|
||||
.background(color = Color.LightGray, shape = CircleShape)
|
||||
.padding(8.dp)
|
||||
} else {
|
||||
Modifier
|
||||
}
|
||||
|
||||
Icon(
|
||||
imageVector = it.icon,
|
||||
contentDescription = null,
|
||||
modifier = iconModifier.then(Modifier.size(24.dp))
|
||||
)
|
||||
}
|
||||
)
|
||||
}
|
||||
}
|
||||
}) {
|
||||
NavController(navController = navController)
|
||||
}
|
||||
}
|
||||
|
||||
@Composable
|
||||
@Preview
|
||||
fun NavigatePreview(){
|
||||
Navigate()
|
||||
}
|
@ -0,0 +1,37 @@
|
||||
package com.example.android_programming.Screens
|
||||
|
||||
import androidx.compose.foundation.background
|
||||
import androidx.compose.foundation.layout.Box
|
||||
import androidx.compose.foundation.layout.fillMaxSize
|
||||
import androidx.compose.material.MaterialTheme
|
||||
import androidx.compose.material.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.text.font.FontWeight
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
|
||||
@Composable
|
||||
fun HomeScreen() {
|
||||
Box(
|
||||
modifier = Modifier
|
||||
.fillMaxSize()
|
||||
.background(Color.White),
|
||||
contentAlignment = Alignment.Center
|
||||
) {
|
||||
Text(
|
||||
text = "Home",
|
||||
fontSize = MaterialTheme.typography.h3.fontSize,
|
||||
fontWeight = FontWeight.Bold,
|
||||
color = Color.Black
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@Composable
|
||||
@Preview
|
||||
fun HomeScreenPreview(){
|
||||
HomeScreen()
|
||||
}
|
@ -0,0 +1,36 @@
|
||||
package com.example.android_programming.Screens;
|
||||
|
||||
import androidx.compose.foundation.background
|
||||
import androidx.compose.foundation.layout.Box
|
||||
import androidx.compose.foundation.layout.fillMaxSize
|
||||
import androidx.compose.material.MaterialTheme
|
||||
import androidx.compose.material.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.text.font.FontWeight
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
|
||||
@Composable
|
||||
fun LikeScreen() {
|
||||
Box(
|
||||
modifier = Modifier
|
||||
.fillMaxSize()
|
||||
.background(Color.White),
|
||||
contentAlignment = Alignment.Center
|
||||
) {
|
||||
Text(
|
||||
text = "Like",
|
||||
fontSize = MaterialTheme.typography.h3.fontSize,
|
||||
fontWeight = FontWeight.Bold,
|
||||
color = Color.Black
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
@Composable
|
||||
@Preview
|
||||
fun LikeScreenPreview(){
|
||||
LikeScreen()
|
||||
}
|
@ -0,0 +1,36 @@
|
||||
package com.example.android_programming.Screens
|
||||
|
||||
import androidx.compose.foundation.background
|
||||
import androidx.compose.foundation.layout.Box
|
||||
import androidx.compose.foundation.layout.fillMaxSize
|
||||
import androidx.compose.material.MaterialTheme
|
||||
import androidx.compose.material.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.text.font.FontWeight
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
|
||||
@Composable
|
||||
fun OrderScreen() {
|
||||
Box(
|
||||
modifier = Modifier
|
||||
.fillMaxSize()
|
||||
.background(Color.White),
|
||||
contentAlignment = Alignment.Center
|
||||
) {
|
||||
Text(
|
||||
text = "Order",
|
||||
fontSize = MaterialTheme.typography.h3.fontSize,
|
||||
fontWeight = FontWeight.Bold,
|
||||
color = Color.Black
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
@Composable
|
||||
@Preview
|
||||
fun OrderScreenPreview(){
|
||||
OrderScreen()
|
||||
}
|
@ -0,0 +1,36 @@
|
||||
package com.example.android_programming.Screens;
|
||||
|
||||
import androidx.compose.foundation.background
|
||||
import androidx.compose.foundation.layout.Box
|
||||
import androidx.compose.foundation.layout.fillMaxSize
|
||||
import androidx.compose.material.MaterialTheme
|
||||
import androidx.compose.material.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.text.font.FontWeight
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
|
||||
@Composable
|
||||
fun ProfileScreen() {
|
||||
Box(
|
||||
modifier = Modifier
|
||||
.fillMaxSize()
|
||||
.background(Color.White),
|
||||
contentAlignment = Alignment.Center
|
||||
) {
|
||||
Text(
|
||||
text = "Profile",
|
||||
fontSize = MaterialTheme.typography.h3.fontSize,
|
||||
fontWeight = FontWeight.Bold,
|
||||
color = Color.Black
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
@Composable
|
||||
@Preview
|
||||
fun ProfileScreenPreview(){
|
||||
ProfileScreen()
|
||||
}
|
@ -1,13 +1,9 @@
|
||||
/*
|
||||
package com.example.android_programming.ui.theme
|
||||
|
||||
import android.app.Activity
|
||||
import android.os.Build
|
||||
import androidx.compose.foundation.isSystemInDarkTheme
|
||||
import androidx.compose.material3.MaterialTheme
|
||||
import androidx.compose.material3.darkColorScheme
|
||||
import androidx.compose.material3.dynamicDarkColorScheme
|
||||
import androidx.compose.material3.dynamicLightColorScheme
|
||||
import androidx.compose.material3.lightColorScheme
|
||||
import androidx.compose.runtime.Composable
|
||||
import androidx.compose.runtime.SideEffect
|
||||
import androidx.compose.ui.graphics.toArgb
|
||||
@ -26,7 +22,8 @@ private val LightColorScheme = lightColorScheme(
|
||||
secondary = PurpleGrey40,
|
||||
tertiary = Pink40
|
||||
|
||||
/* Other default colors to override
|
||||
*/
|
||||
/* Other default colors to override
|
||||
background = Color(0xFFFFFBFE),
|
||||
surface = Color(0xFFFFFBFE),
|
||||
onPrimary = Color.White,
|
||||
@ -34,7 +31,8 @@ private val LightColorScheme = lightColorScheme(
|
||||
onTertiary = Color.White,
|
||||
onBackground = Color(0xFF1C1B1F),
|
||||
onSurface = Color(0xFF1C1B1F),
|
||||
*/
|
||||
*//*
|
||||
|
||||
)
|
||||
|
||||
@Composable
|
||||
@ -67,4 +65,4 @@ fun AndroidProgrammingTheme(
|
||||
typography = Typography,
|
||||
content = content
|
||||
)
|
||||
}
|
||||
}*/
|
||||
|
@ -1,6 +1,7 @@
|
||||
/*
|
||||
package com.example.android_programming.ui.theme
|
||||
|
||||
import androidx.compose.material3.Typography
|
||||
import androidx.compose.material.Typography
|
||||
import androidx.compose.ui.text.TextStyle
|
||||
import androidx.compose.ui.text.font.FontFamily
|
||||
import androidx.compose.ui.text.font.FontWeight
|
||||
@ -15,7 +16,8 @@ val Typography = Typography(
|
||||
lineHeight = 24.sp,
|
||||
letterSpacing = 0.5.sp
|
||||
)
|
||||
/* Other default text styles to override
|
||||
*/
|
||||
/* Other default text styles to override
|
||||
titleLarge = TextStyle(
|
||||
fontFamily = FontFamily.Default,
|
||||
fontWeight = FontWeight.Normal,
|
||||
@ -30,5 +32,6 @@ val Typography = Typography(
|
||||
lineHeight = 16.sp,
|
||||
letterSpacing = 0.5.sp
|
||||
)
|
||||
*/
|
||||
)
|
||||
*//*
|
||||
|
||||
)*/
|
||||
|
Loading…
Reference in New Issue
Block a user