Android實現商城評分系統功能

概述

商城項目開發過程中,當用戶購買商品完成後,需要用戶對買入的商品進行打星評分,這在開發過程中似乎這個需求是必須的,每個app設計得不一樣,所以評分系統也不一樣,但站在技術的角度來看,其實都大同小異,只是每個公司的需要不同而已,話不多說,直接開整吧。

實現流程

  1. 效果圖

在這裏插入圖片描述
2. 添加依賴

	implementation 'com.android.support:recyclerview-v7:28.0.0'
    implementation 'com.jakewharton:butterknife:5.1.1'
    implementation 'com.google.code.gson:gson:2.3.1'
    implementation 'com.github.bumptech.glide:glide:4.5.0'
  1. 模擬用戶購買成功商品數據
 		//模擬數據
        String response = "{\n" +
                "    \"datas\": {\n" +
                "        \"page\": {\n" +
                "            \"page\": \"1\",\n" +
                "            \"pageCount\": 1,\n" +
                "            \"perPage\": 5,\n" +
                "            \"totalCount\": 3\n" +
                "        },\n" +
                "        \"rows\": [\n" +
                "            {\n" +
                "                \"headimg\": \"/userInfoHead/201805/97ad9a393dd242cca8b076205a2297cf.jpg\",\n" +
                "                \"items\": [\n" +
                "                    {\n" +
                "                        \"disItemId\": \"5814203\",\n" +
                "                        \"icon\": \"/newImage/product/202005/0e5edcc278eb4c8ea1ef476dab15c5ee.jpg\",\n" +
                "                        \"itemName\": \"酸系列\",\n" +
                "                        \"itemPrice\": \"8.80\",\n" +
                "                        \"massId\": \"267\",\n" +
                "                        \"num\": \"8\",\n" +
                "                        \"productId\": \"3768\",\n" +
                "                        \"skuId\": \"25241\"\n" +
                "                    },\n" +
                "                    {\n" +
                "                        \"disItemId\": \"5814204\",\n" +
                "                        \"icon\": \"/newImage/product/202005/0e5edcc278eb4c8ea1ef476dab15c5ee.jpg\",\n" +
                "                        \"itemName\": \"甜系列\",\n" +
                "                        \"itemPrice\": \"8.80\",\n" +
                "                        \"massId\": \"267\",\n" +
                "                        \"num\": \"2\",\n" +
                "                        \"productId\": \"3768\",\n" +
                "                        \"skuId\": \"25241\"\n" +
                "                    },\n" +
                "                    {\n" +
                "                        \"disItemId\": \"5814205\",\n" +
                "                        \"icon\": \"/newImage/product/202005/ff50bdcbcf7e4f4d852184336f88171f.jpg\",\n" +
                "                        \"itemName\": \"苦系列\",\n" +
                "                        \"itemPrice\": \"6.80\",\n" +
                "                        \"massId\": \"267\",\n" +
                "                        \"num\": \"4\",\n" +
                "                        \"productId\": \"3768\",\n" +
                "                        \"skuId\": \"25240\"\n" +
                "                    },\n" +
                "                    {\n" +
                "                        \"disItemId\": \"5814206\",\n" +
                "                        \"icon\": \"/newImage/product/202005/ff50bdcbcf7e4f4d852184336f88171f.jpg\",\n" +
                "                        \"itemName\": \"辣系列\",\n" +
                "                        \"itemPrice\": \"6.80\",\n" +
                "                        \"massId\": \"267\",\n" +
                "                        \"num\": \"2\",\n" +
                "                        \"productId\": \"3768\",\n" +
                "                        \"skuId\": \"25240\"\n" +
                "                    },\n" +
                "                    {\n" +
                "                        \"disItemId\": \"5814207\",\n" +
                "                        \"icon\": \"/newImage/product/202005/ff50bdcbcf7e4f4d852184336f88171f.jpg\",\n" +
                "                        \"itemName\": \"暗黑系\",\n" +
                "                        \"itemPrice\": \"6.80\",\n" +
                "                        \"massId\": \"267\",\n" +
                "                        \"num\": \"4\",\n" +
                "                        \"productId\": \"3768\",\n" +
                "                        \"skuId\": \"25240\"\n" +
                "                    },\n" +
                "                    {\n" +
                "                        \"disItemId\": \"5814208\",\n" +
                "                        \"icon\": \"/newImage/product/202005/ff50bdcbcf7e4f4d852184336f88171f.jpg\",\n" +
                "                        \"itemName\": \"雪白系\",\n" +
                "                        \"itemPrice\": \"6.80\",\n" +
                "                        \"massId\": \"267\",\n" +
                "                        \"num\": \"2\",\n" +
                "                        \"productId\": \"3768\",\n" +
                "                        \"skuId\": \"25240\"\n" +
                "                    },\n" +
                "                    {\n" +
                "                        \"disItemId\": \"5814209\",\n" +
                "                        \"icon\": \"/newImage/product/202005/ff50bdcbcf7e4f4d852184336f88171f.jpg\",\n" +
                "                        \"itemName\": \"粉嫩系\",\n" +
                "                        \"itemPrice\": \"6.80\",\n" +
                "                        \"massId\": \"267\",\n" +
                "                        \"num\": \"2\",\n" +
                "                        \"productId\": \"3768\",\n" +
                "                        \"skuId\": \"25240\"\n" +
                "                    }\n" +
                "                ],\n" +
                "                \"massId\": \"267\",\n" +
                "                \"nickname\": \"一葉知\",\n" +
                "                \"productId\": \"3768\"\n" +
                "            }\n" +
                "        ]\n" +
                "    },\n" +
                "    \"msg\": \"success!\",\n" +
                "    \"ret\": 0\n" +
                "}";
  1. 用戶購買成功後商品列表實現

    (1) 效果圖
    在這裏插入圖片描述
    (2) 實現代碼

  //商品列表實現
        //數據解析
        WaitEvaluationReq delivergoodsReq = new Gson().fromJson(response, WaitEvaluationReq.class);

        if (delivergoodsReq.getRet() == 0) {
            List<WaitEvaluationReq.DatasBean.RowsBean> rowsBeanList = delivergoodsReq.getDatas().getRows();

            if (rowsBeanList != null && rowsBeanList.size() != 0) {
                //設置待評價的數據
                waitEvaluationAdapter.setData(rowsBeanList);
                mRecyclerView.setAdapter(waitEvaluationAdapter);
            }
        }
  1. 點擊評價按鈕進入評價打星頁面
    (1) 效果圖
    在這裏插入圖片描述
    (2) 將數據傳遞到評分頁面實現需要評價商品的列表
 			//設置需要評價的商品數據
            commentSystemAdapter.setData(itemsBeanList, tv_titlebar_right);
            recycler_view.setAdapter(commentSystemAdapter);
  1. 評分列表Adapter的實現
public class CommentSystemAdapter extends RecyclerView.Adapter<CommentSystemAdapter.ViewHolder> {

    private final Context mContext;
    private int currentStarCount;
    private int currentImgStarCount;
    private List<WaitEvaluationReq.DatasBean.RowsBean.ItemsBean> itemsBeanList;
    private TextView tv_titlebar_right;
    private OnTitlebarItemListener mDeleteListener;

    public interface OnTitlebarItemListener {
        void onClickItem(View v, List<WaitEvaluationReq.DatasBean.RowsBean.ItemsBean> itemsBeanList);
    }

    public void setOnTitlebarItemListener(OnTitlebarItemListener listener) {
        mDeleteListener = listener;
    }

    public CommentSystemAdapter(Context context) {
        this.mContext = context;
    }

    public void setData(List<WaitEvaluationReq.DatasBean.RowsBean.ItemsBean> itemsBeanList, TextView tv_titlebar_right) {
        this.itemsBeanList = itemsBeanList;
        this.tv_titlebar_right = tv_titlebar_right;
    }

    @NonNull
    @Override
    public ViewHolder onCreateViewHolder(@NonNull ViewGroup viewGroup, int i) {
        View view = LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.item_comment_system_adapter, viewGroup, false);
        ViewHolder viewHolder = new ViewHolder(view);
        return viewHolder;
    }

    @Override
    public void onBindViewHolder(@NonNull final ViewHolder viewHolder, final int i) {

        if (itemsBeanList != null && itemsBeanList.size() != 0) {
            final WaitEvaluationReq.DatasBean.RowsBean.ItemsBean itemsBean = itemsBeanList.get(i);

            if (TextUtils.isEmpty(itemsBean.getItemName())) {
                viewHolder.text_content.setText("");
            } else {
                viewHolder.text_content.setText(itemsBean.getItemName());
            }

            //評星選擇
            viewHolder.iv_comment_star_1.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    currentStarCount = 1;
                    setXin(viewHolder.starList, currentStarCount, 1, i);
                }
            });

            viewHolder.iv_comment_star_2.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    currentStarCount = 2;
                    setXin(viewHolder.starList, currentStarCount, 1, i);
                }
            });

            viewHolder.iv_comment_star_3.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    currentStarCount = 3;
                    setXin(viewHolder.starList, currentStarCount, 1, i);
                }
            });

            viewHolder.iv_comment_star_4.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    currentStarCount = 4;
                    setXin(viewHolder.starList, currentStarCount, 1, i);
                }
            });


            viewHolder.iv_comment_star_5.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    currentStarCount = 5;
                    setXin(viewHolder.starList, currentStarCount, 1, i);
                }
            });

            viewHolder.iv_design_star_1.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    currentImgStarCount = 1;
                    setXin(viewHolder.starImgList, currentImgStarCount, 2, i);
                }
            });

            viewHolder.iv_design_star_2.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    currentImgStarCount = 2;
                    setXin(viewHolder.starImgList, currentImgStarCount, 2, i);
                }
            });

            viewHolder.iv_design_star_3.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    currentImgStarCount = 3;
                    setXin(viewHolder.starImgList, currentImgStarCount, 2, i);
                }
            });

            viewHolder.iv_design_star_4.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    currentImgStarCount = 4;
                    setXin(viewHolder.starImgList, currentImgStarCount, 2, i);
                }
            });


            viewHolder.iv_design_star_5.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    currentImgStarCount = 5;
                    setXin(viewHolder.starImgList, currentImgStarCount, 2, i);
                }
            });

            tv_titlebar_right.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    mDeleteListener.onClickItem(v, itemsBeanList);
                }
            });

            viewHolder.et_user_input.addTextChangedListener(new TextWatcher() {
                @Override
                public void beforeTextChanged(CharSequence s, int start, int count, int after) {

                }

                @Override
                public void onTextChanged(CharSequence s, int start, int before, int count) {

                }

                @Override
                public void afterTextChanged(Editable s) {
                    //保存留言信息
                    String inputContent = viewHolder.et_user_input.getText().toString();
                    itemsBean.setRemark(inputContent);
                }
            });

        }
    }

    @Override
    public int getItemCount() {
        return itemsBeanList.size();
    }

    private void setXin(List<ImageView> starList, int currentStarCount, int type, int position) {

        if (itemsBeanList != null && itemsBeanList.size() != 0) {
            WaitEvaluationReq.DatasBean.RowsBean.ItemsBean itemsBean = itemsBeanList.get(position);
            if (type == 1) {
                //保存用戶評價質量分數據
                itemsBean.setQuality(currentStarCount);
            } else if (type == 2) {
                //保存用戶評價創意分數據
                itemsBean.setOriginality(currentStarCount);
            }
        }

        for (int i = 0, len = starList.size(); i < len; i++) {
            starList.get(i).setImageResource(i < currentStarCount ? R.drawable.grade_star_solid : R.drawable.grade_star_blank);
        }
    }

    public static class ViewHolder extends RecyclerView.ViewHolder {

        public List<ImageView> starList = new ArrayList<>();
        public List<ImageView> starImgList = new ArrayList<>();

        @InjectView(R.id.img_shopping)
        ImageView img_shopping;
        @InjectView(R.id.text_content)
        TextView text_content;
        @InjectView(R.id.et_user_input)
        EditText et_user_input;
        @InjectView(R.id.iv_comment_star_1)
        ImageView iv_comment_star_1;
        @InjectView(R.id.iv_comment_star_2)
        ImageView iv_comment_star_2;
        @InjectView(R.id.iv_comment_star_3)
        ImageView iv_comment_star_3;
        @InjectView(R.id.iv_comment_star_4)
        ImageView iv_comment_star_4;
        @InjectView(R.id.iv_comment_star_5)
        ImageView iv_comment_star_5;
        @InjectView(R.id.iv_design_star_1)
        ImageView iv_design_star_1;
        @InjectView(R.id.iv_design_star_2)
        ImageView iv_design_star_2;
        @InjectView(R.id.iv_design_star_3)
        ImageView iv_design_star_3;
        @InjectView(R.id.iv_design_star_4)
        ImageView iv_design_star_4;
        @InjectView(R.id.iv_design_star_5)
        ImageView iv_design_star_5;


        public ViewHolder(@NonNull View itemView) {
            super(itemView);
            ButterKnife.inject(this, itemView);

            starList.add(iv_comment_star_1);
            starList.add(iv_comment_star_2);
            starList.add(iv_comment_star_3);
            starList.add(iv_comment_star_4);
            starList.add(iv_comment_star_5);

            starImgList.add(iv_design_star_1);
            starImgList.add(iv_design_star_2);
            starImgList.add(iv_design_star_3);
            starImgList.add(iv_design_star_4);
            starImgList.add(iv_design_star_5);
        }
    }
}
  1. 用戶評分打星後點擊完成回調結果
       //用戶評價後的回調數據
            commentSystemAdapter.setOnTitlebarItemListener(new CommentSystemAdapter.OnTitlebarItemListener() {
                @Override
                public void onClickItem(View v, List<WaitEvaluationReq.DatasBean.RowsBean.ItemsBean> itemsBeanList) {
                    if (itemsBeanList != null && itemsBeanList.size() != 0) {
                        //請求服務器接口發送用戶評價的數據

                        double averageQuality = 0;
                        double averageOriginality = 0;

                        for (int i = 0; i < itemsBeanList.size(); i++) {
                            WaitEvaluationReq.DatasBean.RowsBean.ItemsBean itemsBean = itemsBeanList.get(i);
                            int quality = itemsBean.getQuality();
                            int originality = itemsBean.getOriginality();

                            averageQuality = averageQuality + quality;
                            averageOriginality = averageOriginality + originality;

                        }

                        //保留兩位小數
                        DecimalFormat df = new DecimalFormat("######0.00");

                        //社團平均分的計算
                        String content = "該社團質量分:" + df.format((averageQuality / itemsBeanList.size())) +
                                ", 創意分:" + df.format((averageOriginality / itemsBeanList.size()));

                        //模擬已評價成功
                        Toast.makeText(getApplicationContext(), content, Toast.LENGTH_SHORT).show();
                        finish();
                    }
                }
            });

總結

到這裏已經把整個流程跑完了,整個過程並沒有複雜的東西,都是大家平時經常寫的,比較難得地方應該是在列表中需要完成多個商品的打星及用戶留言數據的保存,我這裏的處理是當用戶打完星或者輸入留言之後保存數據,整個流程還是比較簡單的。

需要源碼的童鞋底部公衆號回覆:“評分系統”即可獲取


以下是公衆號(longxuanzhigu),之後發佈的文章會同步到該公衆號,方便交流學習Android知識,歡迎關注:
在這裏插入圖片描述

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章