ViewFlipper
是Android
自带的一个多页面管理控件且可以自动播放!它和ViewPager
有所不同,ViewPager
继承自ViewGroup
,是一页一页的,可以带动画效果,可以兼容低版本;而ViewFlipper
继承ViewAnimator
,是一层一层的,切换View
的时候可以设置动画效果,是Android 4.0
才引入的新控件。使用场景和ViewPager
基本一样,在很多时候都是用来实现进入应用后的引导页或者用于图片轮播显示。
setInAnimation
:View
进入屏幕时使用动画;
setOutAnimation
:View
退出屏幕时使用动画;
showNext
:显示ViewFlipper
里的下一个View
视图;
showPrevious
:显示ViewFlipper
里的上一个View
视图;
setFlipInterval
:View
之间切换的时间间隔;
setAutoStart
:是否可以自动播放,true
为自动播放,false
为不自动播放;
startFlipping
:自动循环切换播放;
stopFlipping
:停止自动切换播放;
ViewFlipper
加入View
的两种方法1.静态导入
所谓的静态导入就是像以下方式那样,将一个个页面添加到ViewFlipper
的中间!
<ViewFlipper
android:id="@+id/vf_help"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:flipInterval="3000"
android:inAnimation="@anim/right_in"
android:outAnimation="@anim/right_out">
<include layout="@layout/page_help_one" />
<include layout="@layout/page_help_two" />
<include layout="@layout/page_help_three" />
<include layout="@layout/page_help_four" />
ViewFlipper>
2.动态导入
所谓的动态导入就是像以下方式那样,通过addView
方法填充View
!
mVfHelp = (ViewFlipper) findViewById(R.id.vf_help);
for (int i = 0; i < resId.length; i++) {
mVfHelp.addView(getImageView(resId[i]));
}
效果图:
ViewFlipper
实现图片轮播 - 静态导入切换动画:
1.right_in.xml
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:duration="1000"
android:fromXDelta="100%p"
android:toXDelta="0" />
set>
2.right_out.xml
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:duration="1000"
android:fromXDelta="0"
android:toXDelta="-100%p" />
set>
布局文件:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ViewFlipper
android:id="@+id/vf_help"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:flipInterval="3000"
android:inAnimation="@anim/right_in"
android:outAnimation="@anim/right_out">
<include layout="@layout/page_help_one" />
<include layout="@layout/page_help_two" />
<include layout="@layout/page_help_three" />
<include layout="@layout/page_help_four" />
ViewFlipper>
LinearLayout>
Java
文件调用:
public class MethodOneActivity extends BaseActivity {
private ViewFlipper mVfHelp;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_method_one);
mVfHelp = (ViewFlipper) findViewById(R.id.vf_help);
mVfHelp.startFlipping();
}
}
ViewFlipper
- 动态导入切换动画:
1.left_in.xml
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:duration="1000"
android:fromXDelta="-100%p"
android:toXDelta="0" />
set>
2.left_out.xml
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:duration="1000"
android:fromXDelta="0"
android:toXDelta="100%p" />
set>
布局文件:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ViewFlipper
android:id="@+id/vf_help"
android:layout_width="match_parent"
android:layout_height="match_parent" />
LinearLayout>
Java
文件调用:
private void initData() {
//实例化SimpleOnGestureListener与GestureDetector对象
mgListener = new MyGestureListener();
mDetector = new GestureDetector(mActivity, mgListener);
//动态添加子View
for (int i = 0; i < resId.length; i++) {
mVfHelp.addView(getImageView(resId[i]));
}
}
/**
* @Description 重写onTouchEvent触发MyGestureListener里的方法
*/
@Override
public boolean onTouchEvent(MotionEvent event) {
return mDetector.onTouchEvent(event);
}
/**
* @Description 自定义一个View类下的GestureDetector
*/
private class MyGestureListener extends GestureDetector.SimpleOnGestureListener {
@Override
public boolean onFling(MotionEvent e1, MotionEvent e2, float v, float v1) {
if (e1.getX() - e2.getX() > MIN_MOVE) {
mVfHelp.setInAnimation(mActivity, R.anim.right_in);
mVfHelp.setOutAnimation(mActivity, R.anim.right_out);
mVfHelp.showNext();
} else if (e2.getX() - e1.getX() > MIN_MOVE) {
mVfHelp.setInAnimation(mActivity, R.anim.left_in);
mVfHelp.setOutAnimation(mActivity, R.anim.left_out);
mVfHelp.showPrevious();
}
return true;
}
}
项目地址 ☞ 传送门