仿电商App：笔记（十一）：购物车，订单，支付功能开发（包含支付宝支付）（一）

购物车，订单，支付功能开发（包含支付宝支付和微信支付）（一）

1、购物车UI编写

1.1 购物车根布局

1.2 购物车根页面效果图

1.3 购物车中每条数据效果图

2、购物车数据结构分析、解析与转化

2.1 购物车每个item的数据解析类

2.2 item的数据与视图绑定

2.3 购物车根布局

2.4 效果图

3、购物车事件逻辑梳理与实现-1

3.1 处理购物车中点击事件

3.3 根布局处理全选点击事件

3.4 效果图

4、删除、清空键的事件处理

4.1 数据转换类中，更新删除后的item位置

4.2 效果图

5、购物车价格计算逻辑梳理，排坑与实现

5.1 当购物车为空时，占位view

5.2 左右加减，使得总数值改变

1、购物车UI编写

1.1 购物车根布局

位于latte-ec模块main->cart包下的ShopCartDelegate。

主要作用：购物车页面的根fragment。

public class ShopCartDelegate extends BottomItemDelegate {
    @Override
    public Object setLayout() {
        return R.layout.delegate_shop_cart;
    }
    @Override
    public void onBindView(@Nullable Bundle savedInstanceState, View rootView) {
    }
}

1.2 购物车根页面效果图

1.3 购物车中每条数据效果图

2、购物车数据结构分析、解析与转化

2.1 购物车每个item的数据解析类

位于latte-ec模块main->cart包下的ShopCartDataConverter。

主要作用：购物车页面中每个item的解析类。

public class ShopCartDataConverter extends DataConverter {

    @Override
    public ArrayList<MultipleItemEntity> convert() {
        ArrayList<MultipleItemEntity> dataList = new ArrayList<>();
        JSONArray dataArray = JSON.parseObject(getJsonData()).getJSONArray("data");

        final int size = dataArray.size();
        for (int i=0;i<size;i++){
            final JSONObject data = dataArray.getJSONObject(i);
            final String thumb = data.getString("thumb");
            final String desc = data.getString("desc");
            final String title = data.getString("title");
            final int id = data.getInteger("id");
            final int count = data.getInteger("count");
            final double price = data.getDouble("price");

            final MultipleItemEntity entity = MultipleItemEntity.builder()//将JSON数据保存起来，保存在MultipleItemEntity的键值对中
                    .setField(MultipleFields.ITEM_TYPE, ShopCartItemType.SHOP_CART_ITEM)//独有的样式，在ec中
                    .setField(MultipleFields.ID, id)
                    .setField(MultipleFields.IMAGE_URL,thumb)
                    .setField(ShopCartItemFields.TITLE,title)
                    .setField(ShopCartItemFields.DESC,desc)
                    .setField(ShopCartItemFields.COUNT,count)
                    .setField(ShopCartItemFields.PRICE,price)
                    .build();
            dataList.add(entity);
        }
        return dataList;
    }
}

2.2 item的数据与视图绑定

位于latte-ec模块main->cart包下的ShopCartAdapter。

主要作用：购物车页面中每个item的转换类，购物车的数据适配器，将json数据与视图绑定。

public class ShopCartAdapter extends MultipleRecyclerAdapter {

    private static final RequestOptions OPTIONS = new RequestOptions()//图片加载库
            .diskCacheStrategy(DiskCacheStrategy.ALL)
            .centerCrop()
            .dontAnimate();

    protected ShopCartAdapter(List<MultipleItemEntity> data) {
        super(data);
        //添加购物车item布局
        addItemType(ShopCartItemType.SHOP_CART_ITEM, R.layout.item_shop_cart);
    }

    @Override
    protected void convert(MultipleViewHolder holder, MultipleItemEntity entity) {
        super.convert(holder, entity);
        switch (holder.getItemViewType()) {
            case ShopCartItemType.SHOP_CART_ITEM:
                //先取出所有值
                final int id = entity.getFiled(MultipleFields.ID);
                final String thumb = entity.getFiled(MultipleFields.IMAGE_URL);
                final String title = entity.getFiled(ShopCartItemFields.TITLE);
                final String desc = entity.getFiled(ShopCartItemFields.DESC);
                final int count = entity.getFiled(ShopCartItemFields.COUNT);
                final double price = entity.getFiled(ShopCartItemFields.PRICE);
                //取出所有控件
                final AppCompatImageView imageThumb = holder.getView(R.id.image_item_shop_cart);
                final AppCompatTextView tvTitle = holder.getView(R.id.tv_item_shop_cart_title);
                final AppCompatTextView tvDesc = holder.getView(R.id.tv_item_shop_cart_desc);
                final AppCompatTextView tvPrice = holder.getView(R.id.tv_item_shop_cart_price);
                final IconTextView iconMinus = holder.getView(R.id.icon_item_minus);
                final IconTextView iconPlus = holder.getView(R.id.icon_item_plus);
                final AppCompatTextView tvCount = holder.getView(R.id.tv_item_shop_cart_count);
                //赋值（json数据与视图绑定）
                tvTitle.setText(title);
                tvDesc.setText(desc);
                tvPrice.setText(String.valueOf(price));
                tvCount.setText(String.valueOf(count));
                Glide.with(mContext)
                        .load(thumb)
                        .into(imageThumb);
                break;
            default:
                break;
        }
    }
}

2.3 购物车根布局

位于latte-ec模块main->cart包下的ShopCartDelegate。

主要作用：购物车页面的根fragment。

public class ShopCartDelegate extends BottomItemDelegate implements ISuccess {

    @BindView(R2.id.rv_shop_cart)//rebuild project
    RecyclerView mRecyclerView = null;

    ShopCartAdapter mAdapter = null;
......
    @Override
    public void onSuccess(String response) {
        final ArrayList<MultipleItemEntity> data =
                new ShopCa