I'm trying to combine NavigationDrawer with a Toolbar that has a refresh Menu option:
The problem I'm encountering is that I cannot make the Toolbar show the menu button.
My MainActivity only holds a Fragment. activity_main.xml:
<androidx.fragment.app.FragmentContainerView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/main_nav_container"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:defaultNavHost="true"
app:navGraph="#navigation/main" />
MainActivity.kt:
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
}
}
nav_main:
<navigation 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:id="#+id/nav_main"
app:startDestination="#id/drawerFragment"
>
<fragment
android:id="#+id/drawerFragment"
android:name="com.example.rocketman.drawer.DrawerFragment"
android:label="DrawerFragment"
tools:layout="#layout/fragment_drawer"
/>
</navigation>
Basically my MainActivity navigates directly into a DrawerFragment, which is here:
<androidx.drawerlayout.widget.DrawerLayout
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:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="com.example.rocketman.drawer.DrawerFragment">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="com.example.rocketman.drawer.DrawerFragment">
<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<com.google.android.material.appbar.MaterialToolbar
android:id="#+id/toolbar_home"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/midnight_blue"
app:titleTextColor="#color/white"/>
</com.google.android.material.appbar.AppBarLayout>
<androidx.fragment.app.FragmentContainerView
android:id="#+id/drawer_container"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"/>
</LinearLayout>
<com.google.android.material.navigation.NavigationView
android:id="#+id/drawer_nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:fitsSystemWindows="true"
app:headerLayout="#layout/drawer_header"
app:menu="#menu/drawer" />
</androidx.drawerlayout.widget.DrawerLayout>
And finally, my DrawerFragment:
private const val KEY_SELECTED_DRAWER_ITEM = "DRAWER_SELECTED_ITEM_ID_KEY"
class DrawerFragment: Fragment() {
private lateinit var binding: FragmentDrawerBinding
private var drawerSelectedItemId = R.id.nav_home
override fun onCreateView(
inflater: LayoutInflater,
container: ViewGroup?,
savedInstanceState: Bundle?
): View {
binding = FragmentDrawerBinding.inflate(inflater)
(requireActivity() as AppCompatActivity).setSupportActionBar(toolbar_home)
return binding.root
}
override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
super.onViewCreated(view, savedInstanceState)
savedInstanceState?.let {
drawerSelectedItemId = it.getInt(KEY_SELECTED_DRAWER_ITEM, drawerSelectedItemId)
}
setupDrawer()
setBackPressedHandler()
}
private fun setBackPressedHandler() {
requireActivity().onBackPressedDispatcher.addCallback(viewLifecycleOwner) {
if (binding.drawerLayout.isOpen) {
binding.drawerLayout.close()
} else {
findNavController().popBackStack()
}
}
}
override fun onSaveInstanceState(outState: Bundle) {
outState.putInt(KEY_SELECTED_DRAWER_ITEM, drawerSelectedItemId)
super.onSaveInstanceState(outState)
}
private fun setupDrawer() {
val controller = binding.drawerNavView.setupWithNavController(
childFragmentManager,
findNavController(),
listOf(
//all the items on the Drawer have their own navigation graph
R.navigation.home,
R.navigation.rocket,
R.navigation.company
),
R.id.drawer_container,
drawerSelectedItemId,
requireActivity().intent
)
controller.observe(
viewLifecycleOwner,
{ navController ->
NavigationUI.setupWithNavController(
binding.toolbarHome,
navController,
binding.drawerLayout
)
drawerSelectedItemId = navController.graph.id
}
)
}
}
In other words, the Drawer has three items: home, rocket and company as can be seen here, menu/drawer:
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="#+id/nav_home"
android:checked="true"
android:checkable="true"
android:icon="#drawable/ic_home"
android:title="#string/nav_menu_home"
/>
<item
android:id="#+id/nav_rocket"
android:checkable="true"
android:icon="#drawable/ic_rocket"
android:title="#string/nav_menu_rocket_list"
/>
<item
android:id="#+id/nav_company"
android:checkable="true"
android:icon="#drawable/ic_company"
android:title="#string/nav_menu_company_data"
/>
</menu>
Each of home, rocket and company have their own navigation graph, for example navigation/company looks like this:
<navigation 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:id="#+id/nav_company"
app:startDestination="#id/companyDataFragment">
<fragment
android:id="#+id/companyDataFragment"
android:name="com.example.rocketman.company.CompanyFragment"
android:label="#string/nav_menu_company_data"
tools:layout="#layout/fragment_company_data"
/>
</navigation>
And the CompanyFragment is straight forward:
class CompanyFragment: Fragment() {
private lateinit var binding: FragmentCompanyDataBinding
private val vm by lazy {
ViewModelProvider(this).get(CompanyVM::class.java)
}
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setHasOptionsMenu(true)
Repo.init(requireContext())
}
override fun onCreateView(
inflater: LayoutInflater,
container: ViewGroup?,
savedInstanceState: Bundle?
): View {
binding = FragmentCompanyDataBinding.inflate(inflater)
return binding.root
}
override fun onCreateOptionsMenu(menu: Menu, inflater: MenuInflater) {
super.onCreateOptionsMenu(menu, inflater)
inflater.inflate(R.menu.company, menu)
}
override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
super.onViewCreated(view, savedInstanceState)
setupObservers()
}
private fun setupObservers() {
//observing
}
}
That part works.
However, I want to create a menu action for Company. So first I create a menu item menu/company:
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="#+id/update"
android:icon="#drawable/ic_baseline_refresh_24"
android:title="#string/menu_company_update"
app:showAsAction="ifRoom|withText"
/>
</menu>
Then in CompanyFragment I call override onCreate() { setHasOptionsMenu(true) } and override onCreateOptionsMenu() { inflater.inflate(R.menu.company, menu }.
This should create the options menu for the Toolbar. However, the Fragment only shows the drawer menu icon but not the options menu icon.
I can add a Toolbar to the content Fragment itself but then the app has two Toolbars, the one with the drawer and the one with option items:
How do I make the Toolbar have both the NavigationDrawer and option items?
Still many people continue to use ActionBar, we don't have to use it any more. And if I were you, I would not use ActionBar and setHasOptionsMenu(true) which is related to ActionBar, but just would use a Toolbar.
Just delete setHasOptionsMenu(true), onCreateOptionsMenu() and onOptionsItemSelected() (if you have it).
Instead, use Toolbar.inflateMenu() and Toolbar.setOnMenuItemClickListener() directly on your Toolbar.
From what I understand from your question, you want to display overflow menu along with drawer menu.
The showAsAction option in the menu xml file is what you can use to control how that single menu option will show up in the actionbar.
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="#+id/update"
android:icon="#drawable/ic_baseline_refresh_24"
android:title="#string/menu_company_update"
app:showAsAction="ifRoom|withText"
/>
</menu>
change this to
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="#+id/update"
android:icon="#drawable/ic_baseline_refresh_24"
android:title="#string/menu_company_update"
app:showAsAction="never"
/>
</menu>
This will show the menu item in the Overflow menu.
Related
I have implemented BottomNavigationView with NavController but fragments keep reloading on each click, even with the new navigation library update. I also tried setOnNavigationItemReselectedListener but it doesn't trigger anything. What am I doing wrong ?
I know this question have been asked more than once but I feel like I tried them all and none of them work. I was hoping I could avoid reverting my code with old libraries or using boilerplate solutions.
Here is my code :
build.gradle (:app)
implementation 'androidx.navigation:navigation-runtime-ktx:2.5.2'
implementation 'androidx.navigation:navigation-fragment-ktx:2.5.2'
implementation 'androidx.navigation:navigation-ui-ktx:2.5.2'
HomeActivity.kt
class HomeActivity : BaseActivity(), NavigationView.OnNavigationItemSelectedListener,
Serializable {
private lateinit var binding: ActivityHomeBinding
private lateinit var navController: NavController
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
binding= ActivityHomeBinding.inflate(layoutInflater)
setContentView(binding.root)
val navHostFragment = supportFragmentManager.findFragmentById(R.id.home_container) as NavHostFragment
navController = navHostFragment.navController
binding.bottomNavigation.setupWithNavController(navController)
}
}
activity_home.xml
<RelativeLayout 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"
android:fitsSystemWindows="true"
tools:openDrawer="start"
tools:context=".HomeActivity">
<androidx.fragment.app.FragmentContainerView
android:id="#+id/home_container"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="match_parent"
android:layout_height="0dp"
app:defaultNavHost="true"
app:layout_constraintBottom_toTopOf="#+id/bottom_navigation"
app:layout_constraintTop_toBottomOf="#+id/appbar_layout"
app:navGraph="#navigation/nav_main" />
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottom_navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:menu="#menu/bottom_navigation_menu"
app:layout_constraintTop_toBottomOf="#+id/home_container"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.5"/>
</RelativeLayout>
nav_main.xml
<navigation 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:id="#+id/nav_main"
app:startDestination="#id/firstFragment">
<fragment
android:id="#+id/firstFragment"
android:name="com.projectName.ui.main.ContactsFragment"
tools:layout="#layout/fragment_contacts" />
<fragment
android:id="#+id/secondFragment"
android:name="com.projectName.SearchFragment"
android:label="#string/search"
tools:layout="#layout/search_fragment" />
<fragment
android:id="#+id/thirdFragment"
android:name="com.projectName.ui.main.NotificationsFragment"
tools:layout="#layout/notifications_fragment" />
<fragment
android:id="#+id/fourthFragment"
android:name="com.projectName.chat.ChatFragment"
tools:layout="#layout/fragment_main_page" />
</navigation>
bottom_navigation_menu.xml
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="#+id/firstFragment"
android:enabled="true"
android:icon="#drawable/ic_baseline_contacts_24"
android:title=""
app:labelVisibilityMode="unlabeled"/>
<item
android:id="#+id/secondFragment"
android:enabled="true"
android:icon="#drawable/ic_search_white_24dp"
android:title=""
app:labelVisibilityMode="unlabeled"/>
<item
android:id="#+id/thirdFragment"
android:enabled="true"
android:icon="#drawable/ic_baseline_notifications_none_24"
android:title=""
app:labelVisibilityMode="unlabeled"/>
<item
android:id="#+id/fourthFragment"
android:enabled="true"
android:icon="#drawable/ic_message_white_24dp"
android:title=""
app:labelVisibilityMode="unlabeled"/>
</menu>
Fragments
class NotificationsFragment : Fragment() {
companion object {
fun newInstance() = NotificationsFragment()
}
private lateinit var viewModel: NotificationsViewModel
override fun onCreateView(
inflater: LayoutInflater, container: ViewGroup?,
savedInstanceState: Bundle?
): View {
viewModel = ViewModelProvider(this).get(NotificationsViewModel::class.java)
return inflater.inflate(R.layout.notifications_fragment, container, false)
}
override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
super.onViewCreated(view, savedInstanceState)
}
I also gave every layout an ID like the document of savedInstateState suggests.
Thank you.
EDIT
I could not find a solution for my problem so I used BottomNavigationView with ViewPager2 :
HomePagerAdapter.kt
private val TAB_TITLES = arrayOf(
Constants.CONTACTS,
Constants.SEARCH,
Constants.NOTIFICATIONS,
Constants.CHATS
)
class HomePagerAdapter(fa: FragmentActivity) : FragmentStateAdapter(fa) {
override fun getItemCount(): Int = TAB_TITLES.size
override fun createFragment(position: Int): Fragment {
return if (getPageTitle(position) == Constants.CONTACTS) {
ContactsFragment.newInstance()
} else if (getPageTitle(position) == Constants.SEARCH) {
SearchFragment.newInstance()
} else if (getPageTitle(position) == Constants.NOTIFICATIONS) {
NotificationsFragment.newInstance()
} else {
ChatsFragment.newInstance()
}
}
private fun getPageTitle(position: Int): String {
return TAB_TITLES[position]
}
}
HomeActivity.kt
class HomeActivity : BaseActivity(), NavigationView.OnNavigationItemSelectedListener,
Serializable, SearchFragment.OnPersonSelectedListener {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_home)
val homePagerAdapter = HomePagerAdapter(this)
val viewPager: ViewPager2 = findViewById(R.id.home_view_pager)
viewPager.adapter = homePagerAdapter
viewPager.isUserInputEnabled = false
viewPager.offscreenPageLimit = 1
viewPager.overScrollMode = ViewPager2.OVER_SCROLL_NEVER
findViewById<BottomNavigationView>(R.id.bottom_navigation)
.setOnItemSelectedListener {
when (it.itemId) {
R.id.firstFragment -> {
viewPager.setCurrentItem(0, false)
return#setOnItemSelectedListener true
}
R.id.secondFragment -> {
viewPager.setCurrentItem(1, false)
return#setOnItemSelectedListener true
}
R.id.thirdFragment -> {
viewPager.setCurrentItem(2, false)
return#setOnItemSelectedListener true
}
R.id.fourthFragment -> {
viewPager.setCurrentItem(3, false)
return#setOnItemSelectedListener true
}
else -> return#setOnItemSelectedListener false
}
}
}
}
activity_home.xml
<androidx.viewpager2.widget.ViewPager2
android:id="#+id/home_view_pager"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toTopOf="#+id/bottom_navigation"
app:layout_constraintTop_toBottomOf="#+id/appbar_layout"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottom_navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:menu="#menu/bottom_navigation_menu"
app:layout_constraintTop_toBottomOf="#+id/home_view_pager"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.5"/>
If I understood your problem right, you want that whenever you change from one fragment to another by using the bottom navigation bar that the fragments will perserve their state. I think this might be helpful https://developer.android.com/guide/navigation/multi-back-stacks. Every tab on the bottom navigation will have its own graph and while switching from one tab to another the state will be saved. Let me know if this helps you out!
I am trying to transition an app that I have previously made to use Navigation component with fragments instead of activities ( so I'm converting my activities to fragments so they work with the component and also because it's nicer this way) and I have a problem with the Toolbar always getting pulled down a little bit without any aparent reason. I tried changing the layout roots from LinearLayout to ConstraintLayout, back again, fidgeting with android:fitsSystemWindows both for the activity layout and for the fragment one as true or false, also with views layout_height but no luck so far...
The activity looks like this:
here are my files:
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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="false"
android:orientation="vertical">
<androidx.fragment.app.FragmentContainerView
android:id="#+id/myNavHostFragment"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:defaultNavHost="true"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:navGraph="#navigation/navigation" />
</androidx.constraintlayout.widget.ConstraintLayout>
MainActivity.kt
class MainActivity : AppCompatActivity() {
private val baseAppState by inject<BaseAppStateManager>()
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
val navHostFragment = supportFragmentManager.findFragmentById(R.id.myNavHostFragment) as NavHostFragment
val navController = navHostFragment.navController
NavigationUI.setupActionBarWithNavController(this, navController)
}
override fun onSupportNavigateUp(): Boolean {
val navController = findNavController(R.id.myNavHostFragment)
return navController.navigateUp()
}
}
fragment_devices.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="false"
android:orientation="vertical">
<include
android:id="#+id/dashboard_status"
layout="#layout/dashboard_phone_status"
android:layout_width="match_parent"
android:layout_height="160dp" />
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/devices_recyclerview"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
DevicesFragment.kt
class DevicesFragment : Fragment() {
...
override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, sis: Bundle?): View {
binding = FragmentDevicesBinding.inflate(inflater, container, false)
phoneStatusScreen = PhoneStatusScreenManager(binding.dashboardStatus)
return binding.root
}
override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
super.onViewCreated(view, savedInstanceState)
setHasOptionsMenu(true)
observeLiveData()
...viewmodel calls...
historyAdapter = DevicesHistoryAdapter(onDeviceClicked = ::onDeviceClicked)
setupRecyclerView(historyAdapter)
}
Sometimes the toolbar looks okay when I open the app but as soon as I navigate to another fragment by clicking on an element from the RecyclerView, when I click on the back arrow to navigate up, the toolbar is like you see in the screenshot below.
Also, here is the application theme:
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Theme customization. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
</style>
</resources>
I am using bottom navigation. I want to open a dialog window by selecting the option menu after switching to another fragment screen through the bottom menu.
But I don't see the option menu..
I wrote it by referring to other sample code, but I do not know the cause
WorkoutListFragment.kt
class WorkoutListFragment : Fragment() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setHasOptionsMenu(true)
}
override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?,
savedInstanceState: Bundle?): View? {
val view: View = inflater.inflate(R.layout.fragment_workout_list, container,false)
return view
}
override fun onCreateOptionsMenu(menu: Menu, inflater: MenuInflater) {
super.onCreateOptionsMenu(menu, inflater)
inflater.inflate(R.menu.record_item_add, menu)
}
override fun onOptionsItemSelected(item: MenuItem): Boolean {
val dialog = BodyPartDialogFragment()
dialog.show(activity!!.supportFragmentManager, "BodyPartDialog")
return true
}
}
ADDED
val toolbar: Toolbar = view.findViewById(R.id.toolbar)
(activity as AppCompatActivity).setSupportActionBar(toolbar)
WorkouListFragment.xml
<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=".fragment.WorkoutListFragment">
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:id="#+id/coordinator"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_constraintTop_toTopOf="parent">
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:elevation="0dp"
android:theme="#style/Theme.AppBarOverlay">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:title="LIST"
app:titleTextColor="#color/black"
app:titleMarginStart="30dp"
android:paddingRight="30dp"
android:theme="#style/Theme.PopupOverlay"/>
</com.google.android.material.appbar.AppBarLayout>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
Iv been stuck in trying to add the Navigation Component to my app. Specifically to my toolbar menu items.
I have been following the navigation migrate documentation on Android's site but I am getting a but confused on how it works or even to set it up.
This is a single-activity multi-fragment architecture.
The app would start in the MainFragment and then when tapping the menu items in the toolbar, such as Main Frag to Search Movie Frag. The user would be able to navigate using the menu items from anywhere in the app (e.g. if they click the home icon, they should be sent to the home screen form anywhere in the app. Still thinking if thats how it should be done).
The main thing is I don't know how to properly attach the Navigation Component to the menu items.
App
Nav Graph
nav_graph.xml
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/nav_graph"
app:startDestination="#id/mainFragment">
<fragment
android:id="#+id/mainFragment"
android:name="com.example.movieapp.ui.main.MainFragment"
android:label="MainFragment">
<action
android:id="#+id/action_mainFragment_to_searchMovieFragment"
app:destination="#id/searchMovieFragment" />
</fragment>
<fragment
android:id="#+id/searchMovieFragment"
android:name="com.example.movieapp.ui.search.SearchMovieFragment"
android:label="SearchMovieFragment" />
</navigation>
main_activity.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".activity.MainActivity">
<include
layout="#layout/appbar"
android:id="#+id/mainToolBar"/>
<androidx.fragment.app.FragmentContainerView
android:id="#+id/nav_host_fragment"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#id/mainToolBar"
app:layout_constraintBottom_toBottomOf="parent"
app:defaultNavHost="true"
app:navGraph="#navigation/nav_graph" />
</androidx.constraintlayout.widget.ConstraintLayout>
MainActivity.kt
class MainActivity : AppCompatActivity() {
private lateinit var toolbar: Toolbar
private val navController by lazy {
(supportFragmentManager.findFragmentById(R.id.nav_host_fragment) as NavHostFragment).navController
}
private lateinit var appBarConfiguration: AppBarConfiguration
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.main_activity)
toolbar = findViewById(R.id.mainToolBar)
setSupportActionBar(toolbar)
appBarConfiguration = AppBarConfiguration(navController.graph, null)
setupActionBarWithNavController(navController, appBarConfiguration)
}
override fun onCreateOptionsMenu(menu: Menu?): Boolean {
val inflater: MenuInflater = menuInflater
inflater.inflate(R.menu.main_menu_bar, menu)
return true
}
override fun onSupportNavigateUp(): Boolean {
return navController.navigateUp(appBarConfiguration) || super.onSupportNavigateUp()
}
}
MainFragment.kt
class MainFragment : Fragment() {
companion object {
fun newInstance() = MainFragment()
}
private lateinit var viewModel: MainViewModel
private lateinit var binding: MainFragmentBinding
private lateinit var navController: NavController
override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View {
binding = DataBindingUtil.inflate(inflater, R.layout.main_fragment, container, false)
setHasOptionsMenu(true)
return binding.root
}
override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
super.onViewCreated(view, savedInstanceState)
navController = Navigation.findNavController(view)
// navController.navigate(R.id.action_mainFragment_to_searchMovieFragment)
}
override fun onActivityCreated(savedInstanceState: Bundle?) {
super.onActivityCreated(savedInstanceState)
viewModel = ViewModelProvider(this).get(MainViewModel::class.java)
binding.viewModel = viewModel
// TODO: Use the ViewModel
}
}
main_fragment.xml
<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools">
<data>
<variable
name="viewModel"
type="com.example.movieapp.ui.main.MainViewModel" />
</data>
<LinearLayout
android:orientation="vertical"
android:id="#+id/main_fragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".ui.main.MainFragment">
<TextView
android:id="#+id/message"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="MainFragment1" />
</LinearLayout>
</layout>
The id for a menu item in your file main_menu_bar.xml needs to match the id for the destination(fragment) specified in your navigation graph (nav_graph.xml).
Your main_menu_bar.xml should look something like this:
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
tools:showIn="navigation_view">
<group android:checkableBehavior="single">
<item
android:id="#id/searchMovieFragment"
android:icon="#drawable/search"
android:title="#string/menu_search" />
<item
android:id="#id/mainFragment"
android:icon="#drawable/ic_menu_camera"
android:title="#string/menu_home" />
</group>
</menu>
Also, you need to override the onOptionsItemSelected(MenuItem) method and associate your menu items with destinations. Like so:
override fun onOptionsItemSelected(item: MenuItem): Boolean {
val navController = findNavController(R.id.nav_host_fragment)
return item.onNavDestinationSelected(navController) || super.onOptionsItemSelected(item)
}
Reference
You can add a Toolbar on top of the most basic FragmentContainerView, access this toolbar from other fragments, and change the toolbar I created separately according to the fragment in it while opening the relevant fragment as follows.
toolbar = requireActivity().findViewById(R.id.toolbar_base)
toolbar?.menu?.clear()
toolbar?.title = ""
val toolbarFlowFragment = context?.let { getInflateLayout(it, R.layout.toolbar_profile) }
toolbar?.addView(toolbarFlowFragment)
I am working on app that uses Navigation pattern.
Now I have an Activity and few fragments.
Each Fragment has a unique functionality so I created a separate toolbar for each fragment: collapsing, usual or no toolbar at all.
I used the following example: https://android.jlelse.eu/instagram-style-navigation-using-navigation-component-854037cf1389
It works pretty well, but now I am taking an issue if I want to set some menu items in the toolbar.
For example, I would like to add a settings menu to the toolbar of the Profile Fragment
I tried setting a menu item, but it simply never appears and I think the method doesn't get called at all..
Is it possible to solve this issue without changing the whole architecture logic?
override fun onCreateView(
inflater: LayoutInflater, container: ViewGroup?,
savedInstanceState: Bundle?
): View? {
binding = DataBindingUtil.inflate(inflater, R.layout.my_layout, container, false)
setHasOptionsMenu(true)
return binding.root
}
override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
super.onViewCreated(view, savedInstanceState)
binding.toolbar.apply {
setupWithNavController(findNavController())
}
}
override fun onCreateOptionsMenu(menu: Menu, inflater: MenuInflater) {
inflater.inflate(R.menu.main_menu, menu)
super.onCreateOptionsMenu(menu, inflater)
}
override fun onOptionsItemSelected(item: MenuItem): Boolean {
if(item.itemId == R.id.action_get_info)
Toast.makeText(context!!, "test message", Toast.LENGTH_SHORT).show()
return super.onOptionsItemSelected(item)
}
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="#+id/action_get_info"
android:icon="#drawable/ic_setting"
android:title="Settings"
app:showAsAction="always" />
</menu>
<layout 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"
tools:context="com.example.MyFragment">
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:layout_width="match_parent"
android:fitsSystemWindows="true"
android:layout_height="match_parent">
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/white">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
style="#style/ToolbarAppearance"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize">
</androidx.appcompat.widget.Toolbar>
</com.google.android.material.appbar.AppBarLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_test_image" />
</RelativeLayout>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
</layout>