您的位置:首页 > 移动开发 > Android开发

android 平滑切换屏幕的几种方法总结

2011-12-22 19:51 666 查看
   找了好久才发现的文章

转自:http://archive.cnblogs.com/a/2265135/ 

第一种: ViewFlipper + GestureDetector;

第二种:自己重写ViewGroup来管理view;

第三种:利用系统自带的ViewPager。

 

关于第一种方法,很多人用过就只说一下思路:用ViewSwitcher,加上动画效果就可以做到。

第二种方法参考:http://marshal.easymorse.com/archives/3828,我在这里就直接贴过来了:

  


     

  


上述截图,是手指拖动的效果,如果拖动过屏幕中点,松手后就会自动移动到第二屏。另外,如果使用轻扫手势,也可以自动移动下一屏。

 

主要是参考了这个项目:

http://code.google.com/p/andro-views/

有源代码,不过他的代码有两个问题:

有bug,在特定情况下,可能两屏会同时出现,类似上面第三张图,不能切换过去,这可能是作者漏掉了一些touch状态可能性造成的
代码比较繁杂,作者估计是参考Android源代码来写的,有些代码复制自Android代码,比如ViewGroup,另外可能参考了ScrollView等
看到eric的实现,让我明白以前的animation动画处理以及通过修改空白边(margin)的方式都不是正道。正道是使用Scroller,这是一个带动画支持的滚屏帮助类。

使用Scroller的基本思路是,比如在本例中,将多个子视图(ImageView)横向排列到布局中(自己实现的布局),然后,通过Scroller可支持类似Windows下滚动条横向移动的效果,而且是带动画的。比如,Scroller的方法:

startScroll(int startX, int startY, int dx, int dy),设定x轴和y轴的起点及移动的距离,调用该方法将执行滚动动画,动画时间是250毫秒,也可以用重载的另外一个方法,可设定动画周期
abortAnimation(),停止动画,那么移动屏幕也会中止,目前我的版本中没有用到,用的场合是轻扫手势后,又做了按下的手势
computeScrollOffset(),判断是否移动到指定位置,用于移动过程中调用,如果未到位将继续移动,产生动画移动的效果,在本例中,覆盖ViewGroup的computeScroll方法,在里面调用了该方法
对Scroller的调用,要在布局(Layout)中进行。

Android中的View有两个子类,Widget和ViewGroup,Widget是可见的窗口组件,比如按钮,ViewGroup就是布局,ViewGroup已经提供了多个布局子类,比如LinearLayout等。

本例中实现了自己的ViewGroup子类。

通过覆盖onLayout方法实现对子视图的横向排列布局:

@Override 

protected void onLayout(boolean changed, int left, int top, int right, 

        int bottom) { 

    Log.d(TAG, ">>left: " + left + " top: " + top + " right: " + right 

            + " bottom:" + bottom);

    /** 

     * 设置布局,将子视图顺序横屏排列 

     */ 

    for (int i = 0; i < getChildCount(); i++) { 

        View child = getChildAt(i); 

        child.setVisibility(View.VISIBLE); 

        child.measure(right – left, bottom – top); 

        child.layout(0 + i * getWidth(), 0, getWidth() + i * getWidth(), 

                getHeight()); 

   

通过覆盖computeScroll方法,计算移动屏幕的位移和重新绘制屏幕:

@Override 

public void computeScroll() { 

    if (scroller.computeScrollOffset()) { 

        scrollTo(scroller.getCurrX(), 0); 

        postInvalidate(); 

    } 

}

编写了一个名为scrollToScreen的方法,用于根据指定屏幕号切换到该屏幕:

/** 

* 切换到指定屏 



* @param whichScreen 

*/ 

public void scrollToScreen(int whichScreen) { 

    if (getFocusedChild() != null && whichScreen != currentScreenIndex 

            && getFocusedChild() == getChildAt(currentScreenIndex)) { 

        getFocusedChild().clearFocus(); 

    }

    final int delta = whichScreen * getWidth() – getScrollX(); 

    scroller.startScroll(getScrollX(), 0, delta, 0, Math.abs(delta) * 2); 

    invalidate();

    currentScreenIndex = whichScreen; 

}

snapToDestination方法,是处理当屏幕拖动到一个位置松手后的处理:

/** 

* 根据当前x坐标位置确定切换到第几屏 

*/ 

private void snapToDestination() { 

    scrollToScreen((getScrollX() + (getWidth() / 2)) / getWidth()); 

}

 

然后说说手势事件的处理。eric的实现,全部使用onTouch事件处理,这样代码不够简明。因为需要记录很多组合手势的历史数据,这样就必须有一些状态位,一些坐标数值。

我用GestureDetector的手势处理事件简化了这方面的处理,只在手势抬起(UP)事件处理中在ouTouchEvent方法中做了处理。

 

具体代码见:http://easymorse.googlecode.com/svn/tags/ScrollDemos-0.6/

 

升级版本:

 在此基础上又实现了个版本,结合了Page Control效果。另外换了个表单视图,来说明方案的通用性。


    

  


源代码见:http://easymorse.googlecode.com/svn/tags/ScrollDemos-0.7/

 

第三种方法:详见:http://blog.csdn.net/billpig/article/details/6650097

起初最早接触到左右两个屏幕切换的是在 《创新源于模仿之三:实现左右两个屏幕的切换》 这篇文章上,感谢作者为我们提供了这么好的DEMO。

 

什么是ViewPager呢?

它是实现左右两个屏幕平滑地切换的一个类,它是Google提供的,作为Android的一个补充。先上个效果图把,让大家有个直观的认识。



 

我们在网上搜索这相关到主题的时候,会看到有很多关于这方面的问题:如何平滑?水平移动?等等。现在,我们可以自己不去亲自做这个费力的事情了,只需要使用到一个叫ViewPager的类即可。ViewPager是最近在Compatibility package发布的,支持android 1.6+,如果要使用的话,要通过SDK Manager去更新Compatibility
package,具体使用方法在<SDK_DOC_PATH>/sdk/compatibility-library.html(SDK_DOC_PATH是自带Android文档的位置,需要更新到最新的文档才有)。

《创新源于模仿之三:实现左右两个屏幕的切换》提供了Workspace实现了左右屏幕的切换,现在Google I/O上已经发布了这样的Workspace类,方便我们大家去使用,稍后我会同本文DEMO的源代码一起发布。那ViewPager和Workspace有什么样的区别呢?先看下api doc的说法:

Layout manager that allows the user to flip left and right through pages of data. You supply an implementation of a 
PagerAdapter
 to generate the pages that the view shows.

如上所述,ViewPager提供了一个适配器,方便我们对各个View进行控制,而Workspace需要我们手动去添加,它相当于是一个"静态切换"。接下来我将介绍下如何使用:

1、下载来Android SDK & AVD manager的更新:Available Packages -> Android Repository -> Android Compatibility Package, revision 3. 它将安装在\extras\android\compatibility\v4文件下

2、建立一个Android项目,在上述安装目录下把 android-support-v4.jar添加进项目,如果是最新的ADT,只需要右击project->Android Tools->Add Compatibility Library

3、在Activity中使用ViewPager

4、如果ViewPager是用xml去定义的,需要写上全局的路径,如:

<android.support.v4.view.ViewPager  
android:layout_width="match_parent"   
android:layout_height="match_parent"   
android:id="@+id/awesomepager"/>

5、建立一个PagerAdapter,实现如下方法:
 getCount(), instantiateItem(), destroyItem(), isViewFromObject() 。 

总上所述,贴上俺的代码,我们发现,可以很快很简单的实现左右两个屏幕的切换 

   

public class AwesomePagerActivity extends Activity {  
      
    private ViewPager awesomePager;  
  
    private Context cxt;  
    private AwesomePagerAdapter awesomeAdapter;  
      
    private LayoutInflater mInflater;  
    private List<View> mListViews;  
      
    /** Called when the activity is first created. */  
    @Override  
    public void onCreate(Bundle savedInstanceState) {  
        super.onCreate(savedInstanceState);  
        setContentView(R.layout.main);  
        cxt = this;  
          
        awesomeAdapter = new AwesomePagerAdapter();  
        awesomePager = (ViewPager) findViewById(R.id.awesomepager);  
        awesomePager.setAdapter(awesomeAdapter);  
          
        mListViews = new ArrayList<View>();  
        mInflater = getLayoutInflater();  
        mListViews.add(mInflater.inflate(R.layout.layout1, null));  
        mListViews.add(mInflater.inflate(R.layout.layout2, null));  
        mListViews.add(mInflater.inflate(R.layout.layout3, null));  
          
    }  
      
    private class AwesomePagerAdapter extends PagerAdapter{  
  
          
        @Override  
        public int getCount() {  
            return mListViews.size();  
        }  
  
        /** 
         * 从指定的position创建page 
         * 
         * @param container ViewPager容器 
         * @param position The page position to be instantiated. 
         * @return 返回指定position的page,这里不需要是一个view,也可以是其他的视图容器. 
         */  
        @Override  
        public Object instantiateItem(View collection, int position) {  
  
              
            ((ViewPager) collection).addView(mListViews.get(position),0);  
              
            return mListViews.get(position);  
        }  
  
        /** 
         * <span >从指定的position销毁page</span> 
         *  
         *  
         *<span >参数同上</span> 
         */  
        @Override  
        public void destroyItem(View collection, int position, Object view) {  
            ((ViewPager) collection).removeView(mListViews.get(position));  
        }  
  
          
          
        @Override  
        public boolean isViewFromObject(View view, Object object) {  
            return view==(object);  
        }  
  
        @Override  
        public void finishUpdate(View arg0) {}  
          
  
        @Override  
        public void restoreState(Parcelable arg0, ClassLoader arg1) {}  
  
        @Override  
        public Parcelable saveState() {  
            return null;  
        }  
  
        @Override  
        public void startUpdate(View arg0) {}  
          
    }  
      
      
}  

就这样,我们可以很容易就实现左右两个屏幕之间的切换。具体页面到内容就靠大家去发挥了!

 
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息