前言
之前我们讲了自定义控件NumControlerView (数量控制器)以及封装的购物车数据库存储器的实现。接下来我们便可以完善购物车的功能结构。先看后做,上效果图:
购物车.gif
内容
页面设计:
购物车页面如上图所示,有两个页面(商品结算页面,购物车信息编辑页面)
1.商品结算页面,最上层是一个自定义toolbar(右端有编辑按钮,点击跳转为编辑页面),然后是一个RecyclerView(展示被加入购物车的商品信息),在下方有结算按钮和总价统计还有全选按钮。
2.购物车信息编辑页面,最上层是一个自定义toolbar(右端有完成按钮,点击跳转为结算页面),然后是一个RecyclerView(展示被加入购物车的商品信息),在下方删除按钮,全选按钮。
具体布局代码:
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
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="编辑"
>
android:layout_width="match_parent"
android:layout_height="match_parent">
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="@+id/sumPart"
android:layout_alignParentTop="true"
android:id="@+id/recycleView">
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"
>
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"
/>
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"
/>
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"
/>
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_alignParentRight="true"
android:text="去结算"
android:id="@+id/pay_button"
android:textColor="@color/white"
android:background="@color/red"/>
功能分析:
在进行代码设计之前,我们先对购物车页面功能进行分析。
1.添加商品和商品展示。
2.改变商品数量
3.选择删除已添加的商品
4.选择结算商品去结算
添加商品和商品展示流程:
1.例如当点击hot页面的立即购买按钮时,将会调用添加购物车方法。我们将选中商品的信息赋值到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(购物车数据存储器)将该对象信息以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();
}
改变商品数量:
1.当点击数量控制器的+/-号时,显示的数据会发生改变之外,会立即更改SharedPreferences内存储的数据。
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内存储的数据。刷新界面。
pay_button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
if(statua == STATUS_NORNAL){
//去结算
}else if (statua == STATUS_EDIT){
deleteCartData() ;
}
}
});
-选择结算商品
结算功能将在后面博文讲述。
购物车的功能就先讲到这里,结算的功能将方法到后续继续介绍。有兴趣的可以点击页首的git地址查看工程源码。