SoFunction
Updated on 2025-03-11

Android viewflipper realizes left and right sliding switching to display pictures

This article shares the specific code for Android viewflipper to realize left and right sliding switching to display pictures for your reference. The specific content is as follows

1. First define four animation files to represent the display effect when view is switched

in_leftright.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:andro >
 
    <translate
        android:duration="500"
        android:fromXDelta="0"
        android:toXDelta="-100%p" />
 
</set>

in_rightleft.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:andro >
 
    <translate
        android:duration="500"
        android:fromXDelta="100%p"
        android:toXDelta="0" />
 
</set>

out_leftright.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:andro >
 
    <translate
        android:duration="500"
        android:fromXDelta="0"
        android:toXDelta="100%p" />
 
</set>

out_rightleft.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:andro >
 
    <translate
        android:duration="500"
        android:fromXDelta="0"
        android:toXDelta="-100%p" />
 
</set>

2. Add ViewFlipper control in it, put three LinearLayouts inside, representing 3 views

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:andro
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >
 
    <ViewFlipper
        android:
        android:layout_width="match_parent"
        android:layout_height="match_parent" >
 
        <!-- first page -->
 
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:gravity="center" >
 
            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:src="@drawable/a001" />
        </LinearLayout>
 
        <!-- second page -->
 
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:gravity="center" >
 
            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:src="@drawable/a002" />
        </LinearLayout>
 
        <!-- third page -->
 
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:gravity="center" >
 
            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:src="@drawable/a003" />
        </LinearLayout>
 
    </ViewFlipper>
 
</LinearLayout>

3. Finally, in the onTouchEvent event in the activity, we will determine which direction it is moving.

package ;
 
import ;
import ;
import ;
import ;
 
public class ViewFlipperActivity extends Activity {
 
    private ViewFlipper viewFlipper = null;
 
    float startX;
 
    @Override
    public void onCreate(Bundle savedInstanceState) {
        (savedInstanceState);
        setContentView();
        // init widget
        viewFlipper = (ViewFlipper) findViewById();
    }
 
    @Override
    public boolean onTouchEvent(MotionEvent event) {
        switch (()) {
        case MotionEvent.ACTION_DOWN:
            startX = ();
            break;
        case MotionEvent.ACTION_UP:
            if (() > startX) {// flip to right
                (this, .in_leftright);
                (this, .out_leftright);
                ();
            } else {// flip to left
                (this, .in_rightleft);
                (this, .out_rightleft);
                ();
            }
 
        }
        return (event);
    }
}

The above is all the content of this article. I hope it will be helpful to everyone's study and I hope everyone will support me more.