1. 程式人生 > >RecyclerView實現 gridview效果!

RecyclerView實現 gridview效果!

主介面程式碼

/**
 * @author * @Date 2016829* @describe 主頁面*/
public class InternetAccessLogFragment extends BaseFragment {

    private View v;
    private RecyclerView recyclerView;
    private TextView top_center;
    private String[] data = {"流量日誌", "瀏覽器日誌", "桌面日誌", "聊天日誌", "郵件日誌", "發帖日誌", "警告日誌", "搜尋日誌
", "移動磁碟", " ", " ", " "}; private int[] imgdata = {R.mipmap.ic_launcher, R.mipmap.ic_launcher, R.mipmap.ic_launcher, R.mipmap.ic_launcher, R.mipmap.ic_launcher, R.mipmap.ic_launcher, R.mipmap.ic_launcher, R.mipmap.ic_launcher, R.mipmap.ic_launcher, R.mipmap.item, R.mipmap.item
, R.mipmap.item}; private RecyclerGridViewAdapter recyclerGridViewAdapter; @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { // return super.onCreateView(inflater, container, savedInstanceState); v = inflater.inflate(R.layout.fragment_internet_access_log
, null); recyclerView = (RecyclerView) v.findViewById(R.id.fragment_recyclerview); top_center = (TextView) v.findViewById(R.id.top_center); GridLayoutManager mgr = new GridLayoutManager(context, 4); recyclerView.setLayoutManager(mgr); // int spanCount = 4;//跟佈局裡面的spanCount屬性是一致的 // int spacing = 2;//每一個矩形的間距 // boolean includeEdge = false;//如果設定成false那邊緣地帶就沒有間距s // //設定每個item間距 // recyclerView.addItemDecoration(new GridSpacingItemDecoration(spanCount, spacing, includeEdge)); //設定介面卡 recyclerGridViewAdapter = new RecyclerGridViewAdapter(context, data, imgdata); recyclerView.setAdapter(recyclerGridViewAdapter); onRecyclerItemClickListener(); return v; } @Override public void onViewCreated(View view, @Nullable Bundle savedInstanceState) { super.onViewCreated(view, savedInstanceState); top_center.setText("上網日誌"); onRecyclerItemClickListener(); } private void onRecyclerItemClickListener() { recyclerGridViewAdapter.setOnRecyclerViewItemListener(new RecyclerGridViewAdapter.OnRecyclerViewItemListener() { @Override public void onItemClickListener(View view, int position) { Toast.makeText(context, "onClick:" + position, Toast.LENGTH_SHORT).show(); } @Override public void onItemLongClickListener(View view, int position) { Toast.makeText(context, "onLongClick:" + position, Toast.LENGTH_SHORT).show(); } }); } }
---------------------------------------------------------------------------------------------------------------
介面卡程式碼!!!
//繼承自 RecyclerView.Adapter
public class RecyclerGridViewAdapter extends RecyclerView.Adapter<RecyclerGridViewAdapter.ViewHolder> {
    private Context mContext;
    private String[] data;
    private int[] imgdata;
    private LayoutInflater inf;
    //view是否充滿了手機螢幕
private boolean isCompleteFill = false;

    public interface OnRecyclerViewItemListener {
        public void onItemClickListener(View view, int position);

        public void onItemLongClickListener(View view, int position);
    }

    private OnRecyclerViewItemListener mOnRecyclerViewItemListener;

    public void setOnRecyclerViewItemListener(OnRecyclerViewItemListener listener) {
        mOnRecyclerViewItemListener = listener;
    }

    public RecyclerGridViewAdapter(Context mContext, String[] data, int[] imgdata) {
        this.mContext = mContext;
        this.data = data;
        this.imgdata = imgdata;
        inf = LayoutInflater.from(mContext);

    }


    //RecyclerView顯示的子View
    //該方法返回是ViewHolder,當有可複用View時,就不再呼叫
@Override
public ViewHolder onCreateViewHolder(ViewGroup viewGroup, int i) {
        View v = inf.inflate(R.layout.fragment_internetlog_recycler_item, viewGroup, false);
        return new ViewHolder(v);
    }

    //將資料繫結到子View,會自動複用View
@Override
public void onBindViewHolder(ViewHolder viewHolder, int i) {
        if (viewHolder == null) {
            return;
        }
        if (mOnRecyclerViewItemListener != null) {
            itemOnClick(viewHolder);
            itemOnLongClick(viewHolder);
        }
        viewHolder.textView.setText(data[i]);
        viewHolder.imageView.setBackgroundResource(imgdata[i]);
    }

    //RecyclerView顯示資料條數
@Override
public int getItemCount() {
        return data.length;
    }

    //自定義的ViewHolder,減少findViewById呼叫次數
class ViewHolder extends RecyclerView.ViewHolder {

        TextView textView;
        ImageView imageView;

        //在佈局中找到所含有的UI元件
public ViewHolder(View itemView) {
            super(itemView);
            textView = (TextView) itemView.findViewById(R.id.fragment__internetlog_recycler_item_textview);
            imageView = (ImageView) itemView.findViewById(R.id.fragment__internetlog_recycler_item_iamgeview);
        }
    }
    //單機事件
    private void itemOnClick(final RecyclerView.ViewHolder holder) {
        holder.itemView.setOnClickListener(new View.OnClickListener() {
            @Override
public void onClick(View v) {
                int position = holder.getLayoutPosition();
                mOnRecyclerViewItemListener.onItemClickListener(holder.itemView, position);
            }
        });
    }
    //長按事件
    private void itemOnLongClick(final RecyclerView.ViewHolder holder) {
        holder.itemView.setOnLongClickListener(new View.OnLongClickListener() {
            @Override
public boolean onLongClick(View v) {
                int position = holder.getLayoutPosition();
                mOnRecyclerViewItemListener.onItemLongClickListener(holder.itemView, position);
                //返回true是為了防止觸發onClick事件
return true;
            }
        });
    }

}
-------------------------------------------------------------------------------------------------------------------
Item間距
/**
 * @author * @Date 2016829* @describe RecyclerView Item間距
*/
public class GridSpacingItemDecoration extends RecyclerView.ItemDecoration {

    private int spanCount;
    private int spacing;
    private boolean includeEdge;

    public GridSpacingItemDecoration(int spanCount, int spacing, boolean includeEdge) {
        this.spanCount = spanCount;
        this.spacing = spacing;
        this.includeEdge = includeEdge;
    }

    @Override
public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) {
        int position = parent.getChildAdapterPosition(view); // item position
int column = position % spanCount; // item column
if (includeEdge) {
            outRect.left = spacing - column * spacing / spanCount; // spacing - column * ((1f / spanCount) * spacing)
outRect.right = (column + 1) * spacing / spanCount; // (column + 1) * ((1f / spanCount) * spacing)
if (position < spanCount) { // top edge
outRect.top = spacing;
            }
            outRect.bottom = spacing; // item bottom
} else {
            outRect.left = column * spacing / spanCount; // column * ((1f / spanCount) * spacing)
outRect.right = spacing - (column + 1) * spacing / spanCount; // spacing - (column + 1) * ((1f /    spanCount) * spacing)
if (position >= spanCount) {
                outRect.top = spacing; // item top
}
        }
    }
}
-------------------------------------------------------------------------------------------------------------------
主頁面XML 程式碼
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">

    <include layout="@layout/head" />

    <TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="5dp"
android:layout_marginLeft="8dp"
android:layout_marginTop="5dp"
android:text="分類"
android:textColor="#000"
android:textSize="16dp" />


    <android.support.v7.widget.RecyclerView
android:id="@+id/fragment_recyclerview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#fff"
android:overScrollMode="never"
android:scrollbars="none" />

    <View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#DEDEDE" />
</LinearLayout>

其中 android:overScrollMode="never" android:scrollbars="none" 是去掉滑動陰影效果的程式碼
-------------------------------------------------------------------------------------------------------------------
Item 程式碼:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
    <View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#DEDEDE" />
    <LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">

        <LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#fff"
android:orientation="vertical"
android:padding="8dp">

            <ImageView
android:id="@+id/fragment__internetlog_recycler_item_iamgeview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center" />

            <TextView
android:id="@+id/fragment__internetlog_recycler_item_textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="流量日誌" />
        </LinearLayout>

        <View
android:layout_width="2dp"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:layout_marginBottom="8dp"
android:layout_marginTop="8dp"
android:layout_weight="1"
android:background="#DEDEDE" />
    </LinearLayout>
</LinearLayout>