https://dailycoding365./entry/%EC%95%88%EB%93%9C%EB%A1%9C%EC%9D%B4%EB%93%9C-BottomNavigationView
(Android) BottomNavigationView
1. activity_main.xml에 BottomNavigationView 만들기 – app:menu=””: 여기에 메뉴 화면을 추가할 예정입니다.
2. menu 폴더의 작성 java 폴더 우클릭 -> New -> Android Resource Directory -> Resource type 에서 menu 를 선택 3. menu 폴
dailycoding365.
이번에는 전회 작성한, BottomNavigationView에 Navigation Component를 접속해 하부의 탭을 클릭하는 것만으로 화면이 바뀌게 될 것이다.
이때 Navigation Component라는 개념을 사용할 계획이다.
인기글
1. 종속성 추가
https://developer.android.com/guide/navigation/navigation-getting-started?hl=ko#groovy
네비게이션 구성 요소 시작하기 Android 개발자 | Android Developers
내비게이션 구성 요소 시작 컬렉션을 사용하여 정리하기 내 설정에 따라 콘텐츠를 저장하고 분류합니다.
이 주제에서는 탐색 구성요소를 설정하고 사용하는 방법에 대해 설명합니다.
네비게이션 구성 요소
developer.android.com
2-1. navigation 폴더 만들기
res 폴더 오른쪽 클릭 -> 신규 -> 안드로이드 리소스 디렉토리 -> 리소스 유형에서 내비게이션 선택
2-2. 화면에 사용되는 3개의 Fragment(HomeFragment, CategoryFragmet, SettingFragment)를 작성했다.
HomeFragment
package com.bottomnavigationview_practice.app
import android.os.Bundle
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import androidx.fragment.app.Fragment
class HomeFragment: Fragment() {
// Fragment 는 onCreateView 에서 layout 을 inflater 한다
override fun onCreateView(
inflater: LayoutInflater,
container: ViewGroup?,
savedInstanceState: Bundle?
): View? {
return inflater.inflate(R.layout.fragment_home, container, false)
}
}
fragment_home.xml
<?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:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="홈"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>나머지도 xml의 TextView 내용만이 다른 분상과 똑같이 만들었다.
2-3. navigation 폴더 내 main_navigation.xml 생성
그 이유는 메뉴의 ID를 클릭 할 때마다 지정된 Fragment로 이동할 수 있습니다.
다음은 마지막으로 작성되었습니다.
bottom_navigation_menu.xml입니다.
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="@+id/navigation_category"
android:icon="@drawable/ic_tabbar_category_off"
android:title="카테고리" />
<item
android:id="@+id/navigation_home"
android:icon="@drawable/ic_baseline_home"
android:title="홈" />
<item
android:id="@+id/navigation_setting"
android:icon="@drawable/ic_baseline_settings"
android:title="설정" />
</menu>
위의 사진을 보면 빨간색 부분처럼 No NavHostFragments이므로 NavHostFragments를 설정하십시오.
3. Navigation Grap을 activity_main.xml과 링크해야합니다.
activity_main.xml
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<androidx.fragment.app.FragmentContainerView
android:id="@+id/container_main"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="0dp"
android:layout_height="0dp"
app:defaultNavHost="true"
app:layout_constraintBottom_toTopOf="@+id/navigation_main"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:navGraph="@navigation/main_navigation"
tools:layout="@layout/fragment_home" />
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="@+id/navigation_main"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:menu="@menu/bottom_navigation_menu" />
</androidx.constraintlayout.widget.ConstraintLayout>
먼저 NavHostFragments를 설정하세요.
android:name="androidx.navigation.fragment.NavHostFragment"
둘째, NavHostFragments에서 Navigation Grap을 참조하도록 정의합니다 (여기에서는 main_navigation을 참조합니다).
app:navGraph="@navigation/main_navigation"
셋째, 사용자가 뒤로 버튼을 클릭하면 이전 화면으로 돌아가도록 처리합니다.
app:defaultNavHost="true"
4. MainActivity에서 설정하기
package com.bottomnavigationview_practice.app
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import androidx.navigation.fragment.findNavController
import androidx.navigation.ui.setupWithNavController
import com.google.android.material.bottomnavigation.BottomNavigationView
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
val bottomNavigationView = findViewById<BottomNavigationView>(R.id.navigation_main)
// NavHostFragment 에 내부컨트롤러에 대한 참조를 가져와야한다
// 먼저, NavHostFragment 에 대한 참조가 필요한다
// NavHostFragment 는 findNavController() 라는 메소드를 지원한다
// - findNavController() : NavHostFragment 가 소유하고 있는 내부컨트롤러에 대한 참조를 반환해준다
val navController = supportFragmentManager.findFragmentById(R.id.container_main)?.findNavController()
navController?.let {
bottomNavigationView.setupWithNavController(it)
// setupWithNavController : BottomNavigationView 와 FragmentContainerView의 NavHostFragment 를 연결하게 해준다
// - NavController : NavHostFragment 에서 데스트네이션의 이동을 관리하는 객체
// 즉, 화면이동을 관리하는 내부컨트롤러 객체를 바텀 내비게이션뷰에 할당할 수 있게 진원함으로서, 바텀내비게인션뷰의 아이템을 클릭했을 때, 화면이동이 이루어질 수 있도록 해줌
}
}
}