滚动视图（View）的设计与实现代码

在基于Android的应用软件设计时，常常会希望实现以下界面视图___________________________
|             头部导航区域（导航栏）         |
|__________________________||                                                            |
|                                                            |
|                                                            |
|       视图左右滚动区域                     |
|          （可以左右拖动滚动）               |
|                                                            |
|                                                            |
__________________________|                                                           |
|         底部设置菜单按钮（菜单栏）   |__________________________
闲话少说，直接上核心代码。一）main.xml布局文件<？xml version="1.0" encoding="UTF-8"？>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:layout_width="fill_parent"
              android:layout_height="fill_parent"
              android:orientation="vertical">

   <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                  android:id="@+id/view_top"
                  android:orientation="horizontal"
                  android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:layout_alignParentTop="true"
                  android:gravity="center">

       <TextView android:text="导航栏"
           android:textSize="15pt"
           android:layout_width="fill_parent"
           android:layout_height="wrap_content"/>
   </RelativeLayout>

    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                  android:id="@+id/view_bottom"
                  android:orientation="horizontal"
                  android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:layout_alignParentBottom="true"
                  android:gravity="center">
        <TextView android:text="菜单栏"
            android:textSize="15pt"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"/>
    </RelativeLayout>

   <com.xxxxx.ui.ScrollLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/ScrollLayoutID"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical"
        android:layout_above="@id/view_bottom"
        android:layout_below="@id/view_top">

        <LinearLayout android:background="#FF0000"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent">

             <Button android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Left"/>
        </LinearLayout>

        <LinearLayout android:background="#00FF00"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent">

            <Button android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Center"/>
        </LinearLayout>

        <LinearLayout android:background="#0000FF"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content">

                <Button android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Right"/>
        </LinearLayout>
   </com.lucent.ui.ScrollLayout>

</RelativeLayout>

二）中间实现可以左右滑动的视图，也就是说中间部分可以根据用户的左右拖动操作显示不同的View内容，实现视图View的左右滑动。（此类和代码来自于Internet）。package com.xxxxx.ui;

import android.content.Context;
import android.util.AttributeSet;
import android.util.Log;
import android.view.MotionEvent;
import android.view.VelocityTracker;
import android.view.View;
import android.view.ViewConfiguration;
import android.view.ViewGroup;
import android.widget.Scroller;

/**
* 仿Launcher中的WorkSapce，可以左右滑动切换屏幕的类
*/
public class ScrollLayout extends ViewGroup {
    private static final String TAG = "ScrollLayout";
    private Scroller mScroller = null;
    private VelocityTracker mVelocityTracker = null;

    private int mCurScreen = 0;
    private int mDefaultScreen = 1;

    private static final int TOUCH_STATE_REST = 0;
    private static final int TOUCH_STATE_SCROLLING = 1;

    private static final int SNAP_VELOCITY = 600;

    private int mTouchState = TOUCH_STATE_REST;
    private int mTouchSlop = 0;
    private float mLastMotionX = 0;
    private float mLastMotionY = 0;

    public ScrollLayout（Context context, AttributeSet attrs） {
        this（context, attrs, 0）;
    }

    public ScrollLayout（Context context, AttributeSet attrs, int defStyle） {
        super（context, attrs, defStyle）;

        mScroller = new Scroller（context）;

        mCurScreen = mDefaultScreen;
        mTouchSlop = ViewConfiguration.get（getContext（））.getScaledTouchSlop（）;
    }

    @Override
    protected void onLayout（boolean changed, int l, int t, int r, int b） {
        // TODO Auto-generated method stub
        if （changed） {
            int childLeft = 0;
            final int childCount = getChildCount（）;

            for （int i=0; i<childCount; i++） {
                final View childView = getChildAt（i）;
                if （childView.getVisibility（）！= View.GONE） {
                    final int childWidth = childView.getMeasuredWidth（）;
                    childView.layout（childLeft, 0,
                            childLeft+childWidth, childView.getMeasuredHeight（））;
                    childLeft += childWidth;
                }
            }
        }
    }

    @Override
    protected void onMeasure（int widthMeasureSpec, int heightMeasureSpec） {
        Log.e（TAG, "onMeasure"）;
        super.onMeasure（widthMeasureSpec, heightMeasureSpec）;

        final int width = MeasureSpec.getSize（widthMeasureSpec）;
        final int widthMode = MeasureSpec.getMode（widthMeasureSpec）;
        if （widthMode ！= MeasureSpec.EXACTLY） {
            throw new IllegalStateException（"ScrollLayout only can run at EXACTLY mode！"）;
        }

        final int heightMode = MeasureSpec.getMode（heightMeasureSpec）;
        if （heightMode ！= MeasureSpec.EXACTLY） {
            throw new IllegalStateException（"ScrollLayout only can run at EXACTLY mode！"）;
        }

        // The children are given the same width and height as the scrollLayout
        final int count = getChildCount（）;
        for （int i = 0; i < count; i++） {
            getChildAt（i）.measure（widthMeasureSpec, heightMeasureSpec）;
        }
        // Log.e（TAG, "moving to screen "+mCurScreen）;
        scrollTo（mCurScreen * width, 0）;
    }

    /**
     * According to the position of current layout
     * scroll to the destination page.
     */
    public void snapToDestination（） {
        final int screenWidth = getWidth（）;
        final int destScreen = （getScrollX（）+ screenWidth/2）/screenWidth;
        snapToScreen（destScreen）;
    }

    public void snapToScreen（int whichScreen） {
        // get the valid layout page
        whichScreen = Math.max（0, Math.min（whichScreen, getChildCount（）-1））;
        if （getScrollX（）！= （whichScreen * getWidth（））） {

            final int delta = whichScreen*getWidth（）-getScrollX（）;
            mScroller.startScroll（getScrollX（）, 0,
                    delta, 0, Math.abs（delta）*2）;
            mCurScreen = whichScreen;
            invalidate（）;       // Redraw the layout
        }
    }

    public void setToScreen（int whichScreen） {
        whichScreen = Math.max（0, Math.min（whichScreen, getChildCount（）-1））;
        mCurScreen = whichScreen;
        scrollTo（whichScreen*getWidth（）, 0）;
    }

    public int getCurScreen（） {
        return mCurScreen;
    }

    @Override
    public void computeScroll（） {
        if （mScroller.computeScrollOffset（）） {
            scrollTo（mScroller.getCurrX（）, mScroller.getCurrY（））;
            postInvalidate（）;
        }
    }

    @Override
    public boolean onTouchEvent（MotionEvent event） {
        if （mVelocityTracker == null） {
            mVelocityTracker = VelocityTracker.obtain（）;
        }
        mVelocityTracker.addMovement（event）;

        final int action = event.getAction（）;
        final float x = event.getX（）;
        final float y = event.getY（）;

        switch （action） {
            case MotionEvent.ACTION_DOWN:
                Log.e（TAG, "event down！"）;
                if （！mScroller.isFinished（））{
                    mScroller.abortAnimation（）;
                }
                mLastMotionX = x;
                break;

            case MotionEvent.ACTION_MOVE:
                int deltaX = （int）（mLastMotionX - x）;
                mLastMotionX = x;

                scrollBy（deltaX, 0）;
                break;

            case MotionEvent.ACTION_UP:
                Log.e（TAG, "event : up"）;
                // if （mTouchState == TOUCH_STATE_SCROLLING） {
                final VelocityTracker velocityTracker = mVelocityTracker;
                velocityTracker.computeCurrentVelocity（1000）;
                int velocityX = （int） velocityTracker.getXVelocity（）;
                Log.e（TAG, "velocityX:"+velocityX）;

                if （velocityX > SNAP_VELOCITY && mCurScreen > 0） {
                    // Fling enough to move left
                    Log.e（TAG, "snap left"）;
                    snapToScreen（mCurScreen - 1）;
                } else if （velocityX < -SNAP_VELOCITY
                        && mCurScreen < getChildCount（） - 1） {
                    // Fling enough to move right
                    Log.e（TAG, "snap right"）;
                    snapToScreen（mCurScreen + 1）;
                } else {
                    snapToDestination（）;
                }
                if （mVelocityTracker ！= null） {
                    mVelocityTracker.recycle（）;
                    mVelocityTracker = null;
                }
                // }
                mTouchState = TOUCH_STATE_REST;
                break;
            case MotionEvent.ACTION_CANCEL:
                mTouchState = TOUCH_STATE_REST;
                break;
        }

        return true;
    }


    @Override
    public boolean onInterceptTouchEvent（MotionEvent ev） {
        Log.e（TAG, "onInterceptTouchEvent-slop:"+mTouchSlop）;

        final int action = ev.getAction（）;
        if （（action == MotionEvent.ACTION_MOVE） &&
                （mTouchState ！= TOUCH_STATE_REST）） {
            return true;
        }

        final float x = ev.getX（）;
        final float y = ev.getY（）;

        switch （action） {
            case MotionEvent.ACTION_MOVE:
                final int xDiff = （int）Math.abs（mLastMotionX-x）;
                if （xDiff>mTouchSlop） {
                    mTouchState = TOUCH_STATE_SCROLLING;

                }
                break;

            case MotionEvent.ACTION_DOWN:
                mLastMotionX = x;
                mLastMotionY = y;
                mTouchState = mScroller.isFinished（）？ TOUCH_STATE_REST : TOUCH_STATE_SCROLLING;
                break;

            case MotionEvent.ACTION_CANCEL:
            case MotionEvent.ACTION_UP:
                mTouchState = TOUCH_STATE_REST;
                break;
        }

        return mTouchState ！= TOUCH_STATE_REST;
    }

}