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

来源：互联网发布：软件的数据采集编辑：程序博客网时间：2024/05/20 00:13

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 （从左到右进入屏幕）

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

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

<translate

android:duration="3000"

android:fromXDelta="100%p"

android:toXDelta="0" />

</set>

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

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

<translate

android:duration="3000"

android:fromXDelta="100%p"

android:toXDelta="0" />

</set>

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

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

<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);
    }
}

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

效果如下：

0 0