So, I'm working on a media player application.
I would like to make something similar to Google Play Music's or SoundCloud's slide up mini-player to full-player UX.
I'm not really sure how to tackle that, though. Is it simply two fragments/views? I can understand how to transition onClick with animations, but how would I go about the fluid dragging?
Yes, it can be done with a fragment, OnTouchListener, and dragging the fragment up. I've done it with a click event and animation with no dragging.
The activity is on the bottom and the container with the fragment placed on top via the xml.
I wouldn't call it expanding though. Its just not fully revealed on screen (i.e. the location is on and off the screen and the fragment isn't actually changing).
Related
In Android (22+), I'm looking for a library or a 'tried & tested approach' to give the setup that allows an app to overlay 1 fragment on top of another that and would also provide gesture drag in/out along with peeking behind(see animation below)?
Criteria;
library to animate the swipe-in/out
handles the darkening the background fragment the further you drag in
the overlay fragment is there to provide context information to the user)
Further to #Rainmakers suggestions, I have a 'nearly working' approach were that I have an overlay fragment that is added to the top of the fragment stack; were then I have applied a touch gesture on the overlay fragment to dismiss on a left->right swipe capture. This Works and looks ok and 'will do' but would like the peek behind the feature that is shown in the animated GIF.
This animation was taken from the google drive android app;
If you're eager to use a library then check this out FragmentTransactionExtended. It has different slides.
Then you just override the onTouchEvent() method (check how to do it link) and do fragment transactions when swipe is caught. If you use add in the transaction you won't dispose the fragment underneath.
And the part with darkening you should also manage it in onTouchEvent(). See this to make your fragment grey out.
This may sound stupid, but can I do that? I have searched a little, and this says "Re-attach a fragment ... causes its view hierarchy to be re-created, attached to the UI, and displayed.", probably meaning that the UI of the fragment is recreated losing states and other things.
The reason why I am trying to do is that I would like to achieve something like the Bottom Sheet of Google Maps. The only title part is showed at the bottom, but we can swipe it up and it becomes a Bottom Sheet. I think when only the title part is showing, it is not actually a Bottom Sheet, as it would be difficult to make exactly that part of a Bottom Sheet to be shown. I think Google Maps has put the title part separately, and is replacing it with a Bottom Sheet whose top part looks just like the title part, when swiping up begins.
So, to achieve similar effect, I thought I would create a cluster of UI as a fragment, and when the user begins swiping up, I place a Bottom Sheet with the peek size is set exactly to the height of the fragment, and move the fragment into the top of the Bottom Sheet, so that it can be swiped up.
But I want to keep everything of the fragment without recreating anything, as if I take the fragment and just move into the fragment instantly. Is that possible, or should I save the states and restore them when the fragment's UI is recreated?
Yes. Consider fragment as View and play with ObjectAnimator or any animation class as per behaviour. (Slide-up animation will do the trick)
Note: Fragment will initialize first even you display 20% of portion over main layout. State will remain same This does answers your question i guess.
Here is similar example for your work around. Reference
I have the requirement for what is effectively two activities side by side, allowing the user to scroll from one to the other, and back. I've decided that ViewPager is probably the best way to handle this, but am open to suggestions.
When the activity loads, the left hand view is displayed. I want to indicate to the user that the other view exists, by just scrolling it a small amount to the left and back again (similar to the way it's now common to show that a sliding drawer menu exists).
I've tried a number of things but have yet failed to find a method where both the views scroll smoothly together. Another way of interpretting the requirement is saying I want to programmatically fake a user flicking the page briefly.
Try calling the method fakeDragBy(float)! According to the documentation you need to first call beginFakeDrag() to initiate it and then call endFakeDrag(). This will mantain the ViewPagers default snapping behavior, so once you've revealed the other screen is there you don't have to animate the transition back, simply call endFakeDrag and the ViewPager will correctly snap back to the last screen (As long as you haven't dragged it past the half-way mark).
I want to create an animation between two fragments on Android.
After clicking on the "menu" button, I want to scale[minimize] current fragment and move it to right corner of the second fragment like this:
Preview
And after click on this minimized fragment, I want to maximize it again with reversed animation.
Is it generally possible? How can I do this?
There are several libraries available for viewpager animations like
https://github.com/jfeinstein10/JazzyViewPager
https://github.com/ToxicBakery/ViewPagerTransforms
I have an activity that displays a camera screen, another one that displays a dynamic list of things, and I would like to slide between them.
The problem is that the ViewPager only allows me to slide between different layouts, without any activity-related effect.
Thanks for your help!
I think that using a ViewPager is what would be the easiest way. But if you don't want to, maybe you can try something like that :
Code something to detect the swipe gesture.
When the swipe gesture is detected, start the second activity whith a slide transition.
I've never done something like that. It's just a though.