利用com.graphics.Camera 模拟ViewPager布局3D效果

学习了很多自定义View的知识，终于有勇气自己写一个Demo的勇气了，还是要多实践啊！！！！！！！！！

记得在AndroidManifest.xml中关闭硬件加速!!!!!!!

android:hardwareAccelerated="false"

• 需要掌握的内容：坐标系等基础知识，View的绘制过程，画布的操作，Matrix原理，Matrix Camera原理，事件分发机制等。
  这里我推荐一个网站，里面的内容很丰富也很有趣
  http://www.gcssloop.com/customview/CustomViewIndex

• 下面介绍如何开始下笔！！！
  首先我们要创建一个类，并继承ViewGroup，规定一些变量，用途都在注释里写了，还有构造函数

    public enum State {        ToPre, ToNext    }    private State state;//标记滚动的状态    private int mWidth, mHeight;//ViewGroup的宽高    private float mDownX, mMoveX = 0;//按下的坐标和移动时的坐标    private VelocityTracker mVelocityTracker;//测速    private float mAngle = 90;//两个item间的夹角    private int standerSpeed = 200;//规定的手指移动速率    private int a = -2500;//阻力    private Scroller mScroller;    private Camera mCamera;    private Matrix mMatrix;    private boolean flag = false;//标记是否在增加view    public MyView(Context context){        this(context, null);    }    public MyView(Context context, AttributeSet attributeSet){        super(context, attributeSet);        //这是一个滚动计算器，可以计算出滚动一段距离的中间过程        mScroller = new Scroller(context);        mCamera = new Camera();        mMatrix = new Matrix();    }

然后就是onLayout onMeasure方法

@Override    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {        super.onMeasure(widthMeasureSpec, heightMeasureSpec);        measureChildren(widthMeasureSpec, heightMeasureSpec);        mWidth = getMeasuredWidth();        mHeight = getMeasuredHeight();    }    @Override    protected void onLayout(boolean changed, int l, int t, int r, int b) {        int childLeft = 0;        //因为一个ViewGroup里有很多个子布局，这些都在布局文件里写好的，不懂的可以看看源码        for (int i = 0; i < getChildCount(); i++) {            View child = getChildAt(i);            if (child.getVisibility() == VISIBLE) {                child.layout(childLeft,                        0,                        childLeft + child.getMeasuredWidth(),                        child.getMeasuredHeight());                childLeft = childLeft + child.getMeasuredWidth();            }        }    }

下面开始重头戏，根据手指移动的距离，使ViewGroup滚动起来

@Override    public boolean onTouchEvent(MotionEvent event) {        //创建一个速度计算器，可以计算出手指移动时的速率        if (mVelocityTracker == null) {            mVelocityTracker = VelocityTracker.obtain();        }        //将这个事件添加到速度计算器中        mVelocityTracker.addMovement(event);        //当事件是移动时        if (event.getAction() == MotionEvent.ACTION_MOVE){            //拿到当前的坐标x            float x = event.getX();            //用之前记录的值减去x，得到移动的距离            int tempX = (int)(mDownX - x);            //将当前的x记录下来            mDownX = x;            //根据移动的距离tempX滚动ViewGroup            scrollBy(tempX, 0);            //根据距离判断首尾view的添加,保证循环滚动            changeView();        }else if(event.getAction() == MotionEvent.ACTION_DOWN){            //如果事件是按下，记录当前按下的坐标x            mDownX = event.getX();        }else if(event.getAction() == MotionEvent.ACTION_UP){            //通过一个速率的单位计算速率的值            mVelocityTracker.computeCurrentVelocity(1000);            //往左滑小于0   往右滑大于0            float xVelocity = mVelocityTracker.getXVelocity();            //滑动的速度大于规定的速度时,开始自动减速滑动直至静止            if (xVelocity > standerSpeed) {                //往前翻滚                state = State.ToPre;                //根据重力加速度计算需要滑动的路程                float s = xVelocity * (-xVelocity / a) / 2;                //计算需要滑动的时间                int t = (int) (-xVelocity / a * 2000);                //开始计算滑动过程                mScroller.startScroll(0, 0, (int) s, 0, t);            }else if(xVelocity < -standerSpeed){                //往后翻滚                state = State.ToNext;                //根据重力加速度计算需要滑动的路程                //消掉速度的单位                xVelocity = -xVelocity;                float s = xVelocity * (-xVelocity / a) / 2;                //计算需要滑动的时间                int t = (int) (-xVelocity / a * 2000);                //开始计算滑动过程                mScroller.startScroll(0, 0, (int) s, 0, t);            }        }        return true;    }    /**     * 这个方法主要是用来在手指抬起后，计算ViewGroup还要再继续滚动多远     */    @Override    public void computeScroll() {        //当滚动计算器还在计算时，并且现在没有在改变子View的位置        if (mScroller.computeScrollOffset() && flag == false) {            if (state == State.ToPre) {                //拿到滚动计算器计算出的值,并与上一次的值相减，得出应该滚动的距离                int tempX = (int) (mScroller.getCurrX() - mMoveX);                //将当前的值记录下来                mMoveX = mScroller.getCurrX();                //使ViewGroup滚动-tempX的距离，注意正负方向                scrollBy(-tempX, 0);            }else if(state == State.ToNext){                //拿到滚动计算器计算出的值,并与上一次的值相减，得出应该滚动的距离                int tempX = (int) (mScroller.getCurrX() - mMoveX);                //将当前的值记录下来                mMoveX = mScroller.getCurrX();                //使ViewGroup滚动tempX的距离，注意正负方向                scrollBy(tempX, 0);            }            //刷新界面            invalidate();        }        //当这一次自动计算结束时，给mMoveX清零        if(mScroller.isFinished())            mMoveX = 0;        //判断一下是否需要在首尾添加界面        changeView();    }    /**     * 当超过规定位置时,增加首尾的页数,达到拼接的效果     */    private void changeView(){        if (getScrollX() < 20){            addPre();            LogUtil.d("TAG", "前面加了一页");        }else if(getScrollX() > (getChildCount() - 1) * mWidth - 20){            addNext();            LogUtil.d("TAG", "后面加了一页");        }    }    /**     * 把第一个item移动到最后一个item位置     */    private void addNext() {        int childCount = getChildCount();        View view = getChildAt(0);        removeViewAt(0);        addView(view, childCount - 1);        scrollBy(-mWidth, 0);    }    /**     * 把最后一个item移动到第一个item位置     */    private void addPre() {        int childCount = getChildCount();        View view = getChildAt(childCount - 1);        flag = true;        removeViewAt(childCount - 1);        addView(view, 0);        scrollBy(mWidth, 0);        flag = false;    }

这时已经实现了循环的左右平移，想要实现3D的效果还需要下面的步骤

    /**     * 在ViewGroup中需要重写这个方法     */    @Override    protected void dispatchDraw(Canvas canvas) {        //遍历子View,并画出来        for (int i = 0; i < getChildCount(); i++) {            //画3D的方法            drawScreen(canvas, i, getDrawingTime());        }        //如果不想要3D效果只想实现平移,注释掉上面的代码,开启下面的代码即可//        super.dispatchDraw(canvas);    }    /**     * 画3D效果     */    private void drawScreen(Canvas canvas, int i, long drawingTime){        int curScreenX = mWidth * i;        //屏幕中不显示的部分不进行绘制        if (getScrollX() + mWidth < curScreenX) {            return;        }        if (curScreenX < getScrollX() - mWidth) {            return;        }        //计算中心坐标        float centerX = (getScrollX() > curScreenX) ? curScreenX + mWidth : curScreenX;        float centerY = mHeight / 2;        //计算角度        float degree = mAngle * (getScrollX() - curScreenX) / mWidth;        if (degree > 90 || degree < -90) {            return;        }        canvas.save();        //利用Camera进行一次旋转拍照        mCamera.save();        mCamera.rotateY(-degree);        //并将结果保存在Matrix矩阵中        mCamera.getMatrix(mMatrix);        mCamera.restore();        //将矩阵移动到视图中心位置        mMatrix.preTranslate(-centerX, -centerY);        mMatrix.postTranslate(centerX, centerY);        //将矩阵设置到画布上        canvas.concat(mMatrix);        //画子View        drawChild(canvas, getChildAt(i), drawingTime);        canvas.restore();    }

现在已经可以实现3D的效果了，实现的过程我写了很清楚的注释。主要实现3D的效果还是靠Camera和Matrix类，具体的原理还是需要自己去研究了。

源码：https://github.com/Techck/3DFlipViewPager