I've been trying to write code which will allow me to swipe back and forth between 3 DialogFragment views which overlay the main Activity.
To be more specific, each view should be swipeable from left to right and vice versa across the entire UI, in much the same way as fragments are in a ViewPager (with limits set at the bounds like so | 1 <--> 2 <--> 3 |) . Like fragments in ViewPager, each DialogFragment should come to rest in a natural position at the centre of the screen after swiping, and the transition animation should be similar.
Ideally, the layout and functionality would be similar to the respective defaults of a DialogFragment overlaying an activity.
Initially, I attempted this with a ViewPager but ran into trouble as the fragments didn't display with the intended layout. The main problem I had here was that the ViewPager stretched the layout of the DialogFragment across the entire UI. Furthermore, the only option I found for resizing the layout of the fragment was to limit the boundaries of the ViewPager, but of course this meant that the transitions occurred in an area smaller than the UI rather than across the entire UI. Mike's provided a brief explanation why this happens in the comments below.
I've also attempted a different approach of creating a child DialogFragment within blank ViewPager fragments. However, so far I've been unsuccessful as the ViewPager functionalilty isn't operational while the child DialogFragment is visible.
In the case of a 'work around' solution things that I want to mimic from the DialogFragment view include:
The shadowed / darkened background outside of the DialogFragment view.
The ability to tap outside of DialogFragment view to close the DialogFragment view (and by extension the ViewPager) and return to the main activity.
Related
I'm trying to add a slidingUpPanel(Sliding up panel) across all activities. This panel consists of a viewpager which in turn consists of two fragments. One of these fragments has a recyclerView (more than 1000 items) and the other fragment has some data that changes dynamically depending on the users' choice. This panel is very similar to that of google play music and soundcloud. Now to display this panel I tested two approaches:
1) I created a base activity and added the sliding up panel to it and then extended rest of the activities to base activity. So this way I have to create only one panel and viewpager.
2) I included the sliding up panel in all activities. But this approach is quite unmanageable as I have create viewpagers for all activities and if data changes in one activity I have to write the code to reflect that change across all activities.
Now the problem with both the methods is that each time I open a new activity, a new instance of the viewpager and fragments is created. So, suppose if I have 1000+ items in the recyclerview fragment, switching activities takes more than 2-3 seconds, because each time new instance of fragment is created and the data is loaded all again. This will definitely result in bad user experience.
Is there any way by which the viewpager and the fragments are created only once(when the app starts) and are destroyed only when user closes the app? And data should not load each time user switches activities. I just want to reduce the activity switching time. Any ideas?
Thank you.
Well, for such ui elements as your sliding panel, which stays the same for many items it is preferable to have a single activity.
So if you have 1 activity, you can have a viewpager inside sliding panel, and that part stays untouched. Next, inside your activity you can have FrameLayout wich can be used to host fragments. Doing this you can achieve single instance of sliding panel and navigation between content with fragments.
Having some heavy data collections makes you wishing minimum recreation of that items.
Two approaches for this are (assuming you're using SlidingUpPanelLayout by sothree)
With bottom navigation view
Easy way to do it is creating a bottom navigation view and keeping it in MainActivity and attaching the sliding up panel layout to the bottom navigation view ( layout_above = bottomnavbar_id ) since bottom navigation stays throughout the app so sliding up panel will also have to stay with it
Without bottom navigation view
Create a frame layout inside MainActivity give attributes width and height as match_parent and create slidinguppanelayout and give attributes gravity="bottom"
make the frame layout stay above that slidinguppanellayout , use that frame_layout to show content your want to show from fragments
that's all
My Activity has a viewpager along with a tablayout. There are three tabs. Now while swiping between the tabs, there is noticeable delay (around 300ms) while i try to very quickly swipe from, say, the first to third tab.
Now the viewpager contains three fragments. I am using a FragmentPagerAdapter to declare the viewpager tabs (as this gave a slight improvement compared to when i used FragmentStatePagerAdapter). Also I have set offScreenPageLimit for the viewpager to 2 (since there are 3 tabs).
Now to find out what was going wrong, I initialised empty fragments for the tabs and the swiping was fine and smooth as expected.
Next, I implemented the full functional code for the middle/2nd tab and left the other two as empty fragment.
Now this is where things get interesting, I was expecting a small delay while i swipe into the middle fragment(it contains nothing but a listview), when it creates it views and plugs the adapter into the listview with data. However, that was not the case. There was a noticeable delay while swiping out of the middle fragment!
Thus I have reason to believe, that while swiping out, where the fragment's view is being removed from screen, there is something I need to take care of which will make the transition smoother.
Sorry, that title is a bit confusing. I've included a wireframe of my screen below.
A - a FrameLayout which acts as the header in the Activity and houses a Fragment
B - a SlidingTabLayout for the FragmentPagerAdapter in C
C - a FragmentPagerAdapter that houses Fragments with RecyclerViews (grids) as their layout
What I want to accomplish:
As the user scrolls through the grid RecyclerView in C, I want header A to scroll up and be hidden (similar to Material Design Toolbars being hidden on scroll). I also want the tabs in B to be locked on the top of the screen once A is completely hidden but I think that part would just follow easily as a consequence of accomplishing the scroll/hide on A.
Ideally, I'd like it to be a smooth scroll that matches the distance of the user's scroll. But my backup plan is to just have a slide-up animation in the A fragment that's triggered by a certain scroll magnitude in the C fragment (the trigger would be sent up through C's fragment listener interface - the parent activity).
Is it possible to achieve interaction between fragments described in this image:
So, if one touches (or preferably swipes vertically) on fragment B, it shows (or is replaced by) fragment C and changes size to accommodate the larger fragment. Fragment C will contain a viewPager with additional fragments that are revealed on horizontal swipe (this part is done).
Fragment B will display the crucial contents of fragment C, which is why I want a separate fragment to do this. Fragment A takes user input and should always be interact-able.
I need help wrapping my head around how this should be implemented.
in my Activity, I have a layout containing 3 FrameLayouts, one at the top, one at the left and one at the "center".
Now, I sometimes only want to display one or two of them. Atm I am doing it this way:
FrameLayout frame = (FrameLayout) findViewById(R.id.framelayout_menu_left);
frame.setVisibility(...);
frame = (FrameLayout) findViewById(R.id.framelayout_content);
frame.setVisibility(...);
frame = (FrameLayout) findViewById(R.id.framelayout_menu_top);
frame.setVisibility(...);
However this can get really ugly results, e.g. when I switch the "content" Fragment and hide the top and/or left FrameLayout. It all starts flickering as the "content" Fragment jumps to the top and/or left and only afterwards is replaced.
Also, I can obviously not navigate back to another setup, so is there any other way to do this?
Kind regards,
jellyfish
Edit:
Maybe a little drawing makes my question clearer...
A shows a Layout of 3 FrameLayouts containing 3 different Fragments. Each color represents one distinct Fragment.
Now what I want to do is to switch from A to D.
I am doing this by replacing the blue Fragment with the yellow Fragment via a FragmentTransaction.
However, this still keeps the other Frames visible, so I hide them via the code above.
Now, Frame.setVisibility() is called way before commit(), so in B and C the blue Fragment "jumps" to the left and the top and only afterwards (in D) is replaced with the yellow Fragment. This produces a nasty flickering.
As a workaround, I now hide all three FrameLayouts before the transaction and re-show the ones I need once the transaction has finished. But there still is the problem that I can't go back via the back button as this isn't a real transaction.
I would have two suggestions. Firstly, if you both add a fragment transition effect and do the visibility changes after the transaction, that would probably substantially reduce much of your flicker effect
ft.setTransition(FragmentTransaction.TRANSIT_FRAGMENT_FADE);
Secondly, I've simply given up on having the system manage the fragment stack for me -- it seems that this only works well with simple transactions. Override onBackPressed and do your own logic there.
--randy