ViewFlipper继承ViewAnimator,切换view的时候是有动画效果的,适合做ppt,多界面的程序欢迎引导界面,算是个轻量级的组件,适合展示静态数据,少量数据。
ViewPager继承ViewGroup。看官网描述,这货和Fragment是好搭档,Fragment有自己的生命周期。也就是说ViewPager更适用复杂的视图切换,而且Viewpager有自己的adapter,这也让其适应复杂对象,实现数据的动态加载。
1、ViewFlipper 1)View切换的控件—ViewFlipper介绍 ViewFilpper类继承于ViewAnimator类。而ViewAnimator类继承于FrameLayout。 查看ViewAnimator类的源码可以看出此类的作用主要是为其中的View切换提供动画效果。该类有如下几个和动画相关的方法。 setInAnimation:设置View进入屏幕时候使用的动画。该方法有两个重载方法,即可以直接传入Animation对象,也可以传入定义的Animation文件的resourceID。 setOutAnimation:设置View退出屏幕时候使用的动画。使用方法和setInAnimation方法一样。 showNext:调用该方法可以显示FrameLayout里面的下一个View。 showPrevious:调用该方法可以来显示FrameLayout里面的上一个View。 查看ViewFlipper的源码可以看到,ViewFlipper主要用来实现View的自动切换。该类提供了如下几个主要的方法。 setFilpInterval:设置View切换的时间间隔。参数为毫秒。 startFlipping:开始进行View的切换,时间间隔是上述方法设置的间隔数。切换会循环进行。 stopFlipping:停止View切换。 setAutoStart:设置是否自动开始。如果设置为“true”,当ViewFlipper显示的时候View的切换会自动开始。 一般情况下,我们都会使用ViewFilpper类实现View的切换,而不使用它的父类ViewAnimator类。 2)实现滑动—GestureDetector介绍 如果想要实现滑动翻页的效果,就要了解另外一个类:Android.view.GestureDetector类。GestureDetector类中可以用来检测各种手势事件。该类有两个回调接口,分别用来通知具体的事件。 GestureDetector.OnDoubleTapListener:用来通知DoubleTap事件,类似于PC上面的鼠标的双击事件。 GestureDetector.OnGestureListener:用来通知普通的手势事件,该接口有六个回调方法,具体的可以查看API。这里想要实现滑动的判断,就需要用到其中的onFling()方法。 3)具体的实现 下面的代码片段详细说明了如何实现滑动翻页。
- <?xml version="1.0" encoding="utf-8"?>
- <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
- android:layout_width="fill_parent"
- android:layout_height="fill_parent"
- android:orientation="vertical" >
- <ViewFlipper
- android:id="@+id/viewFlipper1"
- android:layout_width="fill_parent"
- android:layout_height="fill_parent" >
- <ImageView
- android:id="@+id/imageView1"
- android:layout_width="fill_parent"
- android:layout_height="fill_parent"
- android:src="@drawable/b" />
- <ImageView
- android:id="@+id/imageView2"
- android:layout_width="fill_parent"
- android:layout_height="fill_parent"
- android:src="@drawable/c" />
- <ImageView
- android:id="@+id/imageView3"
- android:layout_width="fill_parent"
- android:layout_height="fill_parent"
- android:src="@drawable/d" />
- <ImageView
- android:id="@+id/imageView4"
- android:layout_width="fill_parent"
- android:layout_height="fill_parent"
- android:src="@drawable/f" />
- <ImageView
- android:id="@+id/imageView5"
- android:layout_width="fill_parent"
- android:layout_height="fill_parent"
- android:src="@drawable/g" />
- </ViewFlipper>
- </LinearLayout>
复制代码- public class ViewFlipperActivity extends Activity implements OnTouchListener, android.view.GestureDetector.OnGestureListener {
- private ViewFlipper flipper;
- GestureDetector mGestureDetector;
- private int mCurrentLayoutState;
- private static final int FLING_MIN_DISTANCE = 80;
- private static final int FLING_MIN_VELOCITY = 150;
- @Override
- protected void onCreate(Bundle savedInstanceState) {
- // TODO Auto-generated method stub
- super.onCreate(savedInstanceState);
- setContentView(R.layout.viewflipper);
-
- flipper=(ViewFlipper) this.findViewById(R.id.viewFlipper1);
- //注册一个用于手势识别的类
- mGestureDetector = new GestureDetector(this);
- //给mFlipper设置一个listener
- flipper.setOnTouchListener(this);
- mCurrentLayoutState = 0;
- //允许长按住ViewFlipper,这样才能识别拖动等手势
- flipper.setLongClickable(true);
-
- }
- /**
- * 此方法在本例中未用到,可以指定跳转到某个页面
- * @param switchTo
- */
- public void switchLayoutStateTo(int switchTo) {
- while (mCurrentLayoutState != switchTo) {
- if (mCurrentLayoutState > switchTo) {
- mCurrentLayoutState--;
- flipper.setInAnimation(inFromLeftAnimation());
- flipper.setOutAnimation(outToRightAnimation());
- flipper.showPrevious();
- } else {
- mCurrentLayoutState++;
- flipper.setInAnimation(inFromRightAnimation());
- flipper.setOutAnimation(outToLeftAnimation());
- flipper.showNext();
- }
-
- }
-
- }
- /**
- * 定义从右侧进入的动画效果
- * @return
- */
- protected Animation inFromRightAnimation() {
- Animation inFromRight = new TranslateAnimation(
- Animation.RELATIVE_TO_PARENT, +1.0f,
- Animation.RELATIVE_TO_PARENT, 0.0f,
- Animation.RELATIVE_TO_PARENT, 0.0f,
- Animation.RELATIVE_TO_PARENT, 0.0f);
- inFromRight.setDuration(200);
- inFromRight.setInterpolator(new AccelerateInterpolator());
- return inFromRight;
- }
-
- /**
- * 定义从左侧退出的动画效果
- * @return
- */
- protected Animation outToLeftAnimation() {
- Animation outtoLeft = new TranslateAnimation(
- Animation.RELATIVE_TO_PARENT, 0.0f,
- Animation.RELATIVE_TO_PARENT, -1.0f,
- Animation.RELATIVE_TO_PARENT, 0.0f,
- Animation.RELATIVE_TO_PARENT, 0.0f);
- outtoLeft.setDuration(200);
- outtoLeft.setInterpolator(new AccelerateInterpolator());
- return outtoLeft;
- }
-
- /**
- * 定义从左侧进入的动画效果
- * @return
- */
- protected Animation inFromLeftAnimation() {
- Animation inFromLeft = new TranslateAnimation(
- Animation.RELATIVE_TO_PARENT, -1.0f,
- Animation.RELATIVE_TO_PARENT, 0.0f,
- Animation.RELATIVE_TO_PARENT, 0.0f,
- Animation.RELATIVE_TO_PARENT, 0.0f);
- inFromLeft.setDuration(200);
- inFromLeft.setInterpolator(new AccelerateInterpolator());
- return inFromLeft;
- }
-
- /**
- * 定义从右侧退出时的动画效果
- * @return
- */
- protected Animation outToRightAnimation() {
- Animation outtoRight = new TranslateAnimation(
- Animation.RELATIVE_TO_PARENT, 0.0f,
- Animation.RELATIVE_TO_PARENT, +1.0f,
- Animation.RELATIVE_TO_PARENT, 0.0f,
- Animation.RELATIVE_TO_PARENT, 0.0f);
- outtoRight.setDuration(200);
- outtoRight.setInterpolator(new AccelerateInterpolator());
- return outtoRight;
- }
-
- public boolean onDown(MotionEvent e) {
- // TODO Auto-generated method stub
- return false;
- }
- /*
- * 用户按下触摸屏、快速移动后松开即触发这个事件
- * e1:第1个ACTION_DOWN MotionEvent
- * e2:最后一个ACTION_MOVE MotionEvent
- * velocityX:X轴上的移动速度,像素/秒
- * velocityY:Y轴上的移动速度,像素/秒
- * 触发条件 :
- * X轴的坐标位移大于FLING_MIN_DISTANCE,且移动速度大于FLING_MIN_VELOCITY个像素/秒
- */
- public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,
- float velocityY) {
- if (e1.getX() - e2.getX() > FLING_MIN_DISTANCE
- && Math.abs(velocityX) > FLING_MIN_VELOCITY) {
- // 当像左侧滑动的时候
- //设置View进入屏幕时候使用的动画
- flipper.setInAnimation(inFromRightAnimation());
- //设置View退出屏幕时候使用的动画
- flipper.setOutAnimation(outToLeftAnimation());
- flipper.showNext();
- } else if (e2.getX() - e1.getX() > FLING_MIN_DISTANCE
- && Math.abs(velocityX) > FLING_MIN_VELOCITY) {
- // 当像右侧滑动的时候
- flipper.setInAnimation(inFromLeftAnimation());
- flipper.setOutAnimation(outToRightAnimation());
- flipper.showPrevious();
- }
- return false;
- }
- public void onLongPress(MotionEvent e) {
- // TODO Auto-generated method stub
-
- }
- public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX,
- float distanceY) {
- // TODO Auto-generated method stub
- return false;
- }
- public void onShowPress(MotionEvent e) {
- // TODO Auto-generated method stub
-
- }
- public boolean onSingleTapUp(MotionEvent e) {
- // TODO Auto-generated method stub
- return false;
- }
- public boolean onTouch(View v, MotionEvent event) {
- // TODO Auto-generated method stub
- // 一定要将触屏事件交给手势识别类去处理(自己处理会很麻烦的)
- return mGestureDetector.onTouchEvent(event);
- }
-
-
- }
复制代码
2、ViewPager 说明: ViewPager用于实现多页面的切换效果,该类存在于Google的兼容包里面,所以在引用时记得在BuilldPath中加入“android-support-v4.jar” 主布局文件 main.xml
- <?xml version="1.0" encoding="utf-8"?>
- <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
- android:layout_width="fill_parent"
- android:layout_height="fill_parent"
- android:orientation="vertical" >
- <android.support.v4.view.ViewPager
- android:id="@+id/viewpager"
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:layout_gravity="center" >
- <android.support.v4.view.PagerTitleStrip
- android:id="@+id/pagertitle"
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:layout_gravity="top" />
- </android.support.v4.view.ViewPager>
- </LinearLayout>
复制代码其中ViewPager为多页显示控件,PagerTitleStrip用于显示当前页面的标题 主窗口代码: PagerTitleDemoActivity.java
- package com.ns.pager;
- import java.util.ArrayList;
- import android.app.Activity;
- import android.os.Bundle;
- import android.support.v4.view.PagerAdapter;
- import android.support.v4.view.PagerTitleStrip;
- import android.support.v4.view.ViewPager;
- import android.view.LayoutInflater;
- import android.view.View;
- public class PagerTitleDemoActivity extends Activity {
- /** Called when the activity is first created. */
- private ViewPager mViewPager;
- private PagerTitleStrip mPagerTitleStrip;
- @Override
- public void onCreate(Bundle savedInstanceState) {
- super.onCreate(savedInstanceState);
- setContentView(R.layout.main);
- mViewPager = (ViewPager)findViewById(R.id.viewpager);
- mPagerTitleStrip = (PagerTitleStrip)findViewById(R.id.pagertitle);
-
- //将要分页显示的View装入数组中
- LayoutInflater mLi = LayoutInflater.from(this);
- View view1 = mLi.inflate(R.layout.view1, null);
- View view2 = mLi.inflate(R.layout.view2, null);
- View view3 = mLi.inflate(R.layout.view3, null);
-
- //每个页面的Title数据
- final ArrayList<View> views = new ArrayList<View>();
- views.add(view1);
- views.add(view2);
- views.add(view3);
-
- final ArrayList<String> titles = new ArrayList<String>();
- titles.add("tab1");
- titles.add("tab2");
- titles.add("tab3");
-
- //填充ViewPager的数据适配器
- PagerAdapter mPagerAdapter = new PagerAdapter() {
-
- @Override
- public boolean isViewFromObject(View arg0, Object arg1) {
- return arg0 == arg1;
- }
-
- @Override
- public int getCount() {
- return views.size();
- }
- @Override
- public void destroyItem(View container, int position, Object object) {
- ((ViewPager)container).removeView(views.get(position));
- }
- @Override
- public CharSequence getPageTitle(int position) {
- return titles.get(position);
- }
- @Override
- public Object instantiateItem(View container, int position) {
- ((ViewPager)container).addView(views.get(position));
- return views.get(position);
- }
- };
-
- mViewPager.setAdapter(mPagerAdapter);
- }
- }
复制代码运行效果:
3、Gallery - package xiaosi.gallery;
- import android.app.Activity;
- import android.content.Context;
- import android.content.res.TypedArray;
- import android.os.Bundle;
- import android.view.View;
- import android.view.ViewGroup;
- import android.widget.AdapterView;
- import android.widget.AdapterView.OnItemClickListener;
- import android.widget.BaseAdapter;
- import android.widget.Gallery;
- import android.widget.ImageView;
- import android.widget.Toast;
- public class GalleryActivity extends Activity {
- /** Called when the activity is first created. */
- private Gallery gallery =null;
- @Override
- public void onCreate(Bundle savedInstanceState) {
- super.onCreate(savedInstanceState);
- setContentView(R.layout.main);
-
- gallery = (Gallery)findViewById(R.id.gallery);
- //设置图片适配器
- gallery.setAdapter(new ImageAdapter(this));
- gallery.setSpacing(5);
-
- //设置监听器
- gallery.setOnItemClickListener(new OnItemClickListener() {
-
- public void onItemClick(AdapterView<?> arg0, View arg1, int arg2, long arg3) {
- Toast.makeText(GalleryActivity.this, "点击了第"+arg2+"张图片", Toast.LENGTH_LONG).show();
- }
- });
- }
- }
- class ImageAdapter extends BaseAdapter{
-
- int mGalleryItemBackground;
- private Context context;
- //图片源数组
- private Integer[] imageInteger={
- R.drawable.a,
- R.drawable.b,
- R.drawable.c,
- R.drawable.d
- };
- public ImageAdapter(Context c){
- context = c;
- TypedArray attr = context.obtainStyledAttributes(R.styleable.HelloGallery);
- mGalleryItemBackground = attr.getResourceId(R.styleable.HelloGallery_android_galleryItemBackground, 0);
- attr.recycle();
- }
- // 获取图片的个数
- public int getCount() {
- return imageInteger.length;
- }
- // 获取图片在库中的位置
- public Object getItem(int position) {
- return position;
- }
- // 获取图片ID
- public long getItemId(int position) {
- return position;
- }
- public View getView(int position, View convertView, ViewGroup parent) {
-
- ImageView imageView = new ImageView(context);
- // 给ImageView设置资源
- imageView.setImageResource(imageInteger[position]);
- // 设置显示比例类型
- imageView.setScaleType(ImageView.ScaleType.FIT_XY);
- // 设置布局 图片120*80
- imageView.setLayoutParams(new Gallery.LayoutParams(180, 100));
- imageView.setBackgroundResource(mGalleryItemBackground);
- return imageView;
- }
- }
复制代码
mian.xml
- <?xml version="1.0" encoding="utf-8"?>
- <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
- android:layout_width="fill_parent"
- android:layout_height="fill_parent"
- android:orientation="vertical" >
- <Gallery
- android:id="@+id/gallery"
- android:layout_width="fill_parent"
- android:layout_height="wrap_content"
- android:gravity="bottom"
- android:background="?android:galleryItemBackground"/>
- </LinearLayout>
复制代码
创建一个新的XML文件在res/values/目录下 attrs.xml命名。
这是一个定制的styleable资源,可以应用于一个布局。
- <?xml version="1.0" encoding="utf-8"?>
- <resources>
- <declare-styleable name="HelloGallery">
- <attr name="android:galleryItemBackground" />
- </declare-styleable>
- </resources>
复制代码
|