本篇博客将在前两篇基础上,完成第三个页面购物车页面的基本逻辑代码以及最后支付界面的布局绘制,实现效果图如下:
在商品列表界面的分析中,可知通过购物车的图标点击跳转到购物车界面,然后获取统一数据的buyList集合作为ListView列表的数据源展示,购物车界面布局与商品列表界面布局相似,上中下结构,下面为一个按钮和总计金额TextView表示,金额会随着购物车的内容变化发生改变。
购物车布局activity_shop.xml代码如下:
ListView列表的每一个item的布局与商品列表界面相似,只不过将购买按钮,编程购物车删除按钮,故布局改变不大,其item布局item_shop.xml代码如下:
布局中返回按钮逻辑和前两个界面相同,列表数据源为buyList,需要设置适配器将其填充到列表视图中,适配器的代码如下:
package com.animee.day06.hw;
import android.content.Context;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.TextView;
import com.animee.day06.R;
import com.squareup.picasso.Picasso;
import java.util.List;
public class ShopAdapter extends BaseAdapter{
Context context;
ListmDatas;
public ShopAdapter(Context context, List mDatas) {
this.context = context;
this.mDatas = mDatas;
}
@Override
public int getCount() {
return mDatas.size();
}
@Override
public Object getItem(int position) {
return mDatas.get(position);
}
@Override
public long getItemId(int position) {
return position;
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
ViewHolder holder = null;
if (convertView == null) {
convertView = LayoutInflater.from(context).inflate(R.layout.item_shop,null);
holder = new ViewHolder();
holder.backIv = convertView.findViewById(R.id.item_shop_iv);
holder.ljIv = convertView.findViewById(R.id.item_shop_laji);
holder.titleTv = convertView.findViewById(R.id.item_shop_tv_title);
holder.priceTv = convertView.findViewById(R.id.item_shop_tv_price);
holder.kindTv = convertView.findViewById(R.id.item_shop_tv_kind);
holder.amountView = convertView.findViewById(R.id.item_shop_av);
convertView.setTag(holder);
}else {
holder = (ViewHolder) convertView.getTag();
}
// 获取对应位置显示数据
final InfoBean infoBean = mDatas.get(position);
Picasso.with(context).load(infoBean.getPic()).into(holder.backIv);
holder.titleTv.setText(infoBean.getTitle());
holder.priceTv.setText("¥"+infoBean.getPrice());
holder.kindTv.setText(infoBean.getKind());
// 获取购买数量,显示在中间的EditText中
Log.i("animee", "getView: "+infoBean.getBuycount());
holder.amountView.setAmountText(infoBean.getBuycount());
holder.amountView.setGoods_storage(infoBean.getCount()); //设置最大值,库存
holder.amountView.setOnAmountChangeListener(new AmountView.OnAmountChangeListener() {
@Override
public void onAmountChange(View view, int amount) {
if (infoBean!=null) {
// 重新设置购买数量
infoBean.setBuycount(amount);
((ShopActivity)context).caculateTotalMoney();
}
}
});
// 设置垃圾图标的点击事件
holder.ljIv.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
// 取消购买,删除购买列表的数据
ContentDatas.buyList.remove(infoBean);
mDatas.remove(infoBean); //将当前的数据减少
notifyDataSetChanged(); //通知更新数据
// 当删除时,重新计算价格,并且重新设置给TextView
((ShopActivity)context).caculateTotalMoney();
}
});
return convertView;
}
class ViewHolder{
ImageView backIv,ljIv;
TextView titleTv,kindTv,priceTv;
AmountView amountView;
}
}
在适配器中监听AmountView的数据变化,以及删除按钮的点击状态,实施刷新列表视图展示和重新计算目前总计金额,所以调用了其所属的activity当中的caculateTotalMoney的方法,ShopActivity的逻辑代码如下:
package com.animee.day06.hw;
import android.content.Intent;
import android.os.Handler;
import android.os.Message;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.ListView;
import android.widget.TextView;
import com.animee.day06.R;
import java.util.List;
public class ShopActivity extends AppCompatActivity implements View.OnClickListener{
ImageView backIv;
ListView shopLv;
Button calcBtn;
TextView calTv;
private List buyList;
private ShopAdapter shopAdapter;
Handler handler = new Handler(){
@Override
public void handleMessage(Message msg) {
super.handleMessage(msg);
// 更新数据源,重构数据
shopAdapter.notifyDataSetChanged();
}
};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_shop);
// 查找控件
backIv = findViewById(R.id.shop_daily_back);
shopLv = findViewById(R.id.shop_daily_lv);
calcBtn = findViewById(R.id.shop_calculate_btn);
calTv = findViewById(R.id.shop_cal_tv);
// 给返回按钮设定点击事件
backIv.setOnClickListener(this);
calcBtn.setOnClickListener(this);
// ListView数据源
buyList = ContentDatas.buyList;
// 设置适配器
shopAdapter = new ShopAdapter(this, buyList);
shopLv.setAdapter(shopAdapter);
handler.sendEmptyMessageDelayed(1,2000);
caculateTotalMoney(); //计算总钱数,显示在TextView上
}
// 计算购物车中购买的商品价格的方法
public void caculateTotalMoney(){
List buyList = ContentDatas.buyList;
double total_money = 0;
for (int i = 0; i < buyList.size(); i++) {
InfoBean bean = buyList.get(i);
double price = bean.getPrice();
int buycount = bean.getBuycount();
total_money=price*buycount+total_money;
}
calTv.setText("¥"+total_money);
}
@Override
public void onClick(View v) {
switch (v.getId()) {
case R.id.shop_daily_back:
finish();
break;
case R.id.shop_calculate_btn:
Intent intent = new Intent(this, PayActivity.class);
startActivity(intent);
break;
}
}
}
在点击结算按钮后,会跳转到选择支付方式界面,这里我只绘制了其布局,并未在activity当中进行逻辑处理,布局activity_pay.xml代码为:
顺便也贴一下其对应的PayActivity的代码吧:
package com.animee.day06.hw;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import com.animee.day06.R;
public class PayActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_pay);
}
}
按照这三篇博客的编写步骤,捋顺思路,就能在毕业项目中添加商城功能了,不信,可以试试~~
商城列表与购物车展示(一)
商城列表与购物车展示(二)
案例讲解代码下载地址