4_4-带货场景-商品

• 1 功能概述
• 2 使用演示
• 3 實作介紹
  • 3.1 商品推播佈局 - PLVECCommodityPushLayout
  • 3.2 商品彈層 - PLVECCommodityPopupView

1 功能概述

商品模組包含商品推播佈局PLVECCommodityPushLayout、商品彈層PLVECCommodityPopupView，在直播帶貨中可根據直播即時情況，由後台配置商品並推播至觀看端。

2 使用演示

商品模組的即時更新依賴於聊天室的事件監聽，因此在聊天室 mvp-view 的建構中需實作商品相關的介面

商品控制事件範例程式碼如下：

// PLVECLiveHomeFragment.java
private IPLVChatroomContract.IChatroomView chatroomView = new PLVAbsChatroomView() {
    // 商品控制事件监听
    @Override
    public void onProductControlEvent(@NonNull PLVProductControlEvent productControlEvent) {
        super.onProductControlEvent(productControlEvent);
        acceptProductControlEvent(productControlEvent);
    }

    // 其它接口实现...
}

// 商品控制事件的处理
private void acceptProductControlEvent(final PLVProductControlEvent productControlEvent) {
    if (!isOpenCommodityMenu) {
        return;
    }
    handler.post(new Runnable() {
        @Override
        public void run() {
            final PLVProductContentBean contentBean = productControlEvent.getContent();
            if (productControlEvent.getContent() == null) {
                return;
            }
            if (productControlEvent.isPush()) {//商品推送
                commodityPushLayout.setViewActionListener(new PLVECCommodityPushLayout.ViewActionListener() {
                    @Override
                    public void onEnterClick() {
                        acceptBuyCommodityClick(contentBean);
                    }
                });
                // 更新推送布局的商品内容
                commodityPushLayout.updateView(contentBean.getProductId(), contentBean.getShowId(), contentBean.getCover(), contentBean.getName(), contentBean.getRealPrice(), contentBean.getPrice());
                // 显示推送布局
                commodityPushLayout.show();
            } else if (productControlEvent.isNewly()) {//新增
                commodityPopupView.add(contentBean, true);
            } else if (productControlEvent.isRedact()) {//编辑
                commodityPopupView.update(contentBean);
            } else if (productControlEvent.isPutOnShelves()) {//上架
                commodityPopupView.add(contentBean, false);
            }
        }
    });
}

3 實作介紹

3.1 商品推播佈局 - PLVECCommodityPushLayout

商品推播佈局在接收到後台的商品控制推播事件時顯示，支援顯示一件商品，用於帶貨時推播一件指定商品。

商品推播佈局的使用範例如下：

// PLVECLiveHomeFragment.java
// 设置进入商品按钮点击回调
commodityPushLayout.setViewActionListener(new PLVECCommodityPushLayout.ViewActionListener() {
    @Override
    public void onEnterClick() {
        // 在点击进入商品按钮后，跳转到指定的购物页面
        acceptBuyCommodityClick(contentBean);
    }
});
// 更新推送布局显示的商品
commodityPushLayout.updateView(contentBean.getProductId(), contentBean.getShowId(), contentBean.getCover(), contentBean.getName(), contentBean.getRealPrice(), contentBean.getPrice());
// 显示推送布局，会在5秒后自动隐藏
commodityPushLayout.show();

3.2 商品彈層 - PLVECCommodityPopupView

商品彈層在觀眾點擊首頁的購物車按鈕時顯示，使用列表顯示多個商品

商品彈層的使用範例如下：

// PLVECLiveHomeFragment.java
private void showCommodityLayout(View v) {
    // 清空旧数据
    commodityPopupView.setCommodityVO(null);
    // 每次弹出都调用一次接口获取商品信息
    liveRoomDataManager.requestProductList();
    // 显示商品弹层
    commodityPopupView.showCommodityLayout(v, new PLVECCommodityAdapter.OnViewActionListener() {
        @Override
        public void onBuyCommodityClick(View view, PLVProductContentBean contentsBean) {
            acceptBuyCommodityClick(contentsBean);
        }

        @Override
        public void onLoadMoreData(int rank) {
            liveRoomDataManager.requestProductList(rank);
        }
    });
}

private void acceptProductControlEvent(final PLVProductControlEvent productControlEvent) {
    // 其它部分代码...
    if (productControlEvent.isPush()) {
        // 商品推送...
    } else if (productControlEvent.isNewly()) {
        // 商品弹层 新增商品
        commodityPopupView.add(contentBean, true);
    } else if (productControlEvent.isRedact()) {
        // 商品弹层 更新编辑商品
        commodityPopupView.update(contentBean);
    } else if (productControlEvent.isPutOnShelves()) {
        // 商品弹层 上架商品
        commodityPopupView.add(contentBean, false);
    }
}