RecyclerView和购物车的简单结合使用

首先先导入依赖:
【RecyclerView和购物车的简单结合使用】

compile 'com.squareup.okhttp3:okhttp:3.9.0' compile 'com.squareup.okhttp3:logging-interceptor:3.9.0' compile 'com.google.code.gson:gson:2.8.2' compile 'com.android.support:recyclerview-v7:26.0.0-alpha1' compile 'com.nostra13.universalimageloader:universal-image-loader:1.9.5' compile 'org.greenrobot:eventbus:3.1.1'


然后分类建包,这个就不用在这里展示了,


下来就先写网络请求OkHttpUtils



import okhttp3.Callback; import okhttp3.OkHttpClient; import okhttp3.Request; import okhttp3.logging.HttpLoggingInterceptor; public class HttpUtils { private static volatile HttpUtils httpUtils; private OkHttpClient client; private HttpUtils(){ HttpLoggingInterceptor logging=new HttpLoggingInterceptor(); logging.setLevel(HttpLoggingInterceptor.Level.BODY); client=new OkHttpClient.Builder() .addInterceptor(logging) .build(); }public static HttpUtils getHttpUtils(){ if (httpUtils==null){ synchronized (HttpUtils.class){ if (httpUtils==null){ httpUtils=new HttpUtils(); } } } return httpUtils; }/** * GET请求 * * @param url * @param callback */ public void doGet(String url, Callback callback){ Request request=new Request.Builder().url(url).build(); client.newCall(request).enqueue(callback); } }


然后在这里建一个接口来实现model层的方法。



public interface OnNetListener { public void onSuccess(T t); //这是成功的方法 public void onFailure(Exception e); //这是失败的。 }


下面写一个APP类的方法。这个方法是ImageLoader的方法,用来展示图片



public class MyApp extends Application { @Override public void onCreate() { super.onCreate(); ImageLoaderConfiguration configuration=new ImageLoaderConfiguration.Builder(this).build(); ImageLoader.getInstance().init(configuration); } }


上面的一些必须的代码就写完了,接下来写model层的接口



public interface IMainModel { public void getGoods(OnNetListener onNetListener); }


然后创建一个类来继承这个接口



import android.os.Handler; import android.os.Looper; import com.bwie.test.a09ashopcar.bean.GoodsBean; import com.bwie.test.a09ashopcar.net.Api; import com.bwie.test.a09ashopcar.net.HttpUtils; import com.bwie.test.a09ashopcar.net.OnNetListener; import com.google.gson.Gson; import java.io.IOException; import okhttp3.Call; import okhttp3.Callback; import okhttp3.Response; public class MainModel implements IMainModel{ private Handler handler=new Handler(Looper.getMainLooper()); @Override public void getGoods(final OnNetListener onNetListener) { HttpUtils.getHttpUtils().doGet(Api.url, new Callback() { @Override public void onFailure(Call call, IOException e) {}@Override public void onResponse(Call call, Response response) throws IOException { String string=response.body().string(); final GoodsBean goodsBean = new Gson().fromJson(string, GoodsBean.class); handler.post(new Runnable() { @Override public void run() { onNetListener.onSuccess(goodsBean); } }); } }); } }


model层写完了, 接下来就该写presenter的数据了



public class MainPresenter { private IMainModel iMainModel; private IShopActivity iMainActivity; public MainPresenter(IShopActivity iMainActivity){ this.iMainActivity=iMainActivity; iMainModel=new MainModel(); }public void getGoods(){ iMainModel.getGoods(new OnNetListener() { @Override public void onSuccess(GoodsBean goodsBean) { List groupList = goodsBean.getData(); List>childList=new ArrayList>(); for (int i=0; idatas=groupList.get(i).getDatas(); childList.add(datas); } iMainActivity.showList(groupList,childList); }@Override public void onFailure(Exception e) {} }); } }


写完这些就该写布局了

购物车它是二级的,所以布局也比较复杂


下面这个是主要的布局

main.xml


下来写一级目录的布局吧。Group.xml





下来是二级目录的布局child.xml





接下来我们改写View层的接口



public interface IShopActivity { public void showList(ListgroupList,List>childList); }


然后是View的类



public class ShopActivity extends AppCompatActivity implements IShopActivity {private ExpandableListView mElv; private CheckBox mQuanCk; /** * 0 */ private TextView mTvPrice; /** * 结算(0) */ private TextView mTvNum; private LinearLayout mActivityMain; private ShopAdapter adapter; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_shop); EventBus.getDefault().register(this); initView(); new MainPresenter(this).getGoods(); mQuanCk.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { adapter.changeAllListCbState(mQuanCk.isChecked()); } }); }private void initView() { mElv = (ExpandableListView) findViewById(R.id.elv); mQuanCk = (CheckBox) findViewById(R.id.quan_ck); mTvPrice = (TextView) findViewById(R.id.tv_price); mTvNum = (TextView) findViewById(R.id.tv_num); mActivityMain = (LinearLayout) findViewById(R.id.activity_main); }@Override public void showList(List groupList, List> childList) { adapter=new ShopAdapter(this,groupList,childList); mElv.setAdapter(adapter); //去掉二级列表的小箭头 mElv.setGroupIndicator(null); //默认让其全部展开 for (int i=0; i

在这里 我们用到了EventBus这个控件,所以我们这里还有这样两个类:



public class MessageEvent { private boolean checked; public boolean isChecked() { return checked; }public void setChecked(boolean checked) { this.checked = checked; } }



public class PriceAndCountEvent { private int price; private int count; public int getPrice() { return price; }public void setPrice(int price) { this.price = price; }public int getCount() { return count; }public void setCount(int count) { this.count = count; } }



接下来我们来写最重要的购物车的适配器



public class ShopAdapter extends BaseExpandableListAdapter { private Context context; private ListgroupList; private List>childList; private final LayoutInflater inflater; public ShopAdapter(Context context, List groupList, List> childList) { this.context = context; this.groupList = groupList; this.childList = childList; inflater=LayoutInflater.from(context); }@Override public int getGroupCount() { return groupList.size(); }@Override public int getChildrenCount(int i) { return childList.get(i).size(); }@Override public Object getGroup(int i) { return groupList.get(i); }@Override public Object getChild(int i, int i1) { return childList.get(i).get(i1); }@Override public long getGroupId(int i) { return i; }@Override public long getChildId(int i, int i1) { return i1; }@Override public boolean hasStableIds() { return false; }@Override public View getGroupView(final int i, boolean b, View convertView, ViewGroup viewGroup) { View view; final GroupViewHolder gholder; if (convertView==null){ gholder=new GroupViewHolder(); view=inflater.inflate(R.layout.item_group,null); gholder.cb_group=view.findViewById(R.id.cb_group); gholder.tv_number=view.findViewById(R.id.tv_number); view.setTag(gholder); }else { view=convertView; gholder= (GroupViewHolder) view.getTag(); }final GoodsBean.DataBean groupBean=groupList.get(i); gholder.cb_group.setChecked(groupBean.isChecked()); gholder.tv_number.setText(groupBean.getTitle()); //一级checkbox gholder.cb_group.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { groupBean.setChecked(gholder.cb_group.isChecked()); changeChildCbState(i, gholder.cb_group.isChecked()); EventBus.getDefault().post(compute()); changeAllCbState(isAllGroupCbSelected()); notifyDataSetChanged(); } }); return view; }@Override public View getChildView(final int i, final int i1, boolean b, final View convertView, ViewGroup viewGroup) {View view; final ChildViewHolder cholder; if (convertView==null){ cholder=new ChildViewHolder(); view=inflater.inflate(R.layout.item_child,null); cholder.cb_child=view.findViewById(R.id.cb_child); cholder.tv_tel=view.findViewById(R.id.tv_tel); cholder.tv_content=view.findViewById(R.id.tv_content); cholder.tv_time=view.findViewById(R.id.tv_time); cholder.tv_pri=view.findViewById(R.id.tv_pri); cholder.tv_del=view.findViewById(R.id.tv_del); cholder.iv_add = view.findViewById(R.id.iv_add); cholder.iv_del = view.findViewById(R.id.iv_del); cholder.tv_num = view.findViewById(R.id.tv_num); view.setTag(cholder); }else { view=convertView; cholder= (ChildViewHolder) view.getTag(); }final GoodsBean.DataBean.DatasBean childBean=childList.get(i).get(i1); cholder.cb_child.setChecked(childBean.isChecked()); cholder.tv_tel.setText(childBean.getType_name()); cholder.tv_content.setText(childBean.getMsg()); cholder.tv_time.setText(childBean.getAdd_time()); cholder.tv_pri.setText(childBean.getPrice()+""); cholder.tv_num.setText(childBean.getNum() + ""); //二级checkbox //给holder.cbChild设置点击事件 cholder.cb_child.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { //设置该条目对象里的checked属性值 childBean.setChecked(cholder.cb_child.isChecked()); PriceAndCountEvent priceAndCountEvent=compute(); EventBus.getDefault().post(priceAndCountEvent); if (cholder.cb_child.isChecked()){ //当前checkbox是选中状态 if (isAllChildCbSelected(i)){ changGroupCbState(i,true); changeAllCbState(isAllGroupCbSelected()); } }else { changGroupCbState(i,false); changeAllCbState(isAllGroupCbSelected()); }notifyDataSetChanged(); } }); //加号 cholder.iv_add.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { int num=childBean.getNum(); cholder.tv_num.setText(++num+""); childBean.setNum(num); if (cholder.cb_child.isChecked()){ PriceAndCountEvent priceAndCountEvent=compute(); EventBus.getDefault().post(priceAndCountEvent); } } }); //减号 cholder.iv_del.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { int num=childBean.getNum(); if (num==1){ Toast.makeText(context,"最少留一个呗!",Toast.LENGTH_SHORT).show(); return; } cholder.tv_num.setText(--num+""); childBean.setNum(num); if (cholder.cb_child.isChecked()){ PriceAndCountEvent priceAndCountEvent=compute(); EventBus.getDefault().post(priceAndCountEvent); } } }); //删除 cholder.tv_del.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { List datasBeen = childList.get(i); GoodsBean.DataBean.DatasBean remove = datasBeen.remove(i1); if (datasBeen.size()==0){ childList.remove(i); groupList.remove(i); } EventBus.getDefault().post(compute()); notifyDataSetChanged(); } }); return view; }@Override public boolean isChildSelectable(int i, int i1) { return false; }class GroupViewHolder{ CheckBox cb_group; TextView tv_number; }class ChildViewHolder{ CheckBox cb_child; TextView tv_tel; TextView tv_content; TextView tv_time; TextView tv_pri; TextView tv_del; ImageView iv_del; ImageView iv_add; TextView tv_num; }/** * 改变全选的状态 * * @param flag */ private void changeAllCbState(boolean flag){ MessageEvent messageEvent = new MessageEvent(); messageEvent.setChecked(flag); EventBus.getDefault().post(messageEvent); }/** * 改变一级列表checkbox状态 * * @param groupPosition */ private void changGroupCbState(int groupPosition,boolean flag){ GoodsBean.DataBean dataBean = groupList.get(groupPosition); dataBean.setChecked(flag); }/** * 改变二级列表checkbox状态 * * @param groupPosition * @param flag */ private void changeChildCbState(int groupPosition, boolean flag) { List datasBeen = childList.get(groupPosition); for (int i = 0; i /** * 判断一级列表是否全部选中 * * @return */ private boolean isAllGroupCbSelected() { for (int i = 0; i /** * 判断二级列表是否全部选中 * * @param groupPosition * @return */ private boolean isAllChildCbSelected(int groupPosition){ List datasBeen = childList.get(groupPosition); for (int i=0; i/** * 计算列表中,选中的钱和数量 */ private PriceAndCountEvent compute(){ int count = 0; int price = 0; for (int i = 0; i datasBeen = childList.get(i); for (int j = 0; j /** * 设置全选、反选 * * @param flag */ public void changeAllListCbState(boolean flag) { for (int i = 0; i

这些就可以实现我们的二级购物车了。


我们接下来把RecyclerView的数据展示出来,用瀑布流来展示图片吧。





这是瀑布流的子布局。


这是我们RecyclerView的适配器



public class RecyAdapter extends RecyclerView.Adapter {private Context context; private List list; public RecyAdapter( Context context, List list) {this.context = context; this.list = list; }@Override public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) { View view= LayoutInflater.from(context).inflate(R.layout.item_recy,parent,false); return new MyViewHolder(view); }@Override public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) { String str = list.get(position); MyViewHolder myviewHolder = (MyViewHolder) holder; ImageLoader.getInstance().displayImage(str,myviewHolder.re_img); myviewHolder.re_img.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { Intent intent=new Intent(context, ShopActivity.class); context.startActivity(intent); } }); }@Override public int getItemCount() { return list.size(); }class MyViewHolder extends RecyclerView.ViewHolder { ImageView re_img; public MyViewHolder(View itemView) { super(itemView); re_img=(ImageView)itemView.findViewById(R.id.re_img); int width = ((Activity) context).getWindowManager().getDefaultDisplay().getWidth(); ViewGroup.LayoutParams params = re_img.getLayoutParams(); //设置图片的相对于屏幕的宽高比 params.width = width/3; params.height =(int) (200 + Math.random() * 400) ; re_img.setLayoutParams(params); } } }


然后是我们的Activity



public class MainActivity extends AppCompatActivity {private RecyclerView mRecy; private String[] imgs=new String[]{ "https://img-my.csdn.net/uploads/201309/01/1378037235_3453.jpg", "https://img-my.csdn.net/uploads/201309/01/1378037235_7476.jpg", "https://img-my.csdn.net/uploads/201309/01/1378037235_9280.jpg", "https://img-my.csdn.net/uploads/201309/01/1378037234_3539.jpg", "https://img-my.csdn.net/uploads/201309/01/1378037234_6318.jpg", "https://img-my.csdn.net/uploads/201309/01/1378037194_2965.jpg", "https://img-my.csdn.net/uploads/201309/01/1378037193_1687.jpg", "https://img-my.csdn.net/uploads/201309/01/1378037193_1286.jpg", "https://img-my.csdn.net/uploads/201309/01/1378037192_8379.jpg", "https://img-my.csdn.net/uploads/201309/01/1378037178_9374.jpg", "https://img-my.csdn.net/uploads/201309/01/1378037177_1254.jpg", "https://img-my.csdn.net/uploads/201309/01/1378037177_6203.jpg", "https://img-my.csdn.net/uploads/201309/01/1378037152_6352.jpg", "https://img-my.csdn.net/uploads/201309/01/1378037151_9565.jpg", "https://img-my.csdn.net/uploads/201309/01/1378037151_7904.jpg", "https://img-my.csdn.net/uploads/201309/01/1378037148_7104.jpg", "https://img-my.csdn.net/uploads/201309/01/1378037129_8825.jpg", "https://img-my.csdn.net/uploads/201309/01/1378037128_5291.jpg", "https://img-my.csdn.net/uploads/201309/01/1378037128_3531.jpg", "https://img-my.csdn.net/uploads/201309/01/1378037127_1085.jpg", "https://img-my.csdn.net/uploads/201309/01/1378037095_7515.jpg", "https://img-my.csdn.net/uploads/201309/01/1378037094_8001.jpg", "https://img-my.csdn.net/uploads/201309/01/1378037093_7168.jpg", "https://img-my.csdn.net/uploads/201309/01/1378037091_4950.jpg", "https://img-my.csdn.net/uploads/201308/31/1377949643_6410.jpg", "https://img-my.csdn.net/uploads/201308/31/1377949642_6939.jpg", "https://img-my.csdn.net/uploads/201308/31/1377949630_4505.jpg", "https://img-my.csdn.net/uploads/201308/31/1377949630_4593.jpg", "https://img-my.csdn.net/uploads/201308/31/1377949629_7309.jpg", "https://img-my.csdn.net/uploads/201308/31/1377949629_8247.jpg", "https://img-my.csdn.net/uploads/201308/31/1377949615_1986.jpg", "https://img-my.csdn.net/uploads/201308/31/1377949614_8482.jpg", "https://img-my.csdn.net/uploads/201308/31/1377949614_3743.jpg", "https://img-my.csdn.net/uploads/201308/31/1377949614_4199.jpg", "https://img-my.csdn.net/uploads/201308/31/1377949599_3416.jpg", "https://img-my.csdn.net/uploads/201308/31/1377949599_5269.jpg", "https://img-my.csdn.net/uploads/201308/31/1377949598_7858.jpg", "https://img-my.csdn.net/uploads/201308/31/1377949598_9982.jpg", "https://img-my.csdn.net/uploads/201308/31/1377949578_2770.jpg", "https://img-my.csdn.net/uploads/201308/31/1377949578_8744.jpg", "https://img-my.csdn.net/uploads/201308/31/1377949577_5210.jpg", "https://img-my.csdn.net/uploads/201308/31/1377949577_1998.jpg", "https://img-my.csdn.net/uploads/201308/31/1377949482_8813.jpg", "https://img-my.csdn.net/uploads/201308/31/1377949481_6577.jpg", "https://img-my.csdn.net/uploads/201308/31/1377949480_4490.jpg", "https://img-my.csdn.net/uploads/201308/31/1377949455_6792.jpg", "https://img-my.csdn.net/uploads/201308/31/1377949455_6345.jpg", "https://img-my.csdn.net/uploads/201308/31/1377949442_4553.jpg", "https://img-my.csdn.net/uploads/201308/31/1377949441_8987.jpg", "https://img-my.csdn.net/uploads/201308/31/1377949441_5454.jpg", "https://img-my.csdn.net/uploads/201308/31/1377949454_6367.jpg", "https://img-my.csdn.net/uploads/201308/31/1377949442_4562.jpg" }; private RecyAdapter adapter; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); mRecy=(RecyclerView)findViewById(R.id.recy); //给rv设置布局管理器 mRecy.setLayoutManager(new StaggeredGridLayoutManager (3,StaggeredGridLayoutManager.VERTICAL)); Listlist=new ArrayList<>(); for (int i = 0; i //创建适配器 adapter=new RecyAdapter(MainActivity.this,list); mRecy.setAdapter(adapter); }}


这样我们的瀑布流也展示出来了。过程比较复杂,但是效果还是很棒的!



















    推荐阅读