android ViewFlipper

转载 2015年07月06日 22:47:01
说到android的左右滑动效果我们可以说是在每个应用上面都可以看到这样的效果,不管是微博,还是QQ等。实现左右滑动的方式很多,有ViewPaer(不过这个和需要android-support-v4.jar的支持),自定义实现Viewgroup,gallery等都可以达到这种效果。这里做下ViewFliper实现左右滑动的效果。

以下会会用到的技术有:
1、ViewFlipper
2、GestureDetector
3、Animation
主要是这三个类再起作用。

原理:向左向右滑动主要是依赖手势来控制,手势向右滑动就调用 viewFlipper.showNext();方法,同理,向左滑动就会去调用viewFlipper.showPrevious();方法。

接下来直接上代码:

首先在布局文件中添加ViewFlipper的标签:
复制内容到剪贴板
代码:
<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" >

   <ViewFlipper 
       android:id="@+id/viewFlipper"
       android:layout_width="match_parent"
       android:layout_height="match_parent"
       ></ViewFlipper>

</RelativeLayout>
编写代码:
复制内容到剪贴板
代码:
package com.xzw.ui;

import android.app.Activity;
import android.os.Bundle;
import android.util.Log;
import android.view.GestureDetector;
import android.view.GestureDetector.OnGestureListener;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;
import android.view.Window;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.ImageView;
import android.widget.ViewFlipper;
/**
* 左右滑动demo
@author xzw
*
*/
public class MainActivity extends Activity implements OnGestureListener {
        
        private static final String TAG = "MainActivity";
        
        private ViewFlipper viewFlipper;
        private GestureDetector detector; //手势检测

        Animation leftInAnimation;
        Animation leftOutAnimation;
        Animation rightInAnimation;
        Animation rightOutAnimation;
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        setContentView(R.layout.activity_main);
        
        viewFlipper = (ViewFlipper)findViewById(R.id.viewFlipper);
        detector = new GestureDetector(this);
        
        //往viewFlipper添加View
        viewFlipper.addView(getImageView(R.drawable.new_feature_1));
        viewFlipper.addView(getImageView(R.drawable.new_feature_2));
        viewFlipper.addView(getImageView(R.drawable.new_feature_3));
        viewFlipper.addView(getImageView(R.drawable.new_feature_4));
        viewFlipper.addView(getImageView(R.drawable.new_feature_5));
        viewFlipper.addView(getImageView(R.drawable.new_feature_6));
        
        //动画效果
            leftInAnimation = AnimationUtils.loadAnimation(this, R.anim.left_in);
                leftOutAnimation = AnimationUtils.loadAnimation(this, R.anim.left_out);
                rightInAnimation = AnimationUtils.loadAnimation(this, R.anim.right_in);
                rightOutAnimation = AnimationUtils.loadAnimation(this, R.anim.right_out);
    }

    private ImageView getImageView(int id){
            ImageView imageView = new ImageView(this);
            imageView.setImageResource(id);
            return imageView;
    }

    @Override
    public boolean onTouchEvent(MotionEvent event) {
     
            return this.detector.onTouchEvent(event); //touch事件交给手势处理。
    }
    
        @Override
        public boolean onDown(MotionEvent e) {
                // TODO Auto-generated method stub
                return false;
        }

        @Override
        public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,
                        float velocityY) {
                Log.i(TAG, "e1="+e1.getX()+" e2="+e2.getX()+" e1-e2="+(e1.getX()-e2.getX()));
                
        
                
                if(e1.getX()-e2.getX()>120){
                        viewFlipper.setInAnimation(leftInAnimation);
                        viewFlipper.setOutAnimation(leftOutAnimation);
                    viewFlipper.showNext();//向右滑动
                    return true;
                }else if(e1.getX()-e2.getY()<-120){
                        viewFlipper.setInAnimation(rightInAnimation);
                        viewFlipper.setOutAnimation(rightOutAnimation);
                        viewFlipper.showPrevious();//向左滑动
                        return true;
                }
                return false;
        }

        @Override
        public void onLongPress(MotionEvent e) {
                // TODO Auto-generated method stub
                
        }

        @Override
        public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX,
                        float distanceY) {
                // TODO Auto-generated method stub
                return false;
        }

        @Override
        public void onShowPress(MotionEvent e) {
                // TODO Auto-generated method stub
                
        }

        @Override
        public boolean onSingleTapUp(MotionEvent e) {
                // TODO Auto-generated method stub
                return false;
        }
    
    
}
接下来我们编写动画效果的xml文件,你也可以通过代码实现,这里使用xml配置,个人感觉比较简单。

left_in.xml
复制内容到剪贴板
代码:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate 
        android:fromXDelta="100%p"
        android:toXDelta="0"
        android:duration="600"
        />
    <alpha 
        android:fromAlpha="0.1"
        android:toAlpha="1.0"
        android:duration="600"
        />

</set>
left_out.xml
复制内容到剪贴板
代码:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate 
        android:fromXDelta="0"
        android:toXDelta="-100%p"
        android:duration="600"
        />
    <alpha 
        android:fromAlpha="1.0"
        android:toAlpha="0.1"
        android:duration="600"
        />

</set>
right_in.xml
复制内容到剪贴板
代码:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate 
        android:fromXDelta="-100%p"
        android:toXDelta="0"
        android:duration="600"
        />
    <alpha 
        android:fromAlpha="0.1"
        android:toAlpha="1.0"
        android:duration="600"
        />

</set>
right_out.xml
复制内容到剪贴板
代码:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate 
        android:fromXDelta="0"
        android:toXDelta="100%p"
        android:duration="600"
        />
    <alpha 
        android:fromAlpha="1.0"
        android:toAlpha="0.1"
        android:duration="600"
        />

</set>
以上就是完整的代码,看起来很简单吧。
看下面的效果图吧,秋天到了,图片也选择的有秋意点儿哈。
附上源代码:http://down.51cto.com/data/579206

 1.jpg (18.52 KB)

2012-11-1 11:00

1.jpg

相关文章推荐

Android手势识别ViewFlipper触摸动画

今天给大家介绍一下如何实现Android主页面的左右拖动效果。实现起来很简单,就是使用ViewFlipper来将您要来回拖动的View装在一起,然后与GestureDetector手势识别类来联动,确...

2015.1.6,第三节课Android控件ViewFlipper手势滑动效果

Android控件ViewFlipper手势滑动效果

Android 滑动效果ViewFlipper

  • 2016-04-25 20:22
  • 2.09MB
  • 下载

Android Widget 小部件(四---完结) 使用ListView、GridView、StackView、ViewFlipper展示Widget

A RemoteViews object (and, consequently, an App Widget) can support the following layout classes: F...

Android 滑动效果ViewFlipper

  • 2013-09-26 15:38
  • 2.09MB
  • 下载
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)