當前位置：首頁 > 运维知识 > Android >内容正文

Android

云炬Android开发笔记 13购物车，订单，支付功能开发（包含支付宝支付和微信支付）

發布時間：2025/3/15 Android 13 豆豆

生活随笔收集整理的這篇文章主要介紹了云炬Android开发笔记 13购物车，订单，支付功能开发（包含支付宝支付和微信支付）小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

閱讀目錄

1.購物車UI編寫

1.1 購物車布局
?1.2 recycleView中的item的布局
2. 購物車數據結構分析、解析與轉化

2.1 解析的數據
2.2 數據的轉化
2.3 數據適配器的添加
3. 購物車邏輯梳理與實現

3.1 是否選中的事件的響應
3.2 全選按鈕事件的響應
?3.3 閃屏bug
3.4 刪除按鈕的功能實現
3.5 清空購物車
?3.6 清空購物車之后的額外內容的顯示
?3.7 左右加號減號的功能的實現
3.8 結算功能的實現?
4.訂單和支付邏輯梳理和處理

4.1 支付的流程
4.2 額外梳理、整理module結構、升級依賴、更好的進行分離
5. 封裝傻瓜式操作支付工具
?6.支付寶的接入和實現支付
7.微信支付和通過代碼生成器生成支付代碼

回到頂部

1.購物車UI編寫

回到頂部

1.1 購物車布局

【新建包和類】

【ToolBar的布局】

1 <?xml version="1.0" encoding="utf-8"?>2 <android.support.v7.widget.LinearLayoutCompat xmlns:android="http://schemas.android.com/apk/res/android"3 xmlns:tools="http://schemas.android.com/tools"4 android:layout_width="match_parent"5 android:layout_height="match_parent"6 android:background="#1111"7 android:orientation="vertical">8 9 <android.support.v7.widget.Toolbar10 android:layout_width="match_parent"11 android:layout_height="75dp"12 android:background="@color/app_main"13 android:gravity="center">14 15 <RelativeLayout16 android:layout_width="match_parent"17 android:layout_height="match_parent">18 19 <android.support.v7.widget.AppCompatTextView20 android:id="@+id/tv_top_shop_cart_clear"21 android:layout_width="wrap_content"22 android:layout_height="match_parent"23 android:layout_alignParentLeft="true"24 android:layout_marginLeft="20dp"25 android:gravity="center"26 android:text="清空"27 android:textColor="@android:color/white"28 android:textSize="18sp"29 tools:ignore="HardcodedText,RtlHardcoded" />30 31 <android.support.v7.widget.AppCompatTextView32 android:layout_width="wrap_content"33 android:layout_height="match_parent"34 android:layout_centerHorizontal="true"35 android:gravity="center"36 android:text="購物車"37 android:textColor="@android:color/white"38 android:textSize="20sp"39 tools:ignore="HardcodedText" />40 41 <android.support.v7.widget.AppCompatTextView42 android:id="@+id/tv_top_shop_cart_remove_selected"43 android:layout_width="wrap_content"44 android:layout_height="match_parent"45 android:layout_alignParentRight="true"46 android:layout_marginLeft="20dp"47 android:layout_marginRight="20dp"48 android:gravity="center"49 android:text="刪除"50 android:textColor="@android:color/white"51 android:textSize="18sp"52 tools:ignore="HardcodedText,RtlHardcoded" />53 </RelativeLayout>54 </android.support.v7.widget.Toolbar>55 56 <android.support.v7.widget.RecyclerView //購物車中的貨物展示都是使用recyclerView控件顯示的57 android:id="@+id/rv_shop_cart"58 android:layout_width="match_parent"59 android:layout_height="0dp"60 android:layout_weight="8" />61 62 <android.support.v7.widget.ViewStubCompat //如果購物車中沒有貨物，進行占位的功能63 android:id="@+id/stub_no_item"64 android:layout_width="match_parent"65 android:layout_height="0dp"66 android:layout_weight="8"67 android:background="@android:color/white"68 android:layout="@layout/stub_shop_cart_no_item"69 android:minHeight="50dp"70 android:orientation="horizontal" />71 72 <android.support.v7.widget.LinearLayoutCompat73 android:layout_width="match_parent"74 android:layout_height="0dp"75 android:layout_gravity="bottom"76 android:layout_weight="1"77 android:minHeight="50dp"78 android:orientation="horizontal">79 80 81 <android.support.v7.widget.LinearLayoutCompat82 android:layout_width="0dp"83 android:layout_height="match_parent"84 android:layout_weight="1"85 android:minHeight="50dp"86 android:orientation="horizontal">87 88 <com.joanzapata.iconify.widget.IconTextView89 android:id="@+id/icon_shop_cart_select_all"90 android:layout_width="0dp"91 android:layout_height="match_parent"92 android:layout_weight="1"93 android:gravity="center"94 android:text="{fa-check-circle}"95 android:textColor="@android:color/darker_gray"96 android:textSize="20sp" />97 98 <android.support.v7.widget.AppCompatTextView99 android:layout_width="0dp" 100 android:layout_height="match_parent" 101 android:layout_weight="1" 102 android:gravity="center" 103 android:text="全選" 104 android:textColor="@color/app_main" /> 105 </android.support.v7.widget.LinearLayoutCompat> 106  107 108  109 <android.support.v7.widget.LinearLayoutCompat 110 android:layout_width="0dp" 111 android:layout_height="match_parent" 112 android:layout_weight="2" 113 android:minHeight="50dp" 114 android:orientation="horizontal"> 115 116 <android.support.v7.widget.AppCompatTextView 117 android:layout_width="0dp" 118 android:layout_height="match_parent" 119 android:layout_weight="1" 120 android:gravity="center" 121 android:text="合計" 122 android:textColor="@android:color/darker_gray" 123 tools:ignore="HardcodedText" /> 124 125 <android.support.v7.widget.AppCompatTextView 126 android:id="@+id/tv_shop_cart_total_price" 127 android:layout_width="0dp" 128 android:layout_height="match_parent" 129 android:layout_weight="1" 130 android:gravity="center|left" 131 android:text="￥0.01" 132 android:textColor="@color/app_main" 133 android:textSize="20sp" 134 tools:ignore="HardcodedText,RtlHardcoded" /> 135 136 </android.support.v7.widget.LinearLayoutCompat> 137 138 <android.support.v7.widget.AppCompatTextView 139 android:id="@+id/tv_shop_cart_pay" 140 android:layout_width="0dp" 141 android:layout_height="match_parent" 142 android:layout_weight="1" 143 android:background="@color/app_main" 144 android:gravity="center" 145 android:text="結算" 146 android:textColor="@android:color/white" 147 android:textSize="20sp" 148 tools:ignore="HardcodedText" /> 149 150 </android.support.v7.widget.LinearLayoutCompat> 151 152 </android.support.v7.widget.LinearLayoutCompat>

回到頂部

?1.2 recycleView中的item的布局

1 <?xml version="1.0" encoding="utf-8"?>2 <android.support.v7.widget.LinearLayoutCompat 3 xmlns:android="http://schemas.android.com/apk/res/android"4 xmlns:tools="http://schemas.android.com/tools"5 android:layout_width="match_parent"6 android:layout_height="100dp"7 android:layout_marginBottom="5dp"8 android:background="@android:color/white"9 android:orientation="horizontal">10 11 <com.joanzapata.iconify.widget.IconTextView12 android:id="@+id/icon_item_shop_cart"13 android:layout_width="wrap_content"14 android:layout_height="wrap_content"15 android:layout_gravity="center_vertical"16 android:layout_marginLeft="10dp"17 android:gravity="center"18 android:text="{fa-check-circle}"19 android:textColor="@android:color/darker_gray"20 tools:ignore="HardcodedText,RtlHardcoded" />21 22 <android.support.v7.widget.AppCompatImageView23 android:id="@+id/image_item_shop_cart"24 android:layout_width="80dp"25 android:layout_height="80dp"26 android:layout_gravity="center_vertical"27 android:layout_marginLeft="10dp"28 android:layout_marginRight="10dp" />29 30 31 <android.support.v7.widget.LinearLayoutCompat32 android:layout_width="0dp"33 android:layout_height="match_parent"34 android:layout_weight="2"35 android:gravity="center_vertical"36 android:orientation="vertical"37 android:padding="10dp">38 39 <android.support.v7.widget.AppCompatTextView40 android:id="@+id/tv_item_shop_cart_title"41 android:layout_width="wrap_content"42 android:layout_height="wrap_content"43 android:layout_marginBottom="5dp"44 android:text="商品標題"45 tools:ignore="HardcodedText" />46 47 <android.support.v7.widget.AppCompatTextView48 android:id="@+id/tv_item_shop_cart_desc"49 android:layout_width="wrap_content"50 android:layout_height="wrap_content"51 android:layout_marginBottom="5dp"52 android:text="商品描述"53 tools:ignore="HardcodedText" />54 55 <android.support.v7.widget.AppCompatTextView56 android:id="@+id/tv_item_shop_cart_price"57 android:layout_width="wrap_content"58 android:layout_height="wrap_content"59 android:text="2.00"60 android:textColor="@color/app_main"61 android:typeface="monospace"62 tools:ignore="HardcodedText" />63 </android.support.v7.widget.LinearLayoutCompat>64 65 66 <android.support.v7.widget.LinearLayoutCompat67 android:layout_width="0dp"68 android:layout_height="match_parent"69 android:layout_marginBottom="20dp"70 android:layout_weight="1"71 android:gravity="bottom"72 android:orientation="horizontal">73 74 <com.joanzapata.iconify.widget.IconTextView75 android:id="@+id/icon_item_minus"76 android:layout_width="20dp"77 android:layout_height="20dp"78 android:gravity="center"79 android:text="{fa-minus-square-o}"80 android:textSize="24sp"81 tools:ignore="HardcodedText" />82 83 <android.support.v7.widget.AppCompatTextView84 android:id="@+id/tv_item_shop_cart_count"85 android:layout_width="20dp"86 android:layout_height="20dp"87 android:gravity="center"88 android:text="1"89 android:textSize="18sp"90 tools:ignore="HardcodedText" />91 92 <com.joanzapata.iconify.widget.IconTextView93 android:id="@+id/icon_item_plus"94 android:layout_width="20dp"95 android:layout_height="20dp"96 android:gravity="center"97 android:text="{fa-plus-square-o}"98 android:textSize="24sp"99 tools:ignore="HardcodedText" /> 100 101 </android.support.v7.widget.LinearLayoutCompat> 102 103 </android.support.v7.widget.LinearLayoutCompat>

回到頂部

2. 購物車數據結構分析、解析與轉化

回到頂部

2.1 解析的數據

【json數據】data中的每個字段就是要解析的item的數據；

回到頂部

2.2 數據的轉化

【構建entivity】

回到頂部

2.3 數據適配器的添加

【添加購物車的布局】

【取出所有的值】

【取出控件】

【賦值】

【設置適配器】

?[視圖綁定]

回到頂部

3. 購物車邏輯梳理與實現

回到頂部

3.1 是否選中的事件的響應

【完成icon的點擊事件】

【說明】此處的點擊事件：不要實現接口，要單獨的書寫onClick方法，否則，每個item無法響應事件；

回到頂部

3.2 全選按鈕事件的響應

【item對全選事件的響應】

【完善】

【item對全選狀態的改變】

【效果】但是會閃一下，需要去除掉更新的動畫效果；

回到頂部

?3.3 閃屏bug

回到頂部

3.4 刪除按鈕的功能實現

回到頂部

3.5 清空購物車

【修改】

回到頂部

?3.6 清空購物車之后的額外內容的顯示

【原理】填充一個新的View；

【調用】

【bug1】

【bug2】下半部變得很寬

回到頂部

?3.7 左右加號減號的功能的實現

【減號功能的實現】與服務器的數據實時的進行更新同步；每次都需要請求服務器更新數據；

?【加號功能的實現】

回到頂部

3.8 結算功能的實現?

【接口的定義】因為在全選、點擊加減按鈕的時候，都需要進行全局的數據的價格的更新，以接口的形式返回數據；

【取出總價】

【BUG】

【現象】之前顯示的數據是不正確的；現在增加一個變量；

回到頂部

4.訂單和支付邏輯梳理和處理

回到頂部

4.1 支付的流程

【說明】需要我們自己的服務向第三方的支付平臺進行請求，然后進行認證等之后返回狀態；

【區別】區別訂單和支付的不同；

回到頂部

4.2 額外梳理、整理module結構、升級依賴、更好的進行分離

【fragment的依賴的處理】已經進行了升級；降低了耦合度；

回到頂部

5. 封裝傻瓜式操作支付工具

【說明】主要是界面的布局和完善；

【引入依賴】

【封裝返回狀態的回調接口】

【封裝工具類】

[注意]更新fragment的依賴之后的mActivity有所改變；

【彈框的layout】

1 <?xml version="1.0" encoding="utf-8"?>2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"3 xmlns:tools="http://schemas.android.com/tools"4 android:layout_width="match_parent"5 android:layout_height="wrap_content"6 android:background="@android:color/white"7 android:orientation="vertical"8 android:paddingBottom="20dp">9 10 <LinearLayout 11 android:layout_width="match_parent" 12 android:layout_height="200dp" 13 android:orientation="horizontal"> 14 15 <com.joanzapata.iconify.widget.IconTextView 16 android:id="@+id/btn_dialog_pay_alpay" 17 android:layout_width="0dp" 18 android:layout_height="match_parent" 19 android:layout_weight="1" 20 android:gravity="center" 21 android:text="{icon-ali-pay}" 22 android:textColor="@android:color/holo_blue_bright" 23 android:textSize="50sp" 24 tools:ignore="HardcodedText" /> 25 26 <com.joanzapata.iconify.widget.IconTextView 27 android:id="@+id/btn_dialog_pay_wechat" 28 android:layout_width="0dp" 29 android:layout_height="match_parent" 30 android:layout_weight="1" 31 android:gravity="center" 32 android:text="{fa-weixin}" 33 android:textColor="#04b00f" 34 android:textSize="50sp" 35 tools:ignore="HardcodedText" /> 36 </LinearLayout> 37 38 <Button 39 android:id="@+id/btn_dialog_pay_cancel" 40 android:layout_width="match_parent" 41 android:layout_height="50dp" 42 android:layout_marginLeft="50dp" 43 android:layout_marginRight="50dp" 44 android:background="@color/app_main" 45 android:gravity="center" 46 android:text="取消支付" 47 android:textColor="@android:color/white" 48 android:textSize="16sp" /> 49 50 </LinearLayout>

?【完善支付工具類】

【增加動畫】從底向上的動畫封裝

【設置動畫和屬性】

【設置點擊事件的響應】

?【響應點擊事件】

回到頂部

?6.支付寶的接入和實現支付

【異步類的封裝】

【根據返回的狀態進行處理】

1 package com.flj.latte.ec.pay;2 3 import android.app.Activity;4 import android.os.AsyncTask;5 6 import com.alipay.sdk.app.PayTask;7 import com.flj.latte.ui.loader.LatteLoader;8 import com.flj.latte.util.log.LatteLogger;9 13 14 public class PayAsyncTask extends AsyncTask<String, Void, String> { 15 16 private final Activity ACTIVITY; 17 private final IAlPayResultListener LISTENER; 18 19 //訂單支付成功 20 private static final String AL_PAY_STATUS_SUCCESS = "9000"; 21 //訂單處理中 22 private static final String AL_PAY_STATUS_PAYING = "8000"; 23 //訂單支付失敗 24 private static final String AL_PAY_STATUS_FAIL = "4000"; 25 //用戶取消 26 private static final String AL_PAY_STATUS_CANCEL = "6001"; 27 //支付網絡錯誤 28 private static final String AL_PAY_STATUS_CONNECT_ERROR = "6002"; 29 30 public PayAsyncTask(Activity activity, IAlPayResultListener listener) { 31 this.ACTIVITY = activity; 32 this.LISTENER = listener; 33 } 34 35 @Override 36 protected String doInBackground(String... params) { 37 final String alPaySign = params[0]; 38 final PayTask payTask = new PayTask(ACTIVITY); 39 return payTask.pay(alPaySign, true); 40 } 41 42 @Override 43 protected void onPostExecute(String result) { 44 super.onPostExecute(result); 45 LatteLoader.stopLoading(); 46 final PayResult payResult = new PayResult(result); 47 // 支付寶返回此次支付結構及加簽，建議對支付寶簽名信息拿簽約是支付寶提供的公鑰做驗簽 48 final String resultInfo = payResult.getResult(); 49 final String resultStatus = payResult.getResultStatus(); 50 LatteLogger.d("AL_PAY_RESULT", resultInfo); 51 LatteLogger.d("AL_PAY_RESULT", resultStatus); 52 53 switch (resultStatus) { 54 case AL_PAY_STATUS_SUCCESS: 55 if (LISTENER != null) { 56 LISTENER.onPaySuccess(); 57 } 58 break; 59 case AL_PAY_STATUS_FAIL: 60 if (LISTENER != null) { 61 LISTENER.onPayFail(); 62 } 63 break; 64 case AL_PAY_STATUS_PAYING: 65 if (LISTENER != null) { 66 LISTENER.onPaying(); 67 } 68 break; 69 case AL_PAY_STATUS_CANCEL: 70 if (LISTENER != null) { 71 LISTENER.onPayCancel(); 72 } 73 break; 74 case AL_PAY_STATUS_CONNECT_ERROR: 75 if (LISTENER != null) { 76 LISTENER.onPayConnectError(); 77 } 78 break; 79 default: 80 break; 81 } 82 } 83 }

?【結果的處理】

【在購物車結算中進行調用】

回到頂部

7.微信支付和通過代碼生成器生成支付代碼

總結

以上是生活随笔為你收集整理的云炬Android开发笔记 13购物车，订单，支付功能开发（包含支付宝支付和微信支付）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。

上一篇：做程序员的这五年
下一篇：从月薪2300女工到年薪70万谷歌程序员