zoukankan      html  css  js  c++  java
  • Android ViewFilpper的简单使用

            屏幕切换指的是在同一个Activity内屏幕见的切换,最长见的情况就是在一个FrameLayout内有多个页面,比如一个系统设置页面;一个个性化设置页面。

    通过查看OPhone API文档可以发现,有个android.widget.ViewAnimator类继承至FrameLayout,ViewAnimator类的作用是为FrameLayout里面的View切换提供动画效果。该类有如下几个和动画相关的函数:

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

     

    setOutAnimation: 设置View退出屏幕时候使用的动画,参数

    setInAnimation函数一样。

     showNext: 调用该函数来显示FrameLayout里面的下一个View。   showPrevious:调用该函数来显示FrameLayout里面的上一个View。  

    一般不直接使用ViewAnimator而是使用它的两个子类ViewFlipper和

    ViewSwitcher。ViewFlipper可以用来指定FrameLayout内多个View之间的切换效果,可以一次指定也可以每次切换的时候都指定单独的效果。该类额外提供了如下几个函数:

     

    isFlipping: 用来判断View切换是否正在进行

     setFilpInterval:设置View之间切换的时间间隔

     startFlipping:使用上面设置的时间间隔来开始切换所有的View,切换会循环进行

     stopFlipping: 停止View切换  

    ViewSwitcher 顾名思义Switcher特指在两个View之间切换。可以通过该类指定一个ViewSwitcher.ViewFactory 工程类来创建这两个View。该类也具有两个子类ImageSwitcher、TextSwitcher分别用于图片和文本切换。

    在教程中通过示例介绍ViewFlipper 的使用,其他的使用方式是类似的。详细信息可以参考文档:

    http://androidappdocs-staging.appspot.com/reference/android/widget/ViewAnimator.html

         其他的不多说了,还是举个例子吧:

        首先呢是一个布局文件 main.xml:

     1 <?xml version="1.0" encoding="utf-8"?>
     2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
     3     android:layout_width="fill_parent" 
     4     android:layout_height="fill_parent"
     5     android:orientation="vertical">
     6     <ViewFlipper 
     7         android:id="@+id/myViewFlipper"
     8         android:layout_width="fill_parent" 
     9         android:layout_height="fill_parent">
    10         <!-- 第一个页面 -->
    11         <LinearLayout 
    12             android:layout_width="fill_parent"
    13             android:layout_height="fill_parent" 
    14             android:gravity="center">
    15             <ImageView 
    16                 android:layout_width="wrap_content"
    17                 android:layout_height="wrap_content" 
    18                 android:src="@drawable/image01" 
    19                 android:gravity="center" />
    20         </LinearLayout>
    21         <!-- 第二个页面 -->
    22         <LinearLayout 
    23             android:layout_width="fill_parent"
    24             android:layout_height="fill_parent" 
    25             android:gravity="center">
    26             <ImageView 
    27                 android:layout_width="wrap_content"
    28                 android:layout_height="wrap_content" 
    29                 android:src="@drawable/image02"
    30                 android:gravity="center" />
    31         </LinearLayout>
    32         <!-- 第三个页面 -->
    33         <LinearLayout 
    34             android:layout_width="fill_parent"
    35             android:layout_height="fill_parent" 
    36             android:gravity="center">
    37             <ImageView 
    38                 android:layout_width="wrap_content"
    39                 android:layout_height="wrap_content" 
    40                 android:src="@drawable/image03"
    41                 android:gravity="center" />
    42         </LinearLayout>
    43         <!-- 第四个页面 -->
    44         <LinearLayout 
    45             android:layout_width="fill_parent"
    46             android:layout_height="fill_parent" 
    47             android:gravity="center">
    48             <ImageView 
    49                 android:layout_width="wrap_content"
    50                 android:layout_height="wrap_content" 
    51                 android:src="@drawable/image04"
    52                 android:gravity="center" />
    53         </LinearLayout>
    54     </ViewFlipper>
    55 </LinearLayout>


        接着就是anim文件下动画:

          in_leftright.xml

    1 <?xml version="1.0" encoding="utf-8"?>
    2 <set xmlns:android="http://schemas.android.com/apk/res/android" >
    3     <translate
    4         android:duration="500"
    5         android:fromXDelta="-100%p"
    6         android:toXDelta="0" />
    7 </set>

        in_rightleft.xml

    1 <?xml version="1.0" encoding="utf-8"?>
    2 <set xmlns:android="http://schemas.android.com/apk/res/android" >
    3     <translate
    4         android:duration="500"
    5         android:fromXDelta="100%p"
    6         android:toXDelta="0" />
    7 </set>

         out_rightleft.xml

    1 <?xml version="1.0" encoding="utf-8"?>
    2 <set xmlns:android="http://schemas.android.com/apk/res/android" >
    3     <translate
    4         android:duration="500"
    5         android:fromXDelta="0"
    6         android:toXDelta="100%p" />
    7 </set>

         out_leftright.xml

    1 <?xml version="1.0" encoding="utf-8"?>
    2 <set xmlns:android="http://schemas.android.com/apk/res/android" >
    3     <translate
    4         android:duration="500"
    5         android:fromXDelta="0"
    6         android:toXDelta="-100%p" />
    7 </set>

    最后呢就是手势操作的核心代码:

     1 package cn.cw.android.app;
     2 
     3 import android.app.Activity;
     4 import android.os.Bundle;
     5 import android.util.EventLog.Event;
     6 import android.view.MotionEvent;
     7 import android.widget.ViewFlipper;
     8 
     9 public class ViewFillperTestActivity extends Activity {
    10     /** Called when the activity is first created. */
    11 
    12     private ViewFlipper flipper;
    13     float startX;
    14     @Override
    15     public void onCreate(Bundle savedInstanceState) {
    16         super.onCreate(savedInstanceState);
    17         setContentView(R.layout.main);
    18 
    19         flipper = (ViewFlipper) findViewById(R.id.viewFlipper);
    20         // flipper.startFlipping();
    21 
    22     }
    23 
    24     @Override
    25     public boolean onTouchEvent(MotionEvent event) {
    26 
    27         
    28         switch (event.getAction()) {
    29         case MotionEvent.ACTION_DOWN:
    30             System.out.println("下");
    31             startX = event.getX();// 得到点下时x的坐标
    32             break;
    33         case MotionEvent.ACTION_UP:
    34             if (event.getX() > startX) { // 向右滑动
    35 
    36                 flipper.setInAnimation(this, R.anim.in_leftright); 
    37                 flipper.setOutAnimation(this, R.anim.out_leftright); 
    38                 flipper.showNext();
    39 
    40             } else if (event.getX() < startX) { // 向左滑动 
    41                 flipper.setInAnimation(this, R.anim.in_rightleft);
    42                 flipper.setOutAnimation(this, R.anim.out_rightleft);
    43                 flipper.showPrevious();
    44             }
    45 
    46             break;
    47 
    48         }
    49 
    50         return super.onTouchEvent(event);
    51     }
    52 }

    这是效果图:


      那么一个简单的手势滑动就做好了,欢迎朋友们参考,希望多留点意见!

  • 相关阅读:
    STP RSTP
    数组与文字处理
    3 算法、控制结构
    2 变量、运算符、位运算
    1
    小程序点击变换,
    小程序授权demo
    小程序获取参数
    小程序是否转发群还是个人(转发功能)
    小程序分享转发功能实现demo
  • 原文地址:https://www.cnblogs.com/boyuanmeng/p/3630791.html
Copyright © 2011-2022 走看看