NestedScrollview使用---优雅的代替ScrollView内嵌ListView或者RecyclerView

以前,在开发中,类似商品详情这样的页面,首页这样的页面,拿商品详情页面来说,有这么一个特点:

1. 订单中的商品以列表的形式存在,那就需要使用ListView或者RecyclerView
2. 订单以外的内容(一般在商品上边或者商品下边),内容多的话需要滚动

一般的做法:

1. ScrollView内嵌ListView或者RecyclerView,内嵌的ListView或者RecyclerView一般
    需要重写onMeasure,把listView撑到最大，等于是没有复用listItem也屏蔽了Listview的滚动
2.将订单的相关信息分别当做头布局和脚布局 总觉得多创建了几个布局文件不太好
3.RecyclerView+MultiTypeAdapter虽然可以实现复杂布局,但是感觉有点大材小用

…
下面介绍一种方式,可以优雅的解决这一问题——NestedScrollview
NestedScrollview是support-v4包提供的控件,继承至FrameLayout,
并实现了NestedScrollingParent,NestedScrollingChild, ScrollingView接口.
它的作用类似于android.widget.ScrollView,不同点在于NestedScrollView支持嵌套滑动.

使用:
1.导入VecycleView,support:design

compile 'com.android.support:design:26.1.0'
implementation 'com.android.support:recyclerview-v7:26.0.0-alpha1'

2.在布局文件中使用

     <android.support.v4.widget.NestedScrollView
        android:id="@+id/scrollView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:focusable="true"
        android:focusableInTouchMode="true"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="顶部标题" />

            <TextView
                android:layout_width="match_parent"
                android:layout_height="50dp"
                android:gravity="center"
                android:text="内容1" />

            <android.support.v7.widget.RecyclerView
                android:id="@+id/recyclerView"
                android:layout_width="match_parent"
                android:layout_height="wrap_content">

            </android.support.v7.widget.RecyclerView>

            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:src="@mipmap/pic8" />
        </LinearLayout>
    </android.support.v4.widget.NestedScrollView>

注意: NestedScrollView中的 android:focusable="true" android:focusableInTouchMode="true"
是为了解决NestedScrollView中嵌套其他布局和RecyclerView后,不会滚动到屏幕顶部

2.MainActivity中

 @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        RecyclerView recyclerView = findViewById(R.id.recyclerView);
        LinearLayoutManager manager = new LinearLayoutManager(this);
        manager.setOrientation(LinearLayoutManager.VERTICAL);
        recyclerView.setLayoutManager(manager);
        recyclerView.addItemDecoration(new DividerItemDecoration(this, 1));
        recyclerView.setAdapter(new MyAdapter());

        recyclerView.setNestedScrollingEnabled(false);//解决卡顿
    }

    class MyAdapter extends RecyclerView.Adapter<MyViewHolder> {
        @Override
        public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
            return new MyViewHolder(LayoutInflater.from(MainActivity.this).inflate(R.layout.item_recyclerview, null));
        }

        @Override
        public void onBindViewHolder(MyViewHolder holder, int position) {
            holder.text.setText("position=" + position);
        }

        @Override
        public int getItemCount() {
            return 10;
        }
    }

    class MyViewHolder extends RecyclerView.ViewHolder {
        private TextView text;

        public MyViewHolder(View itemView) {
            super(itemView);
            text = itemView.findViewById(R.id.text);
        }
    }

注意: recyclerView.setNestedScrollingEnabled(false);是为了解决滑动卡顿(RecycleView滑动惯性消失)问题

3.item布局

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="center_vertical"
    android:orientation="horizontal">

    <ImageView
        android:layout_width="250dp"
        android:layout_height="250dp"
        android:src="@mipmap/pic11" />

    <TextView
        android:id="@+id/text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
</LinearLayout>

浏览下效果:

点击这里下载源码