本項目來自菜鳥窩,有興趣者點擊http://www.cniao5.com/course/
項目已經(jīng)做完晓锻,
https://github.com/15829238397/CN5E-shop
仿京東商城系列0------項目簡介
仿京東商城系列1------fragmentTabHost實現(xiàn)底部導(dǎo)航欄
仿京東商城系列2------自定義toolbar
仿京東商城系列3------封裝Okhttp
仿京東商城系列4------輪播廣告條
仿京東商城系列5------商品推薦欄
仿京東商城系列6------下拉刷新上拉加載的商品列表
仿京東商城系列7------商品分類頁面
仿京東商城系列8------自定義的數(shù)量控制器
仿京東商城系列9------購物車數(shù)據(jù)存儲器實現(xiàn)
仿京東商城系列10------添加購物車歌焦,管理購物車功能實現(xiàn)
仿京東商城系列11------商品排序功能以及布局切換實現(xiàn)(Tablayout)
仿京東商城系列12------商品詳細信息展示(nativie與html交互)
仿京東商城系列13------商品分享(shareSDK)
仿京東商城系列14------用戶登錄以及app登錄攔截
仿京東長城系列15------用戶注冊,SMSSDK集成
仿京東商城系列16------支付SDK集成
仿京東商城系列17------支付功能實現(xiàn)
仿京東商城系列18------xml文件讀妊舛摺(地址選擇器)
仿京東商城系列19------九宮格訂單展示
仿京東商城系列20------終章
前言
之前我們講了自定義控件NumControlerView (數(shù)量控制器)以及封裝的購物車數(shù)據(jù)庫存儲器的實現(xiàn)独撇。接下來我們便可以完善購物車的功能結(jié)構(gòu)。先看后做躁锁,上效果圖:
內(nèi)容
- 頁面設(shè)計:
購物車頁面如上圖所示纷铣,有兩個頁面(商品結(jié)算頁面,購物車信息編輯頁面)
1.商品結(jié)算頁面战转,最上層是一個自定義toolbar(右端有編輯按鈕搜立,點擊跳轉(zhuǎn)為編輯頁面),然后是一個RecyclerView(展示被加入購物車的商品信息)槐秧,在下方有結(jié)算按鈕和總價統(tǒng)計還有全選按鈕啄踊。
2.購物車信息編輯頁面,最上層是一個自定義toolbar(右端有完成按鈕刁标,點擊跳轉(zhuǎn)為結(jié)算頁面)颠通,然后是一個RecyclerView(展示被加入購物車的商品信息),在下方刪除按鈕膀懈,全選按鈕顿锰。
具體布局代碼:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.example.cne_shop.widget.CnToolbar
android:id="@+id/toolBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?attr/actionBarSize"
android:minWidth="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:title="購物車"
android:titleTextColor="@color/white"
app:isShowSearchView="false"
app:rightButtonText="編輯"
></com.example.cne_shop.widget.CnToolbar>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.RecyclerView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="@+id/sumPart"
android:layout_alignParentTop="true"
android:id="@+id/recycleView">
</android.support.v7.widget.RecyclerView>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/sumPart"
android:layout_alignParentBottom="true"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:gravity="center_vertical"
android:background="@color/cardview_shadow_start_color"
>
<CheckBox
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/checkbox_all"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:checked="true"
android:paddingLeft="5dp"
style="@style/CustomCheckboxTheme"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="5dp"
android:paddingRight="10dp"
android:text="全選"
android:layout_centerVertical="true"
android:layout_toRightOf="@+id/checkbox_all"
android:id="@+id/allSelect"
/>
<TextView
android:id="@+id/txt_total"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="@color/white"
android:text="合計 ¥0.0"
android:layout_centerVertical="true"
android:layout_toRightOf="@+id/allSelect"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_alignParentRight="true"
android:text="去結(jié)算"
android:id="@+id/pay_button"
android:textColor="@color/white"
android:background="@color/red"/>
</RelativeLayout>
</RelativeLayout>
</LinearLayout>
功能分析:
在進行代碼設(shè)計之前,我們先對購物車頁面功能進行分析。
1.添加商品和商品展示硼控。
2.改變商品數(shù)量
3.選擇刪除已添加的商品
4.選擇結(jié)算商品去結(jié)算添加商品和商品展示流程:
1.例如當(dāng)點擊hot頁面的立即購買按鈕時刘陶,將會調(diào)用添加購物車方法。我們將選中商品的信息賦值到ShoppingCat類型的對象里牢撼。
1.1將商品的信息賦值到ShoppingCat類型的對象
public ShoppingCart toShoppinfCart(){
ShoppingCart cart = new ShoppingCart() ;
cart.setId(this.id);
cart.setCount(1);
cart.setChecked(true);
cart.setImgUrl(this.imgUrl);
cart.setName(this.name);
cart.setPrice(this.price);
return cart ;
}
2.得到該對象后將該對象用我們之前封裝的Cartprovider(購物車數(shù)據(jù)存儲器)將該對象信息以Json字符串的格式存入SharedPreferences中匙隔,而購物車頁面的ReclerviewAdapter會立即重新從SharedPreferences加載商品信息,并展示浪默。
public void addToCart( int position ){
Ware hotGoodsMsgPart = mHotAdapter.getData(position) ;
CartProvider.getCartProvider(getContext()) .put( hotGoodsMsgPart );
Toast.makeText( getContext() , "已添加到購物車" , Toast.LENGTH_SHORT ).show();
}
- 改變商品數(shù)量:
1.當(dāng)點擊數(shù)量控制器的+/-號時牡直,顯示的數(shù)據(jù)會發(fā)生改變之外,會立即更改SharedPreferences內(nèi)存儲的數(shù)據(jù)纳决。
cartAdapter.setNumControlerListener(new CartAdapter.NumControlerListener() {
@Override
public void onAdd(int position , int value) {
Log.d("----" , "點擊了+++控件") ;
if (shoppingCarts == null)
shoppingCarts = cartProvider.getAll();
shoppingCarts.get(position).setCount(value);
cartProvider.update(shoppingCarts.get(position));
getSum();
}
@Override
public void onSub(int position , int value) {
Log.d("----" , "點擊了---控件") ;
if (shoppingCarts == null)
shoppingCarts = cartProvider.getAll();
shoppingCarts.get(position).setCount(value);
cartProvider.update(shoppingCarts.get(position));
getSum();
}
});
- 選擇刪除已添加的商品:
1.點擊自定義Toolbar右邊的編輯按鈕碰逸,切換編輯按鈕。
2.選擇要刪除的按鈕即可刪除阔加。在選擇刪除的時候立即刪除SharedPreferences內(nèi)存儲的數(shù)據(jù)饵史。刷新界面。
pay_button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
if(statua == STATUS_NORNAL){
//去結(jié)算
}else if (statua == STATUS_EDIT){
deleteCartData() ;
}
}
});
-選擇結(jié)算商品
結(jié)算功能將在后面博文講述胜榔。
購物車的功能就先講到這里胳喷,結(jié)算的功能將方法到后續(xù)繼續(xù)介紹。有興趣的可以點擊頁首的git地址查看工程源碼夭织。