Design Setting

app/build.gradle.kts

@@ -52,4 +52,8 @@ dependencies {
     testImplementation(libs.junit)
     androidTestImplementation(libs.androidx.junit)
     androidTestImplementation(libs.androidx.espresso.core)
+
+    // NAVIGATION
+    implementation(libs.androidx.navigation.fragment)
+    implementation(libs.androidx.navigation.ui)
 }

app/src/main/AndroidManifest.xml

@@ -6,9 +6,9 @@
         android:allowBackup="true"
         android:dataExtractionRules="@xml/data_extraction_rules"
         android:fullBackupContent="@xml/backup_rules"
-        android:icon="@mipmap/ic_launcher"
+        android:icon="@mipmap/ic_logo"
         android:label="@string/app_name"
-        android:roundIcon="@mipmap/ic_launcher_round"
+        android:roundIcon="@mipmap/ic_logo"
         android:supportsRtl="true"
         android:theme="@style/Theme.Snow"
         tools:targetApi="31">

app/src/main/java/kr/hs/anu/snow/ui/home/fragment/HomeFragment.kt

@@ -0,0 +1,38 @@
+package kr.hs.anu.snow.ui.home.fragment
+
+import android.os.Bundle
+import android.view.LayoutInflater
+import android.view.View
+import android.view.ViewGroup
+import androidx.fragment.app.Fragment
+import kr.hs.anu.snow.databinding.FragmentHomeBinding
+
+class HomeFragment : Fragment() {
+
+    private var _binding: FragmentHomeBinding? = null
+    private val binding get() = _binding!!
+
+    override fun onCreate(savedInstanceState: Bundle?) {
+        super.onCreate(savedInstanceState)
+        arguments?.let {
+        }
+    }
+
+    override fun onCreateView(
+        inflater: LayoutInflater,
+        container: ViewGroup?,
+        savedInstanceState: Bundle?
+    ): View {
+        _binding = FragmentHomeBinding.inflate(inflater, container, false)
+        return binding.root
+    }
+
+    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
+        super.onViewCreated(view, savedInstanceState)
+    }
+
+    override fun onDestroyView() {
+        super.onDestroyView()
+        _binding = null
+    }
+}

app/src/main/java/kr/hs/anu/snow/ui/main/MainActivity.kt

@@ -5,11 +5,16 @@ import androidx.activity.enableEdgeToEdge
 import androidx.appcompat.app.AppCompatActivity
 import androidx.core.view.ViewCompat
 import androidx.core.view.WindowInsetsCompat
+import androidx.navigation.NavController
+import androidx.navigation.fragment.NavHostFragment
+import androidx.navigation.ui.NavigationUI
+import androidx.navigation.ui.setupWithNavController
 import kr.hs.anu.snow.R
 import kr.hs.anu.snow.databinding.ActivityMainBinding
 
 class MainActivity : AppCompatActivity() {
     private lateinit var binding: ActivityMainBinding
+    private lateinit var navController: NavController
 
     override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)
@@ -22,5 +27,21 @@ class MainActivity : AppCompatActivity() {
             v.setPadding(systemBars.left, systemBars.top, systemBars.right, systemBars.bottom)
             insets
         }
+
+        setNavigation()
+    }
+
+    private fun setNavigation() {
+        val navHostFragment =
+            supportFragmentManager.findFragmentById(R.id.fcv_main) as NavHostFragment
+        navController = navHostFragment.navController
+        binding.bnvMain.apply {
+            setupWithNavController(navController)
+            setOnItemSelectedListener { item ->
+                NavigationUI.onNavDestinationSelected(item, navController)
+                navController.popBackStack(item.itemId, inclusive = false)
+                true
+            }
+        }
     }
 }

app/src/main/res/drawable/ic_round_home.xml

@@ -0,0 +1,13 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="24"
+    android:viewportHeight="24">
+  <path
+      android:pathData="M20,19V10.5C20,10.345 19.964,10.192 19.894,10.053C19.825,9.914 19.724,9.793 19.6,9.7L12.6,4.45C12.427,4.32 12.216,4.25 12,4.25C11.784,4.25 11.573,4.32 11.4,4.45L4.4,9.7C4.276,9.793 4.175,9.914 4.106,10.053C4.036,10.192 4,10.345 4,10.5V19C4,19.265 4.105,19.52 4.293,19.707C4.48,19.895 4.735,20 5,20H9C9.265,20 9.52,19.895 9.707,19.707C9.895,19.52 10,19.265 10,19V16C10,15.735 10.105,15.48 10.293,15.293C10.48,15.105 10.735,15 11,15H13C13.265,15 13.52,15.105 13.707,15.293C13.895,15.48 14,15.735 14,16V19C14,19.265 14.105,19.52 14.293,19.707C14.48,19.895 14.735,20 15,20H19C19.265,20 19.52,19.895 19.707,19.707C19.895,19.52 20,19.265 20,19Z"
+      android:strokeLineJoin="round"
+      android:strokeWidth="2"
+      android:fillColor="#BEBEBE"
+      android:strokeColor="#BEBEBE"
+      android:strokeLineCap="round"/>
+</vector>

app/src/main/res/drawable/ic_round_note.xml

@@ -0,0 +1,9 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="24"
+    android:viewportHeight="24">
+  <path
+      android:pathData="M19,21H5C4.45,21 3.979,20.804 3.587,20.412C3.195,20.02 2.999,19.549 3,19V5C3,4.45 3.196,3.979 3.588,3.587C3.98,3.195 4.451,2.999 5,3H19C19.55,3 20.021,3.196 20.413,3.588C20.805,3.98 21.001,4.451 21,5V19C21,19.55 20.804,20.021 20.412,20.413C20.02,20.805 19.549,21.001 19,21ZM6,14H18V12H6V14ZM6,17H18V15.5H6V17Z"
+      android:fillColor="#BEBEBE"/>
+</vector>

app/src/main/res/drawable/ic_round_user.xml

@@ -0,0 +1,9 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="24"
+    android:viewportHeight="24">
+  <path
+      android:pathData="M12,4C13.061,4 14.078,4.421 14.828,5.172C15.579,5.922 16,6.939 16,8C16,9.061 15.579,10.078 14.828,10.828C14.078,11.579 13.061,12 12,12C10.939,12 9.922,11.579 9.172,10.828C8.421,10.078 8,9.061 8,8C8,6.939 8.421,5.922 9.172,5.172C9.922,4.421 10.939,4 12,4ZM12,14C16.42,14 20,15.79 20,18V20H4V18C4,15.79 7.58,14 12,14Z"
+      android:fillColor="#BEBEBE"/>
+</vector>

app/src/main/res/drawable/menu_selector_color.xml

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<selector xmlns:android="http://schemas.android.com/apk/res/android">
+    <item android:color="@color/main_pink" android:state_checked="true" />
+    <item android:color="@color/gray" android:state_checked="false" />
+</selector>

app/src/main/res/drawable/menu_text_color.xml

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<selector xmlns:android="http://schemas.android.com/apk/res/android">
+    <item android:color="@color/red" android:state_checked="true" />
+    <item android:color="@color/gray" android:state_checked="false" />
+</selector>

app/src/main/res/layout/activity_main.xml

@@ -7,13 +7,27 @@
     android:layout_height="match_parent"
     tools:context=".ui.main.MainActivity">
 
-    <TextView
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        android:text="Hello World!"
-        app:layout_constraintBottom_toBottomOf="parent"
+    <androidx.fragment.app.FragmentContainerView
+        android:id="@+id/fcv_main"
+        android:name="androidx.navigation.fragment.NavHostFragment"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        app:defaultNavHost="true"
+        app:layout_constraintBottom_toTopOf="@id/bnv_main"
         app:layout_constraintEnd_toEndOf="parent"
         app:layout_constraintStart_toStartOf="parent"
-        app:layout_constraintTop_toTopOf="parent" />
+        app:layout_constraintTop_toTopOf="parent"
+        app:navGraph="@navigation/nav_graph" />
 
+    <com.google.android.material.bottomnavigation.BottomNavigationView
+        android:id="@+id/bnv_main"
+        style="@style/BottomNavStyle"
+        android:layout_width="match_parent"
+        android:layout_height="?attr/actionBarSize"
+        android:background="@color/white"
+        app:itemIconTint="@drawable/menu_selector_color"
+        app:itemTextColor="@drawable/menu_text_color"
+        app:labelVisibilityMode="labeled"
+        app:layout_constraintBottom_toBottomOf="parent"
+        app:menu="@menu/nav_menu" />
 </androidx.constraintlayout.widget.ConstraintLayout>

app/src/main/res/layout/fragment_home.xml

@@ -0,0 +1,20 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent">
+
+    <TextView
+        android:id="@+id/tv_example"
+        android:layout_width="0dp"
+        android:layout_height="wrap_content"
+        android:layout_marginHorizontal="20dp"
+        android:padding="10dp"
+        android:text="homeFragment"
+        android:textAlignment="center"
+        app:layout_constraintBottom_toBottomOf="parent"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintTop_toTopOf="parent" />
+
+</androidx.constraintlayout.widget.ConstraintLayout>

app/src/main/res/menu/nav_menu.xml

@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="utf-8"?>
+<menu xmlns:android="http://schemas.android.com/apk/res/android">
+    <item
+        android:id="@+id/main_home"
+        android:icon="@drawable/ic_round_home"
+        android:title="@string/nav_home"/>
+
+    <item
+        android:id="@+id/main_news"
+        android:icon="@drawable/ic_round_note"
+        android:title="게시물"/>
+
+    <item
+        android:id="@+id/main_info"
+        android:icon="@drawable/ic_round_user"
+        android:title="마이"/>
+</menu>

app/src/main/res/mipmap-anydpi-v26/ic_launcher.xml

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
+    <background android:drawable="@color/ic_launcher_background"/>
+    <foreground android:drawable="@mipmap/ic_logo"/>
+</adaptive-icon>

app/src/main/res/mipmap-anydpi-v26/ic_launcher_round.xml

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
+    <background android:drawable="@color/ic_launcher_background"/>
+    <foreground android:drawable="@mipmap/ic_logo"/>
+</adaptive-icon>

app/src/main/res/navigation/nav_graph.xml

@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="utf-8"?>
+<navigation xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    android:id="@+id/nav_graph"
+    app:startDestination="@id/main_home">
+
+    <fragment
+        android:id="@+id/main_home"
+        android:name="kr.hs.anu.snow.ui.home.fragment.HomeFragment"
+        android:label="HomeFragment" />
+</navigation>

app/src/main/res/values/colors.xml

@@ -1,5 +1,9 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
-    <color name="black">#FF000000</color>
-    <color name="white">#FFFFFFFF</color>
+    <color name="main_pink">#FDD1D8</color>
+    <color name="red">#FF6362</color>
+    <color name="black">#2F2F2F</color>
+    <color name="gray">#BEBEBE</color>
+    <color name="gray_50">#F5F5F5</color>
+    <color name="white">#FFFFFF</color>
 </resources>

app/src/main/res/values/dimen.xml

@@ -0,0 +1,16 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources xmlns:tools="http://schemas.android.com/tools">
+    <dimen name="title">24dp</dimen>
+    <dimen name="body_1">20dp</dimen>
+    <dimen name="body_2">18dp</dimen>
+    <dimen name="body_3">16dp</dimen>
+    <dimen name="body_4">14dp</dimen>
+    <dimen name="body_5">12dp</dimen>
+    <dimen name="body_6">10dp</dimen>
+    <dimen name="radius_1">8dp</dimen>
+    <dimen name="radius_2">16dp</dimen>
+    <dimen name="radius_3">24dp</dimen>
+    <dimen name="radius_4">32dp</dimen>
+    <dimen name="design_bottom_navigation_text_size" tools:override="true">16sp</dimen>
+    <dimen name="design_bottom_navigation_height" tools:override="true">70dp</dimen>
+</resources>

app/src/main/res/values/ic_launcher_background.xml

@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+    <color name="ic_launcher_background">#FDD1D8</color>
+</resources>

app/src/main/res/values/strings.xml

@@ -1,3 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
 <resources>
     <string name="app_name">snow</string>
+    <string name="nav_home">홈</string>
 </resources>

app/src/main/res/values/styles.xml

@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+    <style name="NoIndicatorStyle" parent="">
+        <item name="android:background">@android:color/transparent</item>
+    </style>
+
+    <style name="BottomNavStyle" parent="Widget.MaterialComponents.BottomNavigationView">
+        <item name="itemPaddingTop">10dp</item>
+        <item name="itemPaddingBottom">0dp</item>
+        <item name="itemRippleColor">@android:color/transparent</item>
+        <item name="itemActiveIndicatorStyle">@style/NoIndicatorStyle</item>
+    </style>
+</resources>

gradle/libs.versions.toml

@@ -9,9 +9,12 @@ appcompat = "1.7.0"
 material = "1.12.0"
 activity = "1.10.1"
 constraintlayout = "2.2.1"
+navigationFragment = "2.9.0"
 
 [libraries]
 androidx-core-ktx = { group = "androidx.core", name = "core-ktx", version.ref = "coreKtx" }
+androidx-navigation-fragment = { module = "androidx.navigation:navigation-fragment", version.ref = "navigationFragment" }
+androidx-navigation-ui = { module = "androidx.navigation:navigation-ui", version.ref = "navigationFragment" }
 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" }