1

I'm a newbie in Android development and I was curious about:

In many music player apps, there is a "now playing" view on the bottom of the screen, and when you swipe it up, a whole new "now playing" layout slides in from the bottom, while the previous layout remains in view until you slide the now playing screen all the way up so it covers the previous view.

Also, in almost every app using a navigation drawer, there is a view (the drawer) that comes in from the left when you swipe from left to right, while the previous screen remains in view (although it get's covered partially by the drawer), without any transitioning like when you switch fragments or activities.

Here are some GIFs to show what i mean:

Music player 1
Music player 2

So i want to recreate this behaviour in my app, I'd like to create for example a custom navigation drawer and also use this in other parts of the app.

I already did some research and found that for the movement, i should use ViewDragHelper (here), but if i understand it right, it only moves views that are already in view on screen.

What i want to know is when and how is the now playing Fragment created. Is it created when the activity is created and hides somewhere waiting for the user slide it on screen? Or is it created when the user starts the swipe? The same with the nav drawer. Where is it, when the user doesn't see it?

So far, I've tried to implement the nav drawer like this:

I have a RelativeLayout in the main layout representing the drawer

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_marginRight="100dp"
    android:background="@color/colorPrimary"
    android:id="@+id/mainactivity_drawer">
</RelativeLayout>

On the start of the activity, i hide it with a translate animation

RelativeLayout drawer;
Animation hideDrawer;

@Override
protected void onStart() {
    super.onStart();
    drawer.startAnimation(hideDrawer);
}

And on the click of the menu button, i translate it back to view

menuButton.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            drawer.startAnimation(showDrawer);
        }
    });

Drawer hide anim:

<set xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true">
<translate
    android:fromXDelta="0%"
    android:toXDelta="-100%"
    android:duration="400"
    android:interpolator="@android:interpolator/accelerate_decelerate"
    />
</set>

Drawer show anim:

<set xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true">
<translate
    android:fromXDelta="-100%"
    android:toXDelta="0%"
    android:duration="400"
    android:interpolator="@android:interpolator/accelerate_decelerate"
    />
</set>

This is how it looks
But i think this is not the right way of achieving this behaviour.

So, when, how, and where should i create the view?

Thanks in advance, sorry for the long question, but i couldn't explain it better.

PS: I know about the official implementations of the drawer, but I'm not asking about them here.

František Hlinka
  • 100
  • 7

0 Answers0