当前位置： 移动技术网 > IT编程>移动开发>Android > ANDROID中使用VIEWFLIPPER类实现屏幕切换（关于坐标轴的问题已补充更改）

ANDROID中使用VIEWFLIPPER类实现屏幕切换（关于坐标轴的问题已补充更改）

2019年07月24日  | 移动技术网IT编程  | 我要评论

一胎五宝,六年级科学上册教案,湖北五峰

屏幕切换指的是在同一个activity内屏幕间的切换，viewflipper继承了framelayout类，viewanimator类的作用是为framelayout里面的view切换提供动画效果。如下动图：

该类有如下几个和动画相关的函数：

  • setinanimation：设置view进入屏幕时候使用的动画，该函数有两个版本，一个接受单个参数，类型为android.view.animation.animation；一个接受两个参数，类型为context和int，分别为context对象和定义animation的resourceid。
  • setoutanimation: 设置view退出屏幕时候使用的动画，参数setinanimation函数一样。
  • shownext： 调用该函数来显示framelayout里面的下一个view。
  • showprevious： 调用该函数来显示framelayout里面的上一个view。

下面通过坐标轴的形式为大家演示动画实现方式：

由上图可知，以屏幕左下角为数学坐标轴的原点，屏幕下边框为x轴，左边框为y轴，当前屏幕显示为图二，如果要看图一，则需要图一由左至右(相对屏幕而言)进入屏幕，图一x轴初始坐标为-100%p，移动到屏幕位置时图一x轴变为0（因为本次演示为横向滑动，所以不涉及y轴）；同理图三要进入屏幕，则需由右至左，x轴由100%p变为0.清楚了坐标位置，我们要实现四种动画效果，就会很简单，下面代码（需建立在res目录下自建的anim文件夹下）演示四种动画效果：

in_leftright.xml——从左到右进入屏幕：

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
  <translate
    android:duration="500"
    android:fromxdelta="-100%p"
    android:toxdelta="0"/>
</set>
out_leftright.xml——从左到右出去屏幕：
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
  <translate
    android:duration="500"
    android:fromxdelta="0"
    android:toxdelta="100%p"/>
</set>

in_rightleft.xml——从右到左进入屏幕：

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
  <translate
    android:duration="500"
    android:fromxdelta="100%p"
    android:toxdelta="0"/>

</set>

out_rightleft.xml——从右到左出去屏幕：

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
  <translate
    android:duration="500"
    android:fromxdelta="0"
    android:toxdelta="-100%p"/>
</set>

动画效果建立完成，建立

layout中view_layout.xml布局文件（本次直接将定义动画的三张图片直接通过linearlayout布局到viewflipper中）：

<?xml version="1.0" encoding="utf-8"?>
<linearlayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:orientation="vertical" android:layout_width="match_parent"
  android:layout_height="match_parent">
  <viewflipper
    android:id="@+id/vf"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <linearlayout
      android:layout_width="match_parent"
      android:layout_height="match_parent">
      <imageview
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:src="@mipmap/sample_1" />
    </linearlayout>
    <linearlayout
      android:layout_width="match_parent"
      android:layout_height="match_parent">
      <imageview
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:src="@mipmap/sample_2" />
    </linearlayout>
    <linearlayout
      android:layout_width="match_parent"
      android:layout_height="match_parent">
      <imageview
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:src="@mipmap/sample_3" />
    </linearlayout>
  </viewflipper>
</linearlayout>

activity中java功能实现代码：

import android.os.bundle;
import android.support.annotation.nullable;
import android.support.v7.app.appcompatactivity;
import android.view.motionevent;
import android.view.view;
import android.widget.viewflipper;
/**
 * created by panchengjia on 2016/11/28.
 */
public class flipperactivity extends appcompatactivity implements view.ontouchlistener{
  private viewflipper vf;
  float startx;//声明手指按下时x的坐标
  float endx;//声明手指松开后x的坐标
  @override
  protected void oncreate(@nullable bundle savedinstancestate) {
    super.oncreate(savedinstancestate);
    setcontentview(r.layout.viewflipper_layout);
    vf= (viewflipper) findviewbyid(r.id.vf);
    vf.setontouchlistener(this);
  }
  @override
  public boolean ontouch(view v, motionevent event) {
    //判断捕捉到的动作为按下，则设置按下点的x坐标starx
    if(event.getaction()==motionevent.action_down){
      startx=event.getx();
      //判断捕捉到的动作为抬起，则设置松开点x坐标endx
    }else if(event.getaction()==motionevent.action_up){
      endx=event.getx();
      //由右到左滑动屏幕，x值会减小，图片由屏幕右侧进入屏幕
      if(startx>endx){
        //进出动画成对
        vf.setinanimation(this,r.anim.in_rightleft);
        vf.setoutanimation(this,r.anim.out_rightleft);
        vf.shownext();//显示下个view
        //由左到右滑动屏幕，x值会增大，图片由屏幕左侧进入屏幕
      }else if(startx<endx){
        vf.setinanimation(this,r.anim.in_leftright);
        vf.setoutanimation(this,r.anim.out_leftright);
        vf.showprevious();//显示上个view
      }
    }
    return true;
  }
}

在练习这里时，动画的显示效果方式困扰了我好久，这才想到了通过坐标轴的形式体现动画实现原理，画成的那一瞬间，整个人顿似醍醐灌顶，忍不住想要写成博文分享给大家，共勉！

 后续更改补充：发文后，好友提醒在安卓开发中android屏幕坐标系统，不同于一般数学模型，原点应该位于左上角且y轴向下递增，经过查阅资料，确实如此，现更改坐标轴如下： 

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持移动技术网。

您可能感兴趣的文章:

如对本文有疑问，请在下面进行留言讨论，广大热心网友会与你互动！！ 点击进行留言回复

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网