android viewflipper order of the items

Question

I have a viewflipper with three direct childs 1,2,3 in the XML . But they are being displayed as 1,3,2. I think there is something wrong with my fling code as mentioned below ViewFlipper order of items

But i cant get my head around the concept.

 <ViewFlipper
    android:id="@+id/view_flipper"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" >

    <LinearLayout
        android:id="@+id/ag"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical" >

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:layout_marginTop="10dp"
            android:text="@string/how_to_use_text"
            android:textAppearance="@android:style/TextAppearance.Medium"
            android:textColor="@color/grey_text" />

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="10dp"
            android:layout_marginLeft="10dp"
            android:layout_marginTop="10dp"
            android:text="@string/how_to_use_text1"
            android:textAppearance="@android:style/TextAppearance.Medium"
            android:textColor="@color/grey_text" />

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="15dp"
            android:adjustViewBounds="true"
            android:src="@drawable/tour_1" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/bg"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical" >

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="10dp"
            android:layout_marginLeft="10dp"
            android:layout_marginTop="45dp"
            android:text="@string/how_to_use_text2"
            android:textAppearance="@android:style/TextAppearance.Medium"
            android:textColor="@color/grey_text" />

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="15dp"
            android:adjustViewBounds="true"
            android:src="@drawable/tour_2" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/cg"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical" >

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="10dp"
            android:layout_marginLeft="10dp"
            android:layout_marginTop="70dp"
            android:text="@string/how_to_use_text3"
            android:textAppearance="@android:style/TextAppearance.Medium"
            android:textColor="@color/grey_text" />

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="15dp"
            android:adjustViewBounds="true"
            android:src="@drawable/tour_3" />
    </LinearLayout>
</ViewFlipper>

my onfling code

        @Override
public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,
        float velocityY) {
    try {
        if(e1.getX() > e2.getX() && Math.abs(e1.getX() - e2.getX()) > SWIPE_MIN_DISTANCE && Math.abs(velocityX) > SWIPE_THRESHOLD_VELOCITY) {

            //mVf.setOutAnimation(animFlipOutPrevious);
            //mVf.setInAnimation(animFlipInPrevious);
            mVf.showPrevious();
        }else if (e1.getX() < e2.getX() && e2.getX() - e1.getX() > SWIPE_MIN_DISTANCE && Math.abs(velocityX) > SWIPE_THRESHOLD_VELOCITY) {

           // mVf.setOutAnimation(animFlipOutNext);
           // mVf.setInAnimation(animFlipInNext);
            mVf.showNext();
        }
        updateDots(mVf.getDisplayedChild());
    } catch (Exception e) {
        // nothing
    }
    return true;
}

Thank in advance

Answer 1

Interchange mVf.showPrevious() with mVf.showNext() and mVf.showNext() with mVf.showPrevious() in your onFling method and it should solve your issue.

Below is the explanation for the solution. Case 1: Where e1.getX() > e2.getX(), means swipe from right to left (show the next page). Here you should use mVf.showNext() Case2: Where e1.getX() < e2.getX(), means swipe from left to right (show the previous page). Here you should use mVf.showPrevious()