Android UI基础之ViewFillper实现屏幕切换

ViewFillper 的简单使用

在Android程序设计中，有时需要实现屏幕切换的动画效果，这时可以使用ImageSwitcher实现， 但是其比较单一， 而ViewFillper 则比较灵活。可以将文本与视图同时显示。屏幕切换指的是在同一个Activity内屏幕间的切换，最常见的情况就是在一个FrameLayout内有多个页面，比如系统设置页面，或一个个性化设置页面

。

ViewFillper类的继承关系：

extends ViewAnimator

java.lang.Object
↳	android.view.View
	↳	android.view.ViewGroup
		↳	android.widget.FrameLayout
			↳	android.widget.ViewAnimator
				↳	android.widget.ViewFlipper

该类提供了几个与动画相关的函数

setInAnimation：设置View进入屏幕时候使用的动画，该函数有两个版本，一个接受单个参数，类型为android.view.animation.Animation；一个接受两个参数，类型为Context和int，分别为Context对象和定义Animation的resourceID。

setOutAnimation: 设置View退出屏幕时候使用的动画，参数setInAnimation函数一样。

showNext： 调用该函数来显示FrameLayout里面的下一个View。

showPrevious： 调用该函数来显示FrameLayout里面的上一个View。

首先要定义每一个动画的属相

Inightleft.xml （从左到右进入屏幕）

<set xmlns:android="http://schemas.android.com/apk/res/android">

<translate

android:duration="1000"

android:fromXDelta="100%p"

android:toXDelta="0"

/>

</set>

outeftright.xml——从左到右出去屏幕

<?xml version="1.0" encoding="utf-8"?>

<set xmlns:android="http://schemas.android.com/apk/res/android" >

<translate

android:duration="3000"

android:fromXDelta="100%p"

android:toXDelta="0" />

</set>

inrightleft.xml——从右到左进入屏幕

<?xml version="1.0" encoding="utf-8"?>

<set xmlns:android="http://schemas.android.com/apk/res/android" >

<translate

android:duration="3000"

android:fromXDelta="100%p"

android:toXDelta="0" />

</set>

outrightleft.xml——从右到左出去屏幕

<?xml version="1.0" encoding="utf-8"?>

<set xmlns:android="http://schemas.android.com/apk/res/android" >

<translate

android:duration="3000"

android:fromXDelta="100%p"

android:toXDelta="0" />

</set>

Activity_main.xml

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

xmlns:tools="http://schemas.android.com/tools"

android:layout_width="match_parent"

android:layout_height="match_parent"

tools:context="com.xiyou.com.viewfillperuse.MainActivity">

<ViewFlipper

android:layout_width="match_parent"

android:layout_height="match_parent"

android:id="@+id/viewFlipper"

android:layout_alignParentTop="true"

android:layout_alignParentStart="true" >

<LinearLayout

android:layout_width="match_parent"

android:layout_height="match_parent">

<ImageView

android:layout_width="match_parent"

android:scaleType="centerCrop"

android:layout_height="match_parent"

android:src="@drawable/a"

/>

</LinearLayout>

<LinearLayout

android:layout_width="match_parent"

android:layout_height="match_parent">

<ImageView

android:layout_width="match_parent"

android:layout_height="match_parent"

android:scaleType="centerCrop"

android:src="@drawable/b"

/>

</LinearLayout>

<LinearLayout

android:layout_width="match_parent"

android:layout_height="match_parent">

<ImageView

android:layout_width="match_parent"

android:scaleType="centerCrop"

android:layout_height="match_parent"

android:src="@drawable/c"

/>

</LinearLayout>

</ViewFlipper>>

</RelativeLayout>

具体实现如下：

public class MainActivity extends AppCompatActivity {

private ViewFlipper viewFlipper;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

viewFlipper = (ViewFlipper) findViewById(R.id.viewFlipper);

}

float StertX = 0.0f;

float EndX = 0.0f;

@Override

public boolean onTouchEvent(MotionEvent event) {

int action = event.getAction();

if (action == MotionEvent.ACTION_DOWN) {

StertX = event.getX();

} else if (action == MotionEvent.ACTION_UP) {

if (StertX > EndX) {

viewFlipper.setInAnimation(this, R.anim.inightleft);

viewFlipper.setOutAnimation(this, R.anim.outrightleft);

viewFlipper.showNext();// 展示下一个

} else if (EndX > StertX) {

viewFlipper.setInAnimation(this, R.anim.inleftright);

viewFlipper.setOutAnimation(this, R.anim.outleftrigt);

viewFlipper.showPrevious();//展示 上一张

}

}

return super.onTouchEvent(event);

}

}

运行后通过点击屏幕可以实现切换，当然动画的时间可以在动画属性的文件中进行修改。

效果如下：