recycleview+NestedScrollView+vie

2017-07-05  本文已影响0人  庞哈哈哈12138

效果图:上面是轮播广告,下面是recycleview瀑布流

1499238222694.gif

首先说一下布局

<android.support.design.widget.CoordinatorLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <android.support.v4.widget.NestedScrollView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:descendantFocusability="blocksDescendants"
        android:fitsSystemWindows="true"
        android:fillViewport="true"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

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

    <com.daimajia.slider.library.SliderLayout
        android:id="@+id/slider"
        android:layout_width="match_parent"
        android:layout_height="200dp"
        />
 <android.support.v7.widget.RecyclerView
        android:id="@+id/recycleview"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

    </android.support.v7.widget.RecyclerView>
</LinearLayout>
    </android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>

要做到滑动效果并且和recycleview联动
1.添加头布局,可是很遗憾 recycleview并没有提供addheadview addfootview的方法,虽然没有提供,不过我们可以通过多条目recycleview 在adapter里 重新 getItemViewType方法添加多条目来增加头布局或脚布局
2.外面用可以滚动的控件包着,自己解决滑动冲突
这里没有ScrollView而是用5.0新出的 NestedScrollView
然后我们首先要写一个adapter继承recycleviewadapter,这里还有一点需要注意,就是recycleview虽然布局特别方便(这里说的是实现横向纵向列表或者瀑布流)但是并没有自带item点击事件,也就是我们写adapter要考虑到这一点,自己写个接口回调实现条目点击事件,感觉好坑爹啊啥也不带

Adapter代码:

package com.panghaha.it.mymusicplayerdemo;

import android.content.Context;
import android.support.v7.widget.CardView;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.StaggeredGridLayoutManager;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.TextView;

import java.util.List;

/***
 * ━━━━ Code is far away from ━━━━━━
 *     ()      ()
 *     ( )    ( )
 *     ( )    ( )
 *   ┏┛┻━━━┛┻┓
 *   ┃   ━   ┃
 *   ┃ ┳┛ ┗┳ ┃
 *   ┃   ┻   ┃
 *   ┗━┓   ┏━┛
 *     ┃   ┃
 *     ┃   ┗━━━┓
 *     ┃       ┣┓
 *     ┃       ┏┛
 *     ┗┓┓┏━┳┓┏┛
 *      ┃┫┫ ┃┫┫
 *      ┗┻┛ ┗┻┛
 * ━━━━ bug with the more protecting ━━━
 * <p/>
 * Created by PangHaHa12138 on 2017/7/3.
 */
public class MeiziAdapter extends RecyclerView.Adapter<MeiziAdapter.ViewHolder> implements View.OnClickListener{

    private List<meinv> mlist;

    private Context context;
    private static final int TYPE_HEADER = 0, TYPE_ITEM = 1, TYPE_FOOT = 2;
    private View headView;
    private View footView;
    private boolean isAddFoot = false;
    private boolean isAddHead = false;
    private int headViewSize = 0;
    private int footViewSize = 0;

    private OnItemClickListener mOnItemClickListener = null;



    public Context getContext() {
        return context;
    }

    public void setContext(Context context) {
        this.context = context;
    }

    public MeiziAdapter(List<meinv> list,Context context){

        this.mlist = list;
        this.context = context;
    }

    static class ViewHolder extends RecyclerView.ViewHolder {
        ImageView meizi;
        CardView cardView;
        TextView textView;
        public ViewHolder(View itemView) {
            super(itemView);
            cardView = (CardView) itemView;
            textView = (TextView) itemView.findViewById(R.id.hahtextt);
            meizi = (ImageView) itemView.findViewById(R.id.meizitu);
        }
    }


    @Override
    public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {

        View view = LayoutInflater.from(context).inflate(R.layout.recycleitem,parent,false);
        view.setOnClickListener(this);

        return new ViewHolder(view);
    }

    @Override
    public void onBindViewHolder(ViewHolder holder, int position) {

        meinv meinv = mlist.get(position);

                holder.meizi.setImageResource(meinv.getImageid());
                holder.textView.setText(meinv.getMsg());
        holder.itemView.setTag(position);

    }

    @Override
    public void onClick(View v) {
        if (mOnItemClickListener != null) {
            //注意这里使用getTag方法获取position
            mOnItemClickListener.onItemClick(v,(int)v.getTag());
        }
    }

    //define interface
    public static interface OnItemClickListener {
        void onItemClick(View view , int position);
    }

    public void setOnItemClickListener(OnItemClickListener listener) {
        this.mOnItemClickListener = listener;
    }

    

    @Override
    public int getItemCount() {

        return mlist.size();
    }
}

然后item布局外面用Cardview包着,这也是最常见的效果

<android.support.v7.widget.CardView
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="?android:attr/selectableItemBackground"
    android:clickable="true"
    android:focusable="true"
    android:layout_margin="5dp"
    app:cardCornerRadius="4dp">

    <LinearLayout
        android:orientation="vertical"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">
        <ImageView
            android:id="@+id/meizitu"
            android:src="@drawable/yutong1"
            android:layout_gravity="center_horizontal"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:adjustViewBounds="true"
            android:scaleType="centerCrop" />

        <TextView
            android:id="@+id/hahtextt"
            android:text="天王盖地虎"
            android:textSize="16sp"
            android:layout_gravity="center_horizontal"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />

    </LinearLayout>

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

在fragment使用

 public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container,
                             @Nullable Bundle savedInstanceState) {

        mview = inflater.inflate(R.layout.fragmenta,container,false);
        recyclerView = (RecyclerView) mview.findViewById(R.id.recycleview);
        StaggeredGridLayoutManager layoutManager =
                //这里 3 代表三列 后面代表瀑布流朝向
                new StaggeredGridLayoutManager(3,StaggeredGridLayoutManager.VERTICAL);

        initlist();//初始化模拟数据
        
        mDemoSlider = (SliderLayout) mview.findViewById(R.id.slider);

        MeiziAdapter adapter = new MeiziAdapter(list,getActivity());
        recyclerView.setLayoutManager(layoutManager);
        recyclerView.setAdapter(adapter);

        SpcaceDecoration sc = new SpcaceDecoration(1);//设置间距
        recyclerView.addItemDecoration(sc);

        recyclerView.setNestedScrollingEnabled(false);
        //NesterScrollView不允许滑动
        recyclerView.setHasFixedSize(true);
        //RecycleView固定大小会实现优化

        adapter.setOnItemClickListener(new MeiziAdapter.OnItemClickListener() {
            @Override
            public void onItemClick(View view, int position) {
                Toast.makeText(getActivity(),"我被点击了"+position,Toast.LENGTH_SHORT).show();
            }
        });

        setloopconfig();

        return mview;
    }

还有一点就是继承RecyclerView.ItemDecoration 设置item间距

package com.panghaha.it.mymusicplayerdemo;

import android.graphics.Rect;
import android.support.v7.widget.RecyclerView;
import android.view.View;

/***
 * ━━━━ Code is far away from ━━━━━━
 *     ()      ()
 *     ( )    ( )
 *     ( )    ( )
 *   ┏┛┻━━━┛┻┓
 *   ┃   ━   ┃
 *   ┃ ┳┛ ┗┳ ┃
 *   ┃   ┻   ┃
 *   ┗━┓   ┏━┛
 *     ┃   ┃
 *     ┃   ┗━━━┓
 *     ┃       ┣┓
 *     ┃       ┏┛
 *     ┗┓┓┏━┳┓┏┛
 *      ┃┫┫ ┃┫┫
 *      ┗┻┛ ┗┻┛
 * ━━━━ bug with the more protecting ━━━
 * <p/>
 * Created by PangHaHa12138 on 2017/7/4.
 */
public class SpcaceDecoration extends RecyclerView.ItemDecoration {

    private int space;

    public SpcaceDecoration(int space) {
        this.space=space;
    }


    @Override
    public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) {
        super.getItemOffsets(outRect, view, parent, state);
        outRect.left=space;
        outRect.right=space;
        outRect.bottom=space;
        if(parent.getChildAdapterPosition(view)==0){
            outRect.top=space;
        }
    }
}

最后还有一个小知识点,就是recycleview抢占焦点问题
Recycleview的父容器加上

android:descendantFocusability="blocksDescendants"

这个就可以了

  beforeDescendants:viewgroup会优先其子类控件而获取到焦点   
  afterDescendants:viewgroup只有当其子类控件不需要获取焦点时才获取焦点
  blocksDescendants:viewgroup会覆盖子类控件而直接获得焦点

感谢阅读 ~have a nice day~

上一篇下一篇

猜你喜欢

热点阅读