I'm new to Android Navigation Component and want to understand how can I use it in my relatively simple scenario where I want to have a single activity approach. I obviously want the system to handle the back stack, also for bottom navigation.
What I need is 2 very simple cases:
1. Mixed destinations
Some of the destinations in my navigation graph have bottom navigation, and some not. Imagine that I have a login flow without a bottom navigation and then move to the "real app" where I have bottom navigation. Google says put bottom navigation, drawer, action bar outside of navigation graph, which means they are shown for all destinations.
Is this supported by Navigation Component? Without dirty hacks of hiding/showing bottom nav.
2. Full screen popups
Another question - is multiple navhosts supported? Imagine I have a UI with bottom navigation and action bar, which are outside of the nav host area. But then I need to show a full screen popup, like a dialog or a resource selection screen, which will also go over the bottom nav and action bar.
Can I do this as a destination in navigation graph?
For both questions any conceptually supported solution is good for me, including switching graphs/hosts during navigation.
As per the Listen for navigation events documentation:
As an example, you might have common UI elements that you intend to show in some areas of your app while hiding them in others. Using your own OnDestinationChangedListener, you can selectively show or hide these UI elements based on the target destination
So yes, you can selectively show or hide elements of your activity's UI when you move to certain destinations, such as your login screen.
As per the Create a destination from a DialogFragment documentation:
If you have an existing DialogFragment, you can use the <dialog> element to add the dialog to your navigation graph
This also supports other types of DialogFragment such as a BottomSheetDialogFragment.
Related
So i have an app in compose that has startDestination set as a screen with scaffold with bottom nav bar having 3 items and top app bar, i am able to navigate through the 3 bottom navigation tabs. But suppose i want to click on a card in one of the bottom tab screen which should open a details screen without the bottom bar and app bar (Since Navhost is inside the scaffold, bottom and top bars show up on details screen too), what is the right way to do that? Currently i have tried the following ways:-
1. Starting the details screen in a new activity.
2. Using currentDestination route as state to conditionally hide bottom and app bar for details screen route.
Both work but, the problem with first approach is that, it isn't recommended to use multiple activity with jetpack navigation and rather we should stick to a single activity, it also further breaks the navigation if in case i want to move from details to another screen. The problem with second approach is that hiding and showing bottom/top bars create very bad transition between the screens and app doesn't feel smooth.
Hence, i am looking for an appropriate way to handle this as per the guidelines, although i couldn't find any info on this.
Update
I went with showing/hiding the bottom and app bar based on routes, turns out that bad and laggy animation i was facing was because i was running a debug app, with a release app with minifyEnabled true (R8) ,the transitions are very smooth and natural, as i wanted them.
Also it turns out, as per Google's official compose sample app JetSnack , this is the appropriate way of achieving navigation from a bottombar screen to a non-bottombar screen. Thanks to #vitidev for pointing it out in the comments.
You can use a nested Navigation Graph:
one principal graph according to your BottomBar
one nested graph inside each screen you want to go further
https://developer.android.com/jetpack/compose/navigation#nested-nav
I have a jetpack navigation graph setup with bottom navigation and an action bar. The bottom navigation has 3 tabs. 1 of these tabs has a detailed fragment that I would like to display the back-arrow on in the action bar.
In MainActivity onCreate(), I've added:
supportActionBar?.setDisplayHomeAsUpEnabled(true)
This displays the back button on every tab & fragment.
How can I prevent display of the back button unless the user is navigated to a non-top level fragment? Is there a method that detects when this particular navigation has occured? If so, I presume I can do something like supportActionBar?.setDisplayHomeAsUpEnabled(false)
Additionally, is there a way I can display a custom back arrow on the child pages? The default arrow does not fit the UI.
Happy to provide more detail if needed.
You could use a combination of setupWithNavController(BottomNavigationView,NavController) and setupActionBarWithNavController(AppCompatActivity,NavController,AppBarConfiguration) from NavigationUI. The first will bind the bottom navigation to the navigation controller, the second will set up the support action bar to regard the navigation.
With the AppBarConfiguration.getTopLevelDestinations() you will be able to configure when to display the back arrow. The default is to only regard the root of the navigation graph as a top level destination, but you can also use another builder to define a set of top level destinations.
I have a project with the following 4 layouts:
I have actually 1 activity holding a bottom app bar and the NavHostFragment where the fragments get injected. The Main Fragment is the home view. There is a Management and a Setting fragment, both are top-level views like the home view but doesn't depend on each other. These 3 fragments can be switched by clicking an item in the nav drawer. For simplification, I'm trying the new navigation architecture component.
Now I have some design questions:
Should I move the bottom app bar into the fragments, cause they don't depend on each other and the FAB button has another action, otherwise I had to change the onClickListener in the activity when the fragments switch?
1.1 Or should I even show the bottom app bar in the management fragment? Maybe just the top bar with the Up caret.
1.2 Or bottom app bar + top bar and Up caret
1.3 and what about the drawer icon, should I display it in the Mgmt fragment
Should I use a fragment or an activity for the Settings fragment? When I use a fragment, I have to move the bottom app bar into the fragments. Otherwise, the bottom app bar would be visible in the Settings Fragment
The Management Fragment has just a recycler view. Clicking on an item should open a DetailView. Should I use a fragment or an activity here?
I read the doc about the navigation architecture component and there is a section about customizing the destination. Also, ich checked the source code and know that the fragments get replaced.
Further, I checked out some frequently used Apps how they implemented the navigation with a nav drawer and noticed, they all replace their fragments. Why does no one hide/show the fragments, is there a reason not to doing this?
Assume we have a fragment with a listview that holds data collected from a database or another expensive task. So wouldn't it be better to show/ hide these fragments instead of replacing it?
Sorry, it's my first app and I'm really confused about this topic, and it seems there are no official recommendations about it out there not even Material Design guidelines don't really make a reference about it.
How would you do it?
setupWithNavController on a Toolbar (or subclasses like BottomAppBar) only set up the Up icon and the title - they do not hook up menu items added to the Toolbar.
As per the Tie destinations to menu items documentation, you must set up your own listener and call onNavDestinationSelected(). For a BottomAppBar, that would be done by setting a Toolbar.OnMenuItemClickListener:
val navController = Navigation.findNavController(this, R.id.navigation_fragment)
myBottomBar.replaceMenu(R.menu.menu_with_nav_item)
myBottomBar.setupWithNavController(navController)
// Connect MenuItems to the NavController
myBottomBar.setOnMenuItemClickListener { menuItem ->
menuItem.onNavDestinationSelected(navController)
}
I have a problem...I am developing an app in android studio.In the meantime,there is already a navigation drawer in it.But the problem is, it only appears in the home screen.When it goes to another screen, the navigation drawer is not shown. I am new to android studio but i know some of Java languages.Can anyone help me with providing anything that would help me make the navigation drawer show in all of slides and pages in my app.
from docs
Navigation Drawer
The navigation drawer is a panel that displays the app’s main
navigation options on the left edge of the screen. It is hidden most
of the time, but is revealed when the user swipes a finger from the
left edge of the screen or, while at the top level of the app, the
user touches the app icon in the action bar.
for achieve what you asked you have to use Fragments
Fragment represents a behavior or a portion of user interface in an
Activity. You can combine multiple fragments in a single activity to
build a multi-pane UI and reuse a fragment in multiple activities. You
can think of a fragment as a modular section of an activity, which has
its own lifecycle, receives its own input events, and which you can
add or remove while the activity is running (sort of like a "sub
activity" that you can reuse in different activities).
see this examples for more details
1. Navigation Drawer - android hive
2. Navigation Drawer exp 2
3. Navigation Drawer exp 3
Refer this answer also
Answer
You have to add fragments in that activity where the navigation drawer exist. Whenver the user will click on the option in the navigation drawer the view should be changed by replacing with the required fragment.So by using the fragments user will stay on the same activity but just the views will be changed in that activity. you can refer to the fragments documentation provided by android developers. https://developer.android.com/guide/components/fragments.html
I have an activity that extends fragmentActivity that has a navigation Drawer, and three different fragments.
Is there a way to make a navigation Drawer that has different buttons inside each of my fragments?
For example when you enter fragment 1 you will see certain buttons in the navigation Drawer, and when you go to fragment 2 you will see different buttons in the navigation Drawer.
You should just define which options are to be displayed in the NavigationDrawer depending on which current Fragment you're on, using a switch statement or if statement.
Check out this link:
How to change fragments using Android navigation drawer
Also, from this link https://developer.android.com/reference/android/support/v4/widget/DrawerLayout.html
As per the Android Design guide, any drawers positioned to the
left/start should always contain content for navigating around the
application, whereas any drawers positioned to the right/end should
always contain actions to take on the current content. This preserves
the same navigation left, actions right structure present in the
Action Bar and elsewhere.
So this type of thing seems like it was planned for when the NavigationDrawer was designed.