不用ViewPager和Fragment实现滑动页面的效果

这是一篇被逼出来的文章。
一入SDK深似海，从此jar包是路人，没错，你以为我愿意不用ViewPager和Fragment啊，因为SDK为了减少包体大小不能用v4的包啊！坑爹的v4包居然有1M多，你们可真能写啊。我相信一定有朋友会建议说，把v4包里相关的类抠出来用啊，呵呵哒，祝你抠的愉快。

言归正传，ViewPager和Fragment那是一套相当庞大的界面框架，想要自己实现一个功能相似且能完美的控制内存和界面生命周期，短期单人几乎是不可能完成的任务，我们只能退而求其次，把底层复杂的逻辑都剥离，再保证没有内存泄漏的情况下，实现界面上看起来相似的功能。大概分析一下滑动界面的需求，抽象出来看就是有N个宽度和屏幕宽度（或者window宽度）一样的界面排排坐，当用户滑动的时候不是缓缓过度到下一个页面，而是有一个弹性效果直接到达下一个页面，每一个页面的容器就是Fragment，而N个页面的容器，就是ViewPager，ViewPager的容器就是我们的Activity。
理解了这个，我们就可以考虑用其他容器来代替ViewPager和Fragment了，横向滑动的第一选择当然是HorizontalScrollView，而Fragment和PageAdapter只能我们自己来实现了，本质就是个View。
直接上代码，先自定义一个HorizontalScrollView来实现ViewPager的功能：

/** *  * @author Amuro *  */public class ScrollViewPager extends HorizontalScrollView{    public interface OnPageChangedListener    {        void onChange(int index);    }    private OnPageChangedListener listener;    public void setOnPageChangedListener(OnPageChangedListener listener)    {        this.listener = listener;    }    private void notifyPageChanged()    {        if (lastPage != currentPage)        {            lastPage = currentPage;            if (listener != null)            {                listener.onChange(currentPage);            }        }    }    private int subChildCount = 0;    private int downX = 0;    private int lastPage = 0;    private int currentPage = 0;    private ArrayList<Integer> pointList = new ArrayList<Integer>();    public ScrollViewPager(Context context, AttributeSet attrs, int defStyle)    {        super(context, attrs, defStyle);        init();    }    public ScrollViewPager(Context context, AttributeSet attrs)    {        super(context, attrs);        init();    }    public ScrollViewPager(Context context)    {        super(context);        init();    }    private GestureDetector mGestureDetector;     private void init()    {        setHorizontalScrollBarEnabled(false);        mGestureDetector = new GestureDetector(getContext(), new HScrollDetector());     }    // Return false if we're scrolling in the y direction       class HScrollDetector extends SimpleOnGestureListener    {        @Override        public boolean onScroll(MotionEvent e1, MotionEvent e2,                float distanceX, float distanceY)        {            if (Math.abs(distanceX) > Math.abs(distanceY))            {                return true;            }            return false;        }    }    @Override    public boolean onInterceptTouchEvent(MotionEvent ev)    {        switch (ev.getAction())        {        case MotionEvent.ACTION_DOWN:            downX = (int) ev.getX();            break;        }        return super.onInterceptTouchEvent(ev) && mGestureDetector.onTouchEvent(ev);    }    @Override    public boolean onTouchEvent(MotionEvent ev)    {        switch (ev.getAction())        {//      case MotionEvent.ACTION_DOWN://          downX = (int) ev.getX();//          break;        case MotionEvent.ACTION_MOVE:            break;        case MotionEvent.ACTION_UP:        case MotionEvent.ACTION_CANCEL:        {            if (Math.abs((ev.getX() - downX)) > getWidth() / 4)            {                if (ev.getX() - downX > 0)                {                    smoothScrollToPrePage();                }                else                {                    smoothScrollToNextPage();                }                notifyPageChanged();            }            else            {                smoothScrollToCurrent();            }            return true;        }        }        return super.onTouchEvent(ev);    }    private void smoothScrollToCurrent()    {        smoothScrollTo(pointList.get(currentPage), 0);    }    private void smoothScrollToNextPage()    {        if (currentPage < subChildCount - 1)        {            currentPage++;            smoothScrollTo(pointList.get(currentPage), 0);        }    }    private void smoothScrollToPrePage()    {        if (currentPage > 0)        {            currentPage--;            smoothScrollTo(pointList.get(currentPage), 0);        }    }    public boolean gotoPage(int page)    {        if (page > 0 && page < subChildCount - 1)        {            smoothScrollTo(pointList.get(page), 0);            currentPage = page;            notifyPageChanged();            return true;        }        return false;    }    public void setAdapter(PagerAdapter<?> adapter)    {        LinearLayout container = (LinearLayout) this.getChildAt(0);        adapter.setContainer(container);        adapter.notifyDatasetChanged();        // receiveChildInfo();        subChildCount = adapter.getCount();        for (int i = 0; i < subChildCount; i++)        {            pointList.add(0 + Constants.HOME_VIEW_WIDTH * i);        }    }}

核心代码在onTouchEvent方法里，熟悉安卓触摸事件并了解下拉刷新原理的童鞋应该一看就懂的代码，就不赘述了，无非就是判断用户手势在横向上的滑动距离，当超过一定距离就认为用户是主动滑动到下一页，通过scoller帮助用户来实现这个滑动的弹性效果。
这里我们用到了GestureDetector这个类，目的是为了解决滑动冲突的问题，后面我会再单独安排文章讲这个事儿，这里先不表。

有了“ViewPager”，下面就是Fragment了，我们先定义一个接口：

public interface IViewController{    View getView();    void create();    void onShow();}

其实Fragment的本质就是一个View控制器，为了简单，这里就写几个主要的回调了。然后Fragment和ViewPager直接的黏合剂PageAdapter我们也仿照着写一个

public abstract class PagerAdapter<T>{    protected List<T> pages;    protected ViewGroup container;    public PagerAdapter(List<T> pages)    {        this.pages = pages;    }    protected void setContainer(ViewGroup container)    {        this.container = container;    }    public abstract int getCount();    public abstract void notifyDatasetChanged();    protected abstract T instantiateItem(int positioin);}

其中container就是我们设置的父容器，一般情况下都是ViewPager，第二个方法大家一看就知道不用多说，第三个方法是给子类初始化具体的fragment来用的，好，针对我们的ViewController，我们来扩展这个类：

package cn.cmgame2_0.launch_model.shortcut.main;import java.util.List;import cn.cmgame2_0.launch_model.shortcut.main.V.base.IViewController;import cn.cmgame2_0.utils.custom_view.PagerAdapter;public class HomeViewPageAdapter extends PagerAdapter<IViewController>{    public HomeViewPageAdapter(List<IViewController> pages)    {        super(pages);    }    @Override    public int getCount()    {        return pages.size();    }    @Override    protected IViewController instantiateItem(int positioin)    {        IViewController vc = pages.get(positioin);        container.addView(vc.getView());        return vc;    }    @Override    public void notifyDatasetChanged()    {        container.removeAllViews();        for(int i = 0; i < getCount(); i++)        {            instantiateItem(i);        }    }}

这里再回去看一下上面自定义HorizontalScrollView的setAdapter方法，其实就把ViewPager中的根布局作为container传给Adapter，然后adapter中会把设定好的ViewController所有view添加到container中。
好，容器和适配器都有了，下面我们根据我们的界面需求去添加具体的ViewController就行了，贴一个例子：

public class RecommendViewController extends ShortcutViewController implements RecommendV{    private RecommendPresenter presenter;    private long lastRefreshTime = 0;    public RecommendViewController(Context context)    {        super(context);    }    private GridView gridViewInstalled;    private InstalledAdapter installedAdapter;    private GridView gridViewRecommend;    private RecommendAdapter recommendAdapter;    private Button buttonRefresh;    private ProgressDialog progressDialog;    @Override    public void create()    {        presenter = new RecommendPresenter(this);        rootView = new RecommendView(context);        initView();    }    private void initView()    {        gridViewInstalled = (GridView)findViewById(RecommendView.id_gv_installed);        gridViewRecommend = (GridView)findViewById(RecommendView.id_gv_recommend);        buttonRefresh = (Button)findViewById(RecommendView.id_bt_refresh);        progressDialog = DialogUtils.getProgressDialog(context);        installedAdapter = new InstalledAdapter(context, presenter.getInstalledGames());        gridViewInstalled.setAdapter(installedAdapter);        gridViewInstalled.setOnItemClickListener(new OnItemClickListener()        {            @Override            public void onItemClick(AdapterView<?> parent, View view,                    int position, long id)            {            }        });        recommendAdapter = new RecommendAdapter(context, presenter.getRecommendGames());        gridViewRecommend.setAdapter(recommendAdapter);        buttonRefresh.setOnClickListener(new OnClickListener()        {            @Override            public void onClick(View v)            {            }        });    }    @Override    public void onShow()    {    }    @Override    public void showLoading()    {        progressDialog.show();    }    @Override    public void hideLoading()    {        progressDialog.dismiss();    }    @Override    public void onError(String errorCode, String errorMsg)    {        ToastUtils.showToast(context, "");    }    @Override    public void onDataFetched(List<RecommendBean> data)    {        recommendAdapter.notifyDataSetChanged();    }    @Override    public Context getContext()    {        return context;    }}

删除了所有涉及公司业务的代码，不过大概框架各位也能看懂了，因为不能用xml来构建界面，这里还需要构建一套替代的框架，其实就是把所有View构建的代码拉出去独立成一个体系就好啦，很简单，不再赘述。眼尖的童鞋应该还看到了代码里的V和Presenter，没错，这里还尝试使用了最新的MVP架构来解耦界面控制与数据操作，后面再开新文章讲。

最后在Activity里把这些元素组织到一起就大功告成了：

private void initViewPager()    {        if(bean.collectionList == null || bean.collectionList.size() == 0)        {            pageCount = 1;        }        else        {            pageCount = bean.collectionList.size() + 1;        }        final List<IViewController> vcList = new ArrayList<IViewController>();        for(int i = 0; i < pageCount; i++)        {            IViewController vc = null;            if(i == 0)            {                vc = new RecommendViewController(this);                vc.create();            }            else            {                vc = new CollectionViewController(this, i - 1);                vc.create();            }            vcList.add(vc);        }        HomeViewPageAdapter adapter = new HomeViewPageAdapter(vcList);        viewPager.setAdapter(adapter);        viewPager.setOnPageChangedListener(new OnPageChangedListener()        {            @Override            public void onChange(int index)            {                indicatorManager.change(index);                vcList.get(index).onShow();            }        });    }

好的api就是要让使用者用起来和他最熟悉的一模一样，这也是每个写框架的童鞋要给自己最起码的要求。最后贴两张效果图：

再安利一下我大移动的咪咕游戏开放平台：
http://g.10086.cn/open/

就酱~