CODEWITHSUNDEEP
android-viewpagerandroid
lukaleli
lukaleli

Reputation: 3627

How to apply vertical swipe navigation in the most approachable way?

I'm trying to implement vertical navigation in my app (full screen fragments that you can swipe up and down). Problem is that there's no possibility to set vertical direction for android ViewPager, so I've used Jake's Wharton DirectionalViewPager that actually works, but I cannot apply pageTransformer to it (it's just not implemented there and that feature implementation fix is too hard for me to do). DirectionalViewPager is no longer supported. So my question is: is a viewpager the best solution for solving that kind of UI problem or maybe I should use another approach which is easier and quite easy to apply? I'm total newbie in android programming (I came here from javascript development) and I need some advice on that. Perhaps someone had similar problem and solved it somehow? Thanks in advance!

Upvotes: 2

Views: 1321

Answers (2)

Reza Zavareh
Reza Zavareh

Reputation: 325

you can use viewPager2 that supported vertically view pager just set orientation

    `<androidx.viewpager2.widget.ViewPager2
           android:id="@+id/view_pager"
           android:layout_width="match_parent"
           android:layout_height="match_parent"
           app:layout_constraintEnd_toEndOf="parent"
           app:layout_constraintTop_toTopOf="parent"
           app:layout_constraintStart_toStartOf="parent"
           app:layout_constraintBottom_toBottomOf="parent"
           android:orientation="vertical"/>`

Upvotes: 0

GhostDerfel
GhostDerfel

Reputation: 1551

You can try something a lot different then that.

The first thing is to have all the component's you want to scroll in your layout. Something like:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <LinearLayout
        android:id="@+id/welcome_first_slide"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:visibility="gone" />

    <LinearLayout
        android:id="@+id/welcome_second_slide"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:visibility="gone" />

</RelativeLayout>

Then you will implement the method to manage the content on your activity:

private void setCurrentSliderItem(int position){
     LinearLayout currentView = null;
     switch (position) {
        case 0:
                mainSlideView = (LinearLayout) findViewById(R.id.welcome_first_slide);
                break;
            case 1:
            mainSlideView = (LinearLayout) findViewById(R.id.welcome_second_slide);
            break;
     }
     mainSlideView.bringToFront();
     Animation slide = new TranslateAnimation(Animation.RELATIVE_TO_PARENT, 1.0f,Animation.RELATIVE_TO_PARENT, 0.0f,Animation.RELATIVE_TO_PARENT, 0.0f,Animation.RELATIVE_TO_PARENT, 0.0f); 
     slide.setDuration(1000);   
     mainSlideView.startAnimation(slide);
}

And you will then controle the touch event, so the user can interact:

private float xWhenDown;

@Override
    public boolean onTouchEvent(MotionEvent event) {
        int action = MotionEventCompat.getActionMasked(event);
        switch (action) {
        case MotionEvent.ACTION_DOWN:
            xWhenDown = event.getX();
        case MotionEvent.ACTION_UP:
            if(event.getX()<xWhenDown){
                buildSlide(++currentPosition);
            }
        default:
            return super.onTouchEvent(event);
        }
    }

Upvotes: 1

Related Questions