最近应公司要求，到某大学进行毕设项目实训讲解，今天在课上讲解内容主要围绕在商城功能展开，因为没有服务器提供后台数据，所以使用虚拟数据，在代码中创建集合的用于展示。基本逻辑与后台服务提供数据的逻辑也相似。毕设中有需要相同功能的同学可以借鉴一下，以下的逻辑思路与实现代码。
代码实现效果图如下：
需求分析:
- 展示效果为四个界面，界面间都是通过前一个点击相关内容，跳转显示，故在此功能中应该需要创建四个Activity展示。
- 第一个界面为日常用品分类展示，上面为标题栏内容，下面为一个ListView，每一个item当中包括1个TextView和一个ImageView展示，而需要通过适配器加载显示数据。
- 第二个界面为选择分类后的具体商品展示，布局结构与分类界面相似，只不过每一个item的子布局更复杂一些。
- 第三个界面为购物车界面，点击商品列表界面右上角的购物车图标，即可跳转此界面，此界面分为上中下结构，上面为标题栏内容，下面包括总计金额和结算按钮，中间为选择购买的商品的列表，依然需要使用ListView展示，item的布局结构与商品列表中item的布局结构相似，只需要把购买按钮变成删除按钮即可。
- 第四个界面为支付界面，在此界面中可填写收货人的相关信息并选择支付方式，但是在毕设项目中并不能使用支付宝支付，故我只完成了布局效果，并没有对其支付和信息填写的逻辑进行代码实现。
在本篇博客中我首先会对于第一个页面的基本逻辑进行重点分析，实现代码进行具体展示。
查看效果图会发现，日常用品的分类应该需要一个List集合进行存放，然后每一种用品有包括多个商品对象，可以创建一个类用于表示商品信息，也便于对其进行操作。故我们创建商品类。
package com.animee.day06.hw;
/* 表示每一个用品对象*/
public class InfoBean {
private String pic; //图片地址
private String title; //标题
private String kind; //种类
private int count; //库存
private double price; //价格
private int buycount = 0; //购买数量
public InfoBean() {}
public InfoBean(String pic, String title, String kind, int count, double price, int buycount) {
this.pic = pic;
this.title = title;
this.kind = kind;
this.count = count;
this.price = price;
this.buycount = buycount;
}
public int getBuycount() {
return buycount;
}
public void setBuycount(int buycount) {
this.buycount = buycount;
}
public String getPic() {
return pic;
}
public void setPic(String pic) {
this.pic = pic;
}
public String getTitle() {
return title;
}
public void setTitle(String title) {
this.title = title;
}
public String getKind() {
return kind;
}
public void setKind(String kind) {
this.kind = kind;
}
public int getCount() {
return count;
}
public void setCount(int count) {
this.count = count;
}
public double getPrice() {
return price;
}
public void setPrice(double price) {
this.price = price;
}
public InfoBean(String pic, String title, String kind, int count, double price) {
this.pic = pic;
this.title = title;
this.kind = kind;
this.count = count;
this.price = price;
}
}
然后可以创建商品对象，存放到集合当中，同时每个种类对应一个集合，最后再将这些种类对应的集合统一存放到一个大集合中，因为需要写本地的假数据，所以我创建一个数据类，便于管理，后面有对于购买多个商品的操作，故先创建一个表示购买商品清单的List集合。数据管理类如下：
package com.animee.day06.hw;
import java.util.ArrayList;
import java.util.Arrays;
import java.util.List;
public class ContentDatas {
public static List<String>dailyKindList
= Arrays.asList(new String[]{"调料干货","零食","饮料","烟酒","厨房用品","日用品","清洁用品","洗化用品"});
// 调料干货集合
public static List<InfoBean>dryList
= Arrays.asList(new InfoBean[]{
new InfoBean("https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=3703170131,3477248987&fm=26&gp=0.jpg","低钠盐","日常用品-调料干货",100,14.00),
new InfoBean("https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1558959593631&di=9e7d2c39a8fd129488ce2f716c9ef32c&imgtype=0&src=http%3A%2F%2Fcbu01.alicdn.com%2Fimg%2Fibank%2F2016%2F940%2F697%2F2869796049_1463791172.400x400.jpg","优质白砂糖","日常用品-调料干货",350,16.50),
new InfoBean("https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1558959626079&di=f028c38bfb88fa9404539fbe16caa7ef&imgtype=0&src=http%3A%2F%2Fm.360buyimg.com%2Fn12%2Fjfs%2Ft2488%2F176%2F440192277%2F97410%2F8dba406%2F560a1145Nf87adca4.jpg%2521q70.jpg","老姜红糖","日常用品-调料干货",350,24.50),
new InfoBean("https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=992868751,2684766887&fm=26&gp=0.jpg","太太乐鸡精","日常用品-调料干货",350,18.50),
new InfoBean("https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1558959683844&di=d5512135524cb543455d12cb649d678a&imgtype=0&src=http%3A%2F%2Fimg1.ccjoin.com%2Fdata%2Ffiles%2Fstore_6986%2Fgoods_125%2F300x300_201409282055256595.jpg","金龙鱼实用调和油","日常用品-调料干货",350,41.00),
new InfoBean("https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=1917815360,1188869590&fm=15&gp=0.jpg","福临门实用调和油","日常用品-调料干货",250,46.50),
});
// 零食集合
public static List<InfoBean>snackList
=Arrays.asList(new InfoBean[]{
new InfoBean("https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1558959888575&di=af51515d95139058b2b0905e4c944e3a&imgtype=0&src=http%3A%2F%2Fimage.lingshi.com%2Fimages%2F201103%2Fgoods_img%2F1590_P_1300418830835.JPG","旺旺维粒多","日常用品-零食",200,3.5),
new InfoBean("https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1558959973239&di=903ae3d672b4990f28ab69094059188e&imgtype=0&src=http%3A%2F%2Fimage.lingshi.com%2Fnewimages%2F08%2F0808%2F08080294%2Fdetail%2Fb3_05.jpg","鱿鱼卷","日常用品-零食",200,14.3),
new InfoBean("https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=1596631730,2568808696&fm=26&gp=0.jpg","乐事分享装","日常用品-零食",200,22.9),
new InfoBean("https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=2610589282,3946855278&fm=26&gp=0.jpg","旺旺大礼包","日常用品-零食",200,40.50),
new InfoBean("https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1558960091815&di=e4e6f80cfdba1241e531e666c892500a&imgtype=0&src=http%3A%2F%2Fimg3m2.ddimg.cn%2F51%2F18%2F60627552-1_k_2.jpg","旺仔小馒头","日常用品-零食",200,8.5),
});
// 饮料集合
public static List<InfoBean>drinkList
=Arrays.asList(
new InfoBean("https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=4124022729,2885335270&fm=26&gp=0.jpg","景田饮用纯净水","日常用品-饮料",120,5.00),
new InfoBean("https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=2097451215,799553454&fm=26&gp=0.jpg","可口可乐","日常用品-饮料",120,3.00),
new InfoBean("https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=2553202182,1282878475&fm=26&gp=0.jpg","雪碧","日常用品-饮料",120,3.00)
);
// 烟酒集合
public static List<InfoBean>smokeList = new ArrayList<>();
// 厨房用品集合
public static List<InfoBean>kitchenList = new ArrayList<>();
// 日用品
public static List<InfoBean>dayList = new ArrayList<>();
// 清洁用品
public static List<InfoBean>cleanList = new ArrayList<>();
// 洗化用品
public static List<InfoBean>washList = new ArrayList<>();
public static List<List<InfoBean>> getAllList(){
List<List<InfoBean>>allList= new ArrayList<>();
allList.add(dryList);
allList.add(snackList);
allList.add(drinkList);
allList.add(smokeList);
allList.add(kitchenList);
allList.add(dayList);
allList.add(cleanList);
allList.add(washList);
return allList;
}
// 购买物品存放的集合
public static List<InfoBean>buyList = new ArrayList<>();
}
在此类中，我只对于调料干货，零食和饮料三种进行了商品添加，其他种类的列表内容为空，有需要的同学可以根据这三种添加方式进行其他种类商品添加。商品的图片网址为我在百度图片中搜索，右键获取的图片地址信息。
接下来完成第一个界面--日常用品分类界面的总布局绘制和列表中每一个Item的布局绘制。
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#FF0000">
<TextView
android:text="日常用品"
android:textSize="22sp"
android:textColor="#FFFFFF"
android:padding="15dp"
android:textStyle="bold"
android:layout_centerInParent="true"
android:layout_width="wrap_content"
android:id="@+id/daily_title_tv"
android:layout_height="wrap_content" />
<ImageView
android:id="@+id/daily_back"
android:layout_width="wrap_content"
android:layout_height="30dp"
android:src="@mipmap/icon_back"
android:layout_centerVertical="true"
android:layout_marginLeft="20dp"/>
</RelativeLayout>
<ListView
android:id="@+id/daily_lv"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:dividerHeight="1dp"
android:divider="#DCDCDC"></ListView>
</LinearLayout>ListView的item布局绘制如下：
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:padding="20dp"
android:layout_height="wrap_content">
<TextView
android:id="@+id/item_daily_tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="調料乾貨"
android:layout_centerVertical="true"
android:textSize="18sp" />
<ImageView
android:layout_width="40dp"
android:layout_height="30dp"
android:src="@mipmap/icon_nt"
android:layout_centerVertical="true"
android:layout_alignParentRight="true"/>
</RelativeLayout>写完布局之后，编写对应的界面的逻辑代码，在activity当中。
package com.animee.day06.hw;
import android.content.Intent;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.ImageView;
import android.widget.ListView;
import com.animee.day06.R;
import java.util.List;
/* 日常用品*/
public class DailySuppliesActivity extends AppCompatActivity {
ImageView backIv;
ListView dailyLv;
private ArrayAdapter<String> adapter;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_daily_supplies);
// 查找控件
backIv = findViewById(R.id.daily_back);
dailyLv = findViewById(R.id.daily_lv);
// 获取数据源
List<String>mDatas = ContentDatas.dailyKindList;
// 设置适配器
adapter = new ArrayAdapter<>(this, R.layout.item_daily, R.id.item_daily_tv, mDatas);
dailyLv.setAdapter(adapter);
// 为ListView设定每一项的监听事件的方法
dailyLv.setOnItemClickListener(new AdapterView.OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
Intent intent = new Intent(DailySuppliesActivity.this,DailyDetailActivity.class);
intent.putExtra("pos",position);
startActivity(intent);
}
});
backIv.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
finish();
}
});
}
}
因为在此界面的ListView当中每一个item可变化数据只有一个TextView，故可以使用ArrayAdapter对于此列表视图进行数据填充操作。获取之前数据管理类当中的分类集合，作为此ListView的数据源，点击每个item可以跳转到对应的商品分类界面，DailyDetailActivity为商品分类界面其逻辑操作在后面博客中会分析和实现。传递点击的位置，可以便于DailyDetailActivity界面展示不同的商品信息列表。给返回按钮以点击事件，使其被选中后退出当前界面。
最后要记得activity需要在AndroidManifest.xml当中注册信息，当然是用AndroidStudio直接选择创建Activity，会帮助我们自动注册，但也要检查一下哦~
案例配套代码下载地址：商城列表与购物车