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
Related
Please, help me to understand how to do it right.
I have an app, which represent a screen with bottom bar with 4 tabs (1st layer). From this tabs we can enter other screens (2nd layer) without bottom bar. This organized very simple, Scaffold with bottom bar and navigation host inside it. To open screens above 1st layer without navigation bar I searched and found that I can just hide bottom bar and then open the screen above.
This is good, but on slow devices an ugly animation happen when 1)bottom bar is going down (user see the old screen without bottom bar) and 2) new screen appears.
This is not pleasant, but.. ok.
The second thing that I cannot stand is when in a 1-st layer screen I have a ModalBottomSheetLayout. When it hidden - it hides right behind bottom navigation bar and when I am going to new screen bottom navigation animated down and... here you are - the ModalBottomSheetLayout, and only then the second screen come to the place.
I wonder, may be I understand everything wrong and the new screens shouldn't be organized like this? How to set up navigation and scene like before compose we have a main fragment with bottom nav bar and open fragments on the top?
The example of the code I am talking about can be found for example in app nowinandroid, I think this is very common case.. As I see they also just hide bottom bar when needed..
#Composable fun NiaApp...
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.
I need to move the android Navigation Bar from the bottom of the display to the right side of the display.
The android app I'm working on requires the user to touch the bottom of the screen often, so I'd like to move the navigation bar to the right side of the screen. I believe this is possible, as I've seen it done in several games. The attached image shows what I'd like to achieve; when the user swipes from the bottom or top, the android bars appear at the top and RIGHT side, as opposed to the top and BOTTOM.
I've read through a lot of existing similar posts, and have tried the suggested answers, however they seem to instruct how to move a navigation DRAWER (ie a new "bar" implemented by the app) to the right side, as opposed to the BAR itself; I believe these are two different things.
Further, the information on android developer (https://developer.android.com/training/system-ui/immersive) suggests that the bar cannot be moved, it can only be temporarily hidden. If that's the case though, how are the app's such as the one in the image doing it? Any suggestions?
I try to make an app using one activity multiple fragments pattern. I handle navigation with Navigation architecture component using a bottom navigation view. In one of the fragment I have a Recyclerview which displays a list of custom cards. On item click it navigates to another fragment where I need to hide the bottom navigation view.
The problem appears when I navigate back and set the bottom navigation view visible again. The bar seems to appear in two steps giving the feeling of lag. (first time appears just 60% of the bottom navigation view).
The behavior seems to be related with the status bar. When I change the theme to full screen or I set windowTranslucentStatus=true, everything behaves okay. In addition, first time the nav bar seems to be with exactly 24dp smaller, that is the dimension of status bar.
Have you any idea what can I do?
PS. I'm new on stackoverflow and this is my first question. I'm glad to join this wonderful community.
Delay is one way to go, but I wouldn't suggest that.
I am assuming that the your navigation view is rendered before the entire activity is rendered, which is causing it to be rendered again after the UI is rendered. Why don't you try setting the visibility after the UI is rendered, like here
Is it possible to hide navigation bar on e.g. tablets in activity, so it does not appear when user is clicking on the screen?
I want it to appear only when user is swiping from bottom to middle of the screen, just like in e.g. Real Racing 3.
When I use:
myView.setSystemUiVisibility(View.SYSTEM_UI_FLAG_HIDE_NAVIGATION);
Unfortunetly navigation bar is hidden, but when user is clicking, it appears again. I want it to work only with this swipe gesture. How it can be achieved?
This is a platform behavior. Apps do not have the sort of control of the navigation bar that you are looking for, and for good reason. All it takes is one app not implementing a way to show the nav bar and the user is stuck. You will have to design your app with the platform's behavior in mind.