# SuSheTong

**Repository Path**: popupspace/su-she-tong

## Basic Information

- **Project Name**: SuSheTong
- **Description**: 宿舍通安卓商城项目-专科毕业设计
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 4
- **Forks**: 0
- **Created**: 2022-09-26
- **Last Updated**: 2025-06-13

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 基于安卓的购物软件的设计与开发

## 第一章 绪论

###  1.1 背景

随着科学技术的进步，加之交通运输的发展。网购已然成为当今社会购物的一种新趋势，在此之中，线上购物平台通常扮演着不可或缺的角色。而安卓平台凭借着稳定的性能和更易扩展的特性，成为各购物网站的不可过缺的购物平台。

### 1.2 购物软件的发展现状

淘宝、京东等购物软件作为当今购物软件中的巨头。以淘宝天猫为例，每年双十一，天猫都会放出很大优惠吸引用户购物，以下是淘宝天猫历年双十一的成交份额。

| 时间   | 交易额                         |
| ------ | ------------------------------ |
| 2020年 | 4982亿元                       |
| 2019年 | 2684亿元                       |
| 2018年 | 2135亿元，首次突破2000亿大关。 |
| 2017年 | 1682亿元                       |
| 2016年 | 1207亿元                       |
| 2015年 | 912.17亿元                     |
| 2014年 | 571亿元                        |
| 2013年 | 362亿元                        |

由此，我们不难发现，购物平台的交易额在逐年提高，相应着，每个人对于购物软件的使用频率也在变多，所以购物软件的发展情况还是很好的。

### 1.3 论文主要任务

本论文的主要任务是帮助读者了解项目相关的技术，以及明白本项目的设计模式，让读者对安卓购物网站有新的认识。

### 1.4 论文的结构

本论文通过对项目由浅入深的介绍，让读者从项目设计到项目实现以及后期项目测试等环节有新的认识。

## 第二章 技术分析

### 2.1 Android系统

安卓是一种基于Linux内核（不包含GNU组件）的自由及开放源代码的操作系统。主要使用于移动设备，如智能手机和平板电脑，由美国Google公司和开放手机联盟领导及开发。Android操作系统最初由Andy Rubin开发，主要支持手机。Android官方推荐使用Kotlin语言作为开发语言。但本项目主要采用Java语言开发，并且采用Google官方SDK库作为开发库。

### 2.2 开发平台

本项目采用AndroidStudio软件开发，并且采用Huawei Nova4（Android版本：10，Emui版本：10.0.0）作为演示样机开发。

### 2.3 Java语言

在Android中Java语言作为一种开发语言，可以实现软件的动态功能。

### 2.4 MariaDB数据库

MariaDB数据库管理系统是MySQL的一个分支，主要由开源社区在维护，采用GPL授权许可 MariaDB的目的是完全兼容MySQL，包括API和命令行，使之能轻松成为MySQL的代替品。因为Mysql被Oracle公司收购，在之后可能会收费，为减少后期维护难度，本项目实用MariaDB数据库。

### 2.5 Xml技术

Android系统采用xml文件作为界面文档和矢量图文档等，所以xml当之无愧成为本项目中的一个重要技术。

### 2.6 Json技术

相较于实用xml来进行服务器与软件交互，Json更加简洁高效，所以本项目采用Json作为服务器与软件的交互语言。

### 本章小结

本项目采用以上平台和技术结合开发。当然以上平台和技术不一定是开发此项目的最佳配合，但我认为次啊用以上技术可以降低此项目的开发难度和开发周期。

## 第三章 项目设计

### 3.1 商品陈列

本项目采用仿照淘宝的购物界面。下图是本项目的原始设计图 。

<img src="imgs/mainview.png" style="zoom:50%;" />

<img src="imgs/showlist.png" style="zoom:50%;" />

### 3.2 购物车与付款

本项目采用用户本地储存加上数据库云端储存用户购物车，具体形式为，当用户在本地浏览并且添加购物车时候，此时，在本地对此数据进行储存。当检测到用户退出软件，或者软件后台非正常死亡前进行最后云端备份，当检测到用户的购物车有新改变时，将率先使用本地备份，因为购物软件的同时使用量通常比比较大，当每个用户修改购物车时，就直接云端备份，会对服务器造成很大压力，所以本项目采用优先本地储存的模式。

用户付款操作采用微信和支付宝的支付接口，当用户支付成功后，将产生一个交易单号，可以根据此交易单号查询付款状态。

### 3.3 数据库设计

本项目数据库设计如下

#### 3.3.1 用户表

| 列名     | 数据类型                       | 说明         |
| -------- | ------------------------------ | ------------ |
| userid   | Int primary key auto_increment | 用户ID       |
| username | varchar                        | 用户昵称     |
| pwd      | varchar                        | 密码         |
| phone    | varchar                        | 用户手机号码 |
| email    | varchar                        | 电子邮箱     |
| Power1   | varchar                        | 等级         |
| sex      | varchar                        | 性别         |
| Yu_e     | Int                            | 余额         |

#### 3.3.2 商品表

| 列名     | 数据类型                       | 说明   |
| -------- | ------------------------------ | ------ |
| id       | Int primary key auto_increment | 商品ID |
| Name     | varchar                        | 名称   |
| fujia    | varchar                        | 规格   |
| jiaqian  | varchar                        | 价格   |
| shuliang | Int                            | 数量   |
| tupian   | varchar                        | 图片   |
| miaoshu  | varchar                        | 描述   |

#### 3.3.3 订单表

| 列名 | 数据类型                      | 说明 |
| ---- | ----------------------------- | ---- |
| Id | Int primary key auto_increment | 订单ID |
| shijian | varchar | 订单时间 |
| kewu | varchar | 客户 |
| shouhuodizhi | varchar | 收获地址 |
| Jie_e | Int | 总价 |
| mingxi | varchar | 订单 明细 |
| zhuangtai | varchar | 状态 |
| phone | varchar | 电话 |

### 本章小结

本章主要介绍了本项目的设计及其的部分功能实现，通过上述数据库的设计，基本可以实现项目的注册、商品浏览、购买、支付等流程。

## 第四章 功能实现

### 4.1 用户注册

```java
 switch (v.getId()) {
            //点击Login页面中的登陆按钮
            case R.id.login_login:
                //对数据进行为空检测，判断
                String lg_phone = lg_et_phone.getText().toString();
                String lg_password = lg_et_password.getText().toString();
                if (lg_phone.isEmpty()) {
                    ToastTool.error(this, "手机号为空!!!");
                    return;
                }
                if (lg_password.isEmpty()) {
                    ToastTool.error(this, "密码为空!!!");
                    return;
                }
                //如果数据不为空，则储存数据
                userData = new UserData(lg_phone, lg_password);
                Toast.makeText(this, "电话:" + userData.getPhone() + "\n密码:" + userData.getPassword(), Toast.LENGTH_SHORT).show();
                break;
            //点击Login页面的注册按钮
            case R.id.login_register:
                //对全局变量userName和passWord进行为空检测
                //实现功能，在登陆界面输入的电话号和密码会同步到注册界面
                //跳转前，将数据储存起来
                //跳转语句
                lg_phone = lg_et_phone.getText().toString();
                lg_password = lg_et_password.getText().toString();
                userData = new UserData(lg_phone, lg_password);
                RegisterView();
                //跳转后，把数据赋值给对应控件
                rg_et_phone.setText(userData.getPhone());
                rg_et_password.setText(userData.getPassword());
                break;
            //点击register页面中的注册按钮
            case R.id.register_login:
                //对全局变量userName和passWord进行为空检测
                //实现功能，在注册界面输入的电话号和密码会同步到登陆界面
                //跳转前，将数据储存起来
                String rg_phone = rg_et_phone.getText().toString();
                String rg_verification = rg_et_verification.getText().toString();
                String rg_password = rg_et_password.getText().toString();
                String rg_username = rg_et_username.getText().toString();
                String rg_email = rg_et_email.getText().toString();
                if (rg_phone.isEmpty()) {
                    ToastTool.error(this, "手机号为空!!!");
                    return;
                }
                if (rg_password.isEmpty()) {
                    ToastTool.error(this, "密码为空!!!");
                    return;
                }
                if (!rg_verification.equals(verification)) {
                    ToastTool.error(this, "验证码输入错误!!!");
                    return;
                }
                //判断密码是否匹配成功
                if (!rg_isEquate) {
                    ToastTool.error(this, "密码输入错误!!!");
                    return;
                }
                if (rg_username.isEmpty()) {
                    ToastTool.error(this, "昵称为空!!!");
                    return;
                }
                if (rg_email.isEmpty()) {
                    ToastTool.error(this, "邮箱为空!!!");
                    return;
                }
                userData = new UserData(rg_phone, rg_password, rg_username, rg_email);
                //跳转语句
                LoginView();
                //跳转后，把数据赋值给对应控件
                lg_et_phone.setText(userData.getPhone());
                lg_et_password.setText(userData.getPassword());
                break;
            case R.id.register_verification_get:
                ToastTool.tip(this,"目前未使用短信接口，输入12345即可");
                break;
        }
```

注册界面如下

<img src="imgs/register.png" alt="image-20210323001450733" style="zoom: 33%;" />

### 4.2 用户登录

```java
 switch (v.getId()) {
            //点击Login页面中的登陆按钮
            case R.id.login_login:
                //对数据进行为空检测，判断
                String lg_phone = lg_et_phone.getText().toString();
                String lg_password = lg_et_password.getText().toString();
                if (lg_phone.isEmpty()) {
                    ToastTool.error(this, "手机号为空!!!");
                    return;
                }
                if (lg_password.isEmpty()) {
                    ToastTool.error(this, "密码为空!!!");
                    return;
                }
                //如果数据不为空，则储存数据
                userData = new UserData(lg_phone, lg_password);
                Toast.makeText(this, "电话:" + userData.getPhone() + "\n密码:" + userData.getPassword(), Toast.LENGTH_SHORT).show();
                break;
```

登录界面如下

<img src="imgs/login.png" alt="image-20210323002031259" style="zoom:33%;" />

### 4.3 页面框架

主页框架，采用安卓BottomNavigationView控件作为此项目的底部导航栏

![image-20210326001146313](imgs/navigation.png)

具体代码如下

```xml
<?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:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_margin="0dp"
    android:orientation="vertical"
    android:padding="0dp">

    <FrameLayout
        android:id="@+id/main_frameLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1" />

    <android.support.design.widget.BottomNavigationView
        android:id="@+id/navigation"
        android:layout_width="match_parent"
        android:layout_height="100dp"
        android:layout_margin="0dp"
        android:layout_weight="1"
        android:background="?android:attr/windowBackground"
        app:menu="@menu/navigation"/>

</LinearLayout>
```



### 4.4 商品陈列

商品展示页

<img src="imgs/mian.png" style="zoom:33%;" />

布局文件代码如下

```xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:background="@drawable/image_item_bg"
        android:elevation="5dp"
        android:id="@+id/rl_item">

        <TextView
            android:id="@+id/tv_name"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_margin="5dp"
            android:layout_marginBottom="0dp"
            android:background="@drawable/corner_tint_white"
            android:ellipsize="marquee"
            android:gravity="center_horizontal"
            android:marqueeRepeatLimit="marquee_forever"
            android:maxLines="2"
            android:paddingLeft="4dp"
            android:singleLine="true"
            android:textColor="#000000"
            android:textSize="18sp"
            android:textStyle="bold" />

        <LinearLayout
            android:id="@+id/itemnewsLinearLayout1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@id/tv_name"
            android:orientation="horizontal">

            <com.lailab.sushetong.Widget.PhotoViews.PhotoView
                android:id="@+id/pv_pic1"
                android:layout_width="match_parent"
                android:layout_height="100dp"
                android:layout_marginLeft="5dp"
                android:layout_marginRight="5dp"
                android:layout_weight="1.0"
                android:maxHeight="80dp"
                android:src="@drawable/corner_white" />

            <com.lailab.sushetong.Widget.PhotoViews.PhotoView
                android:id="@+id/pv_pic2"
                android:layout_width="match_parent"
                android:layout_height="100dp"
                android:layout_marginLeft="5dp"
                android:layout_marginRight="5dp"
                android:layout_weight="1.0"
                android:maxHeight="80dp"
                android:src="@drawable/corner_white" />

            <com.lailab.sushetong.Widget.PhotoViews.PhotoView
                android:id="@+id/pv_pic3"
                android:layout_width="match_parent"
                android:layout_height="100dp"
                android:layout_marginLeft="5dp"
                android:layout_marginRight="5dp"
                android:layout_weight="1.0"
                android:maxHeight="80dp"
                android:src="@drawable/corner_white" />

        </LinearLayout>

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@id/itemnewsLinearLayout1"
            android:layout_margin="5dp"
            android:layout_marginTop="0dp"
            android:background="@drawable/corner_tint_white"
            android:orientation="horizontal"
            android:padding="5px">

            <TextView
                android:id="@+id/tv_price"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="5dp"
                android:paddingLeft="5dp"
                android:paddingRight="5dp"
                android:textAppearance="?android:attr/textAppearanceSmall"
                android:textColor="@color/RED" />

            <TextView
                android:id="@+id/tv_oldPrice"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_toRightOf="@id/tv_price"
                android:minWidth="30dp"
                android:paddingLeft="5dp"
                android:paddingRight="5dp"
                android:textAppearance="?android:attr/textAppearanceSmall"
                android:textColor="@color/GRAY_DIM" />

            <TextView
                android:id="@+id/tv_type"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginRight="5dp"
                android:layout_toLeftOf="@id/tv_date"
                android:background="@drawable/corner_white"
                android:minWidth="50dp"
                android:gravity="center"
                android:paddingLeft="5dp"
                android:paddingRight="5dp"
                android:textAppearance="?android:attr/textAppearanceSmall" />

            <TextView
                android:id="@+id/tv_date"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentRight="true"
                android:background="@drawable/corner_white"
                android:minWidth="80dp"
                android:paddingLeft="5dp"
                android:gravity="center"
                android:paddingRight="5dp"
                android:textAppearance="?android:attr/textAppearanceSmall" />


        </RelativeLayout>

    </RelativeLayout>

</RelativeLayout>
```


商品分类页

<img src="imgs/classify.png" style="zoom:33%;" />

实现代码如下

```xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal">

    <ScrollView
        android:id="@+id/classify_scrollView"
        android:layout_width="80dp"
        android:layout_height="match_parent"
        android:layout_weight="5"
        android:scrollbars="none">

        <RadioGroup
            android:id="@+id/classify_redioGroup"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical"></RadioGroup>
    </ScrollView>
    <View
        android:id="@+id/classify_view"
        android:layout_width="1dp"
        android:layout_height="match_parent"
        android:background="@color/GRAY_LIGHT"
        android:layout_weight="1"
        android:layout_toRightOf="@+id/classify_scrollView"/>

    <android.support.v7.widget.RecyclerView
        android:id="@+id/classify_recyclerView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"

        android:layout_toRightOf="@+id/classify_view"
        android:layout_weight="1"
        android:clipChildren="true"
        android:clipToPadding="false"
        android:horizontalSpacing="5dp"
        android:numColumns="3"
        android:orientation="vertical"
        android:padding="5dp"
        android:scrollbars="none"
        android:verticalSpacing="5dp" />

</RelativeLayout>
```

## 第五章 项目测试

### 5.2 软件测试的内容

#### 5.1.1 数据展示测试

本项目数据采用服务器动态传送数据，Android端动态刷新的形式进行显示，所以Android的动态显示数据作为此项目的重要测试内容。

测试截图

<img src="imgs/ceshi1.jpg" style="zoom:33%;" />

#### 5.1.2 注册登录测试

以下是注册测试

<img src="imgs/ceshi3.jpg" style="zoom:33%;" />

以下是登录测试

<img src="imgs/ceshi2.jpg" style="zoom:33%;" />



## 参考文献及项目

CircleRefreshLayout(圆形下拉刷新库):https://github.com/tuesda/CircleRefreshLayout)

Fastjson(Json解析工具)：https://github.com/alibaba/fastjson

PhotoView(图片展示工具)：https://github.com/chrisbanes/PhotoView