android仿制应用宝的应用详情页

最近看到了应用宝的软件详情页，感觉不明觉厉的样子，

于是粗略的仿制了一下，发现做的还算是可以出来见人吧

实现方法很简单，就是通过重写ScrollView的分发事件，详情请看代码。

public class MultiScrollView extends ScrollView{

    Scroller mScroller;
    ViewGroup mChid;
    private Toolbar mToolbar;
    View destineView;
    View firstChid;
    View secondChid;
    View thirdChid;
    float startY;


    public MultiScrollView(Context context) {
        this(context,null,0);
    }

    public MultiScrollView(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public MultiScrollView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        mScroller = new Scroller(context);
    }


    //设置toolbar
    public void setToolbar(Toolbar toolbar){
        this.mToolbar = toolbar;
    }
    //设置listview,
    public void setDestineView(View view){
        this.destineView = view;
    }

    @Override
    protected void onLayout(boolean changed, int l, int t, int r, int b) {
        super.onLayout(changed, l, t, r, b);
        mChid = (ViewGroup) getChildAt(0);
        //判断scrollview是否有三个孙view,是的话将第三个（默认认为是listview）调整高度
        if(mChid != null && mChid.getChildCount() == 3 && (getHeight() - mChid.getChildAt(1).getMeasuredHeight() != mChid.getChildAt(2).getMeasuredHeight())){

            firstChid = mChid.getChildAt(0);
            secondChid = mChid.getChildAt(1);
            thirdChid = mChid.getChildAt(2);
            //listview高度调整为listview高度＋导航条高度＋toolbar高度 = scrollview高度(getHeight),这样scrollview最多刚好滚动到除了导航条＋toolbar，其余的都是listview
            int listviewHeight = getHeight() - secondChid.getMeasuredHeight() - (mToolbar == null ?  0 : mToolbar.getMeasuredHeight());
            thirdChid.setLayoutParams(new LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, listviewHeight));
        }
    }

    @Override
    protected void onScrollChanged(int l, int t, int oldl, int oldt) {
        super.onScrollChanged(l, t, oldl, oldt);
        //设置背景颜色渐变
        if(mToolbar!= null && firstChid != null){
            int alpha = t * 255/ (firstChid.getMeasuredHeight()/2) ;
            mToolbar.getBackground().setAlpha(Math.min(255,alpha));
        }
    }

    //父类Scrollview在onInterceptTouchEvent实现滑动逻辑，故重写此方法
    @Override
    public boolean onInterceptTouchEvent(MotionEvent ev) {

        if(destineView == null || mChid == null || mChid.getChildCount() != 3){
            return super.onInterceptTouchEvent(ev);
        }

        //listview可向上滚动,将点击事件分发给listview
        if(destineView.canScrollVertically(-1)){
            return false;
        }

        switch (ev.getAction()){
            case MotionEvent.ACTION_DOWN:
                startY = ev.getY();
                break;
            case MotionEvent.ACTION_MOVE:
                float offsetY = ev.getY() - startY;

                //向下滚动
                if(offsetY < 0){
                    //scrollview刚好滚动到除了导航条＋toolbar，其余的都是listview的时候，在向下滚动的时候就滚动listview，
                    // 注意getScrollY不会随着touch move而改变，滚动的时候getScrollY()一直保持不变;所以你从其他位置滚动到临界值的时候不会分发事件，从临界值再次滚动是才会符合条件
                    if(getScrollY() >= mChid.getChildAt(0).getMeasuredHeight()-(mToolbar == null ? 0 : mToolbar.getMeasuredHeight())){
                        return false;
                    }
                }
                //向上滚动
                else if(offsetY > 0){
                    //listview滚动到头了，再向上滚动，会自动滚动到scrollview顶部(0,0);
                    if(getScrollY() == firstChid.getMeasuredHeight()-(mToolbar == null ? 0 : mToolbar.getMeasuredHeight())){
                        //缓慢的滚动到顶部^^^^^^
                        mScroller.startScroll(0,getScrollY(),0,-getScrollY(),1000);
                    }
                }
                break;
        }
        return super.onInterceptTouchEvent(ev);
    }

    @Override
    public void computeScroll() {
        if(mScroller.computeScrollOffset()){
            int currY = mScroller.getCurrY();
            scrollTo(0,currY);
            invalidate();
        }
    }
}

上面Scrollview，我将他的孙view定为3个，第一个view算是banner页，第二个是导航条，第三个是包裹listview的viewpager,因为scrollview下的listview设置高度有点蛋疼，所以就在onLayout中设置它的高度，最终的第三个view的高度为scrollview的高度减去toolbar和导航栏的高度。
然后在onInterceptTouchEvent处理事件，返回false时将事件交给它的子控件处理，大体就是这一些逻辑，

对布局文件有一些要求，要求只能用三个孙控件，布局文件有一点需要小注意

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context="com.example.tian.myapplication.listview.Main2Activity">

    <com.example.tian.myapplication.github.MultiScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/scrollView">

        <!--android:focusable="true"
            android:focusableInTouchMode="true"
            这里添加这两个，否则scrollview初始化完会自动滚动到viewpager那里-->
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:focusable="true"
            android:focusableInTouchMode="true"
            android:orientation="vertical">
            <!--三层三层三层三层三层三层三层三层三层三层三层 view-->
            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="200dp"
                android:background="#28c8f4">

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:src="@drawable/ic_launcher"
                    android:id="@+id/imageview"
                    android:layout_centerInParent="true"/>

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_below="@id/imageview"
                    android:layout_marginTop="10dp"
                    android:text="HELLO WOELD"
                    android:textSize="20sp"
                    android:textColor="#ff0000"
                    android:layout_centerHorizontal="true"/>

            </RelativeLayout>

            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content">
                <android.support.design.widget.TabLayout
                    xmlns:app="http://schemas.android.com/apk/res-auto"
                    android:id="@+id/tablayout"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    app:tabTextColor="#1bccef"/>
            </RelativeLayout>

            <android.support.v4.view.ViewPager
                android:layout_width="match_parent"
                android:layout_height="300dp"
                android:background="#777777"
                android:id="@+id/viewPager"/>

        </LinearLayout>

    </com.example.tian.myapplication.github.MultiScrollView>

    <android.support.v7.widget.Toolbar
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/toolbar"
        android:layout_height="50dp"
        android:minHeight="50dp"
        android:layout_width="match_parent"
        android:background="#fe6d18"

        />

</RelativeLayout>

最后附上一些微不住道的代码
http://download.csdn.net/detail/recall2012/9402757