「易圖購」數碼商城App設計與實現

時間 2019-11-19

標籤數碼商城 app 設計實現简体版

原文原文鏈接

本科生畢業設計 前端

"易圖購"數碼商城App設計與實現 java

姓名:龍谷情android

學號git

學院 web

年級 2015 算法

專業班級計算機科學與技術1班 數據庫

指導教師編程

2019年 5 月 10 日後端

學生畢業論文（設計）誠信承諾書 api

本人鄭重聲明所呈交的畢業論文（設計）是本人在指導教師指導下進行的研究工做及取得的研究成果。據我所知，除了文中特別加以標註和致謝的地方外，論文中不包含其餘人已經發表或撰寫過的研究成果，也不包含爲得到**之外的其餘教育機構的學位或證書而使用過的材料。與我一同工做的同窗對本文研究所作的貢獻均已在論文中做了明確的說明並表示謝意。

學生本人（簽名）：

年月日

指導教師（簽名）：

年月日

摘要

隨着互聯網的高速發展和Android技術的快速普及，購物App逐漸成爲人們購買商品的主要形式。購物App發展迅速，售賣的商品複雜多樣，甚至提供了許多冗餘的商品信息。本畢業設計旨在對同類電子商品購物App作出改進，減小冗餘商品信息的干擾，而且支持基於圖片的查詢方式，提升查詢準確率，使用戶得到良好的購物體驗。

新的"易圖購"數碼商城App系統是在Windows10系統環境下開發的，符合模塊化思想和MVP（Model-View-Presenter）架構，採用的開發工具是Android Studio和idea64，編程語言爲Java + Kotlin。同時，將MySQL和七牛雲做爲數據庫。該系統的功能全面，利用基於內容的圖像檢索算法實現圖像匹配，支持數碼商城的大部分功能，具體包括：商品瀏覽，商品分類瀏覽，搜索商品，選擇商品，加入購物車，設置收貨地址，支付等。本系統的特點功能體如今如下方面，即在搜索模塊中，容許用戶經過圖片搜索商品，以及在地圖中搜索附近商家。

通過測試，本系統能夠實現數碼商城App的所有基本功能。本系統可爲用戶提供更加準確的商品信息，減小其餘商品信息的干擾，縮短用戶購物時間，給予用戶更好的購物體驗。

關鍵詞：數碼商城App；MVP架構；基於內容的圖像檢索；地圖搜索

ABSTRACT

With the rapid development of the Internet and the speedy popularization of Android technology, shopping Apps have gradually become the main platform for people to buy goods. The products sold by various shopping Apps are complex and diverse, and even a lot of redundant product information that users do not want to see is provided. This graduation project aims to improve the shopping Apps to reduce the interference of redundant commodity information，support image-based query and improve the accuracy of query so that users can get better shopping experience.

The "Easy Purchase" App is mainly developed under Windows 10 system environment and it conforms to the modularization idea and Model-View-Presenter architecture. The development tools used are Android Studio and Idea64, and the programming language is Java + Kotlin. MySQL and Qiniuyun are used as databases. At the same time, using content-based image retrieval algorithm to achieve image matching, the system has comprehensive functions supporting most of the functions of digital mall, including commodity classification, commodity search, commodity selection, shopping carts, receiving address setting, payment and other functions. In the search function, users are allowed to search for goods through pictures and nearby stores in maps.

After tests, the system can realize all basic functions of shopping App. This system can provide users with more accurate commodity information, reduce the interference of other commodity information, shorten the shopping time of users, and give users a better shopping experience.

Keywords: Shopping apps, MVP architecture, content-based image retrieval, map search

2.1 Android 系統開發平臺介紹 - 4 -

2.4 百度地圖API開發技術介紹 - 8 -

3.3.1 商品模塊功能需求分析 - 10 -

3.3.2 商品詳情與屬性功能需求分析 - 12 -

3.3.3 購物車模塊功能需求分析 - 13 -

4.2.10管理員信息表建立 - 25 -

5.3 系統功能模塊設計與實現 - 32 -

5.4 CBIR簡單算法實現 - 47 -

第六章系統測試 - 51 -

6.1 測試方法介紹 - 51 -

6.2測試過程 - 51 -

6.2.1 用戶中心模塊測試 - 51 -

第一章緒論

1.1研究背景

在1999年之前，中國互聯網先知們就開始創建B2C（Business-to-Customer，企業對消費者）模式，可是遭到經濟學界的廣泛質疑。1999年末，互聯網進入高速發展階段。2006年，中國的網購市場開始進入第二階段，即中國網購量爆發性增加^[1]。在中國情商報的互聯網+的欄目中，艾瑞分析了從 2011 到 2017 年的網絡購物的狀況。從統計數據能夠看出，我國的網絡購物用戶人數在不斷增加，從 2011 年的 1.9 億人增加到 2017 年的 5.3 億人，網絡購物的人數在總體網民中所佔的比例從 37.8%增加到 71.5%。因而可知，網絡購物的方式愈來愈流行^[2]。

1.2國內外研究現狀

近幾年，國內對購物商城系統開發的研究較爲活躍。劉均前^[3]設計了一款"易都行"在線購物系統，基於MVP（Model-View-Presenter）+RxJava+Retrofit的整合框架，引入百度地圖API（Application Programming Interface）實現定位和導航功能。該系統具備商品瀏覽和檢索功能、購物車功能、支付功能、我的中心管理功能和定位功能。

李峯^[4]設計了一款Android平臺下基於地理位置的購物系統。採用了系統功能模塊的系統整體架構設計，引入高德地圖進行實現定位功能，研究凝結算法、智能過濾算法、Dijkstra算法主要實現最優路線的搜索功能。該系統具備註冊登陸、商品搜索、地址管理、購物車、網上支付和最短路線提示的功能。

劉蓬^[5]設計了基於Android平臺移動購物系統，主要引用百度地圖API、科大訊飛API來實現位置服務和語音服務，信息以Json數據格式響應客戶端請求。此係統主要供商品瀏覽、商品搜索、商品購買等基本功能。

黃俊萍^[6] 設計了一款基於IOS的購物類電子商務App。該App使用 Xcode 開發工具，使用爲Objective-C進行開發，數據庫使用SQLite，採用模塊化設計思想和必定的加密算法保證App的可用性和正確性。該App具備商品搜索、購物車和網上支付等基本功能。

李雪蓮^[7]設計了一款基於 Android混合開發模式的網上購物系統。該系統採用當前流行的 Android操做系統與Web技術，採用HTTP（HyperText Transfer Protocol，超文本傳輸協議）協議進行網絡通訊，使用MySQL做爲數據庫，tomcat做爲服務器，採用MD5加密技術保證用戶信息安全性，調用Google地圖實現地理位置服務。該系統具備註冊登陸、用戶管理、訂單管理、購物車、二維碼、地圖顯示等功能。

戶磊^[8]設計了一款基於移動商品搜索系統。開發工具爲Xcode，配置OpenCV環境，使用GrabCut算法，實現圖像分割，提取圖像顏色和尺度不變特徵變換（SIFT,Scale-invariant feature transform），與後臺圖像數據集進行對比，使用歐式距離和BoW方法進行匹配，實現圖像檢索的功能。該系統盡實現此功能，並未集成到應用中。

基於內容的圖像檢索技術（CBIR, Content Based Image Retrieval）是互聯網領域興起的一種新型圖像搜索方式，能夠更加直觀地表達用戶的搜索意圖，而且能客觀的幫助用戶實現搜索^[9]。從上世紀90年代至今，CBIR技術已經逐漸發展成爲龐大的結構化、系統化的體系^[10]。Jrgensen等人提出，用戶想構造和調整搜索關鍵詞，但不知道具體怎麼作，所以圖像檢索系統中須要爲檢索提問的構造和調整提供更多支持^[11]。有關CBIR系統的基本原理如圖1-1所示。

圖1-1 CBIR 系統的基本原理框圖

圖像特徵提取主要有底層特徵提取和高層特徵提取。好比將圖像的顏色、紋理和形狀三種特徵進行提取，並使用歐氏距離和直方圖相交法對特徵進行比對，從而得到類似的圖片。可經過感知哈希算法和均值hash算法對圖片進行處理。均值哈希算法（aHash）利用圖片的低頻信息進行處理，主要用於由圖像的縮略圖搜原圖。感知哈希算法（pHash）主要應用於圖像檢索、圖像識別、圖像認證及數字水印技術^[12]。

當前，購物類App一般能實現登陸註冊、瀏覽商品，網上支付、購物車等基本功能，不多會對圖像檢索進行研究和實現。基於地理的服務也是爲快遞員規劃路線而使用的，不多爲消費者服務，不能徹底知足用戶的購物需求。本畢業設計將Android Studio，webstorm做爲開發工具，tomcat做爲服務器，數據庫使用MySQL，基於MVP模式進行開發，用可針對商品圖像搜索和消費者查找實體店的位置服務的功能，擬設計一款符合潛在用戶需求的數碼商城App，解決傳統商品描述不靈活，搜索信息不許確，沒法查找實體店的問題。

1.3研究目的和意義

1.3.1研究目的

經過"易圖購"數碼商城App設計與實現深刻理解了網絡電商的基本開發模塊及流程和Android Studio、idea等開發軟件的使用方法。

1.3.2研究意義

1.理論意義

（1）此App採用MVP模式，將模型與視圖徹底分離，思路更加清晰，項目更有結構化。

（2）運用基於內容的圖像檢索技術，來完成圖像搜索商品的功能。

（3）該系統藉助微信支付平臺和支付寶開放平臺，實如今線微信、支付寶支付功能。

（4）引用百度地圖API接口，用來實現基於位置的服務功能，實現尋找附近實體店的功能。

2.實踐意義

（1）數碼愛好者提供專門的數碼商城，內容準確，不受其餘商品的干擾。

（2）App採用基於內容發的圖像，對不易描述的商品可經過圖片進行搜索。

（2）App實現地理位置服務功能，爲用戶提供附近的實體店功能以知足用戶需求。

1.4全文組織結構

本文共分爲7章，文章結構及各章內容簡介以下：

第1章主要介紹及探討論文主要研究的背景，國內外現狀，研究意義，最後給出本文的組織結構。

第2章主要介紹關鍵技術與開發平臺及涉及的主要算法，以及API開發技術。

第3章介紹了基本業務流程，從功能性需求和非功能性需求兩方面研究需求分析，根據需求給出原型圖。

第4章介紹系統整體架構的設計，提供了系統的整體設計流程和接口簡介。

第5章介紹系統的詳細設計與實現，給出系統整體流程。提供數據庫設計及各模塊的設計與實現。

第6章對每一個模塊進行測試，提供了測試步驟以及完成狀況。

第7章本系統可完成用戶登陸、瀏覽、加入購物車、支付、查看訂單等功能，從此將完善圖片搜索商品和實體店查詢等功能。

第二章關鍵技術與開發平臺介紹

2.1Android 系統開發平臺介紹

本系統使用的開發工具爲Android Studio，開發語言爲java和kotlin，架構思想爲MVP架構思想和演進模塊化設計思想，所用插件主要有模塊路由（ARouter）、插件式引用視圖資源插件，流行框架主要有RxKotlin、RxJava、RxBus、Anko等。

2.1.1視圖層框架

1.Kotlin-Android-Extensions 視圖綁定插件

kotlin提供插件，在項目的每一個模塊中添加依賴便可,代碼如圖2-1所示。

圖2-1添加視圖綁定插件依賴

使用Kotlin-Android-Extensions可直接使用XML中ID操做改控件，無需定義變量，極大的減小代碼，適用於Activity、Fragment、Adapter及自定義View等視圖。

2.Anko

Anko組成部分：Anko Commons，Anko Layouts，Anko SQLite，Anko Coroutines。在項目中添加Anko Commons依賴便可，代碼如圖2-2所示。

圖2-2添加Anko依賴

可以使用startActivity、intent等方法進行跳轉，使用toast、dialog等方法進行提示，使用verbose(),debug(),info(),warn(),error()等方法進行打印日誌等。使用Anko極大的簡化了代碼量。

本項目只使用Anko Commons，其餘功能將使用第三方庫來完成。

2.1.2業務層框架

1.RxKotlin

基於RxJava的擴展庫，以kotlin的風格提供了大量的擴展方法，是一種響應式編程，編碼風格簡潔，也是一種觀察者模式，提供監聽來實現業務。在項目中引入依賴，代碼如圖2-3所示。

圖2-3添加RxKotlin依賴

2.RxAndroid

基於RxJava的擴展庫，能夠優雅的處理異步請求，更好的兼容Android特性，如主線程、UI事件等。在項目中引入依賴，代碼如圖2-4所示。

圖2-4添加RxAndroid依賴

3.RxLifecycle

主要經過監聽Activity、Fragment生命週期，自動斷開Rx綁定來解決Rx內存泄露的問題。在項目中引入依賴，代碼如圖2-5所示。

圖2-5添加RxLifecycle依賴

2.1.3網絡層框架

本系統網絡層使用Okhttp + Retrofit框架進行實現。

基於okhttp封裝的網絡庫，簡單配置就能進行網絡請求，並和Rx完美結合。項目中引入依賴，代碼如圖2-6所示。

圖2-6添加Okhttp + Retrofit依賴

2.1.4其餘框架

本系統也使用瞭如下八種主要框架或雲空間，具體介紹以下：

1.Dagger2依賴注入

使用@Inject進行標註，須要經過Component進行鏈接。Component是一個注入器，是鏈接目標類和以來類實例的橋樑，以@Component標註的類必須是接口或抽象類，Component依賴關係經過dependencies屬性添加，App必須有一個Component用來管理全局實例。

由於第三方庫不能修改，不能再其構造函數中添加@Inject，接口不能實例化，只能經過實現類實例化，因此引入@Module，Module是一個簡單工廠，是建立類實例的方法，可以使用Component經過modules屬性添加多個Module。在Module中，使用@procides標註建立實例的方法。

2.Gson數據轉換

Gson是一種JSON轉換器，由google發佈的library，主要完在Java對象和JSON數據之間進行映射，即將一個JSON數據轉換成Java對象。導入庫僅須要在程序中加入依賴便可。如圖2-7所示。

圖2-7 引入Gson依賴

3.ARouter模塊路由

ARouter是由阿里巴巴提供的Android平臺中對頁面、服務提供路由功能的中間件。使用ARouter支持多模塊項目，符合本項目的模塊化思想。本系統未在gradle引入此框架，直接下載jar包放入項目中進行引入。如圖2-8所示。

圖2-8 本系統ARouter依賴

4.Glide

Glide主要用來進行圖片加載，並且在當fragment或者activity失去焦點或者destroyed的時候，Glide會自動中止加載相關資源，確保資源不會被浪費。本項目導入依賴如圖2-9所示。

圖2-9 本系統導入Glide依賴

5.TakePhoto

TakePhoto框架主要實現拍照更能和從手機相冊得到圖片功能。使用本框架可實現對圖片的壓縮、剪輯等功能。本系統引入依賴如圖2-10所示。

圖2-10 引入TakePhoto依賴

6.七牛數據雲存儲

七牛數據云爲開發者用戶提供雲空間，主要提供了對象存儲、雲主機服務、內容審覈等服務，本系統主要使用對象存儲的服務功能，可提供圖片外鏈，直接經過URL訪問，經過AK(AccessKey)和SK(SecretKey)獲取讀取權限。在android添加依賴如圖2-11所示。

圖2-11 引入七牛雲依賴

在後臺須要將AK/SK和bucket（存儲對象中的數據庫名），如圖2-12所示。

圖2-12 七牛雲後臺配置

7.MultiStateView多狀態視圖

將指定的view放在此控件中，便可完成根據此view的狀態來顯示不一樣的界面，主要用來控制一些加載界面、錯誤界面等。加入依賴如圖2-13所示。

圖2-13 引入MultiStateView依賴

8.BGA-refreshLayout

本控件主要實現上拉刷新、下拉加載更多的功能。其中只須要配置XML佈局文件，調用其中接口便可。在佈局文件中加入此控件如圖2-14所示。

圖2-14 佈局文件BGA-refreshLayout控件

在邏輯功能中調用其中接口，如圖2-15所示。

圖2-15 上下拉刷新功能實現

2.2 後臺開發平臺介紹

後臺開發工具是IDEA，開發語言使用Java，數據庫使用MySQL，框架爲SpringMVC。

2.3 CBIR技術介紹

CBIR（Content-based image retrieval），即基於內容的圖像檢索，此技術的實現主要依賴與兩個關鍵技術：圖像特徵提取和匹配。圖像特徵提取分爲兩大類，底層視覺和語義內容。底層視覺就是能夠經過圖片的顏色、形狀、紋理等與庫裏所存在的圖片進行匹配，語義內容則是經過理解文字內容對圖像進行搜索。本設計主要經過使用底層視覺的技術來支持CBIR技術。

2.4 百度地圖API開發技術介紹

本設計地理位置定位及搜索功能主要經過調用百度地圖API接口實現，可實現對商店的查詢功能。

第三章系統需求分析

隨着互聯網的高速發展和智能手機的快速普及，手機商城app應運而生，並在我國於2006年爆發時增加，購物App各式各樣，，網絡購物逐漸成爲人們的主要購物方式。隨着電子科技的高速發展，數碼產品的種類層出不窮。面對紛繁複雜的各種數碼產品，數碼愛好者沒法準確理解這些產品的樣式、品牌及性能。

在需求分析階段，對系統的潛在用戶進行了問卷調查（調查問卷見附錄）。在本次調查中，共發放問卷110份，有效回收問卷91份。其中，92%的用戶但願增長圖片搜索商品功能，79%的用戶但願增長消息推送功能。最終，得出針對系統功能的用戶需求分析。

3.1系統的概述與用戶特色

3.1.1系統概述

本系統針對傳統網上商城的弊端，從而開發出的一種在線電子產品App商城，主要目的就是經過本系統爲用戶提供更加方便的體驗，知足潛在用戶的需求。本系統能夠經過圖片獲取本身想要的商品，並能經過地圖搜索附近的商店。主要經過調查問卷和觀察法的方式進行肯定該系統的功能。

3.1.2用戶特色

能夠實現登陸，對已有的商品進行查詢，對訂單進行查詢，填寫地址，搜索商店，加入購物車，進行支付等功能。

3.2 可行性需求分析

3.2.1 經濟可行性

本系統參考文獻主要在學校提供的知網等網站進行下載，不須要本身進行付費購買。技術教程可經過博客、百度雲等網絡渠道獲取並學習。七牛雲提供免費雲空間，容量可知足系統要求。調查問卷主要經過網絡進行填寫和統計，。本系統預計費用較少，從經濟上講，可知足實現本系統所用資金。

3.2.2 技術可行性

本系統用戶端爲Android，使用kotlin+Java語言，採用MVP亂加進行實現，管理員web端和後臺採用SSM框架進行實現。本系統涉及Java、HTML、CSS、Android等開發語言在大學期間已經開設課程，在此基礎上學習Kotlin和JavaScript會很是簡單。硬件要求一部手機和一臺電腦便可完成。技術要求比較簡單，所以在技術方面能夠可實現本系統。

3.2.3 操做可行性

用戶端採用C/S（Client/Server，客戶機/服務器）結構，與服務器直接相連，沒有中間環節，所以響應速度快。界面採用列表和選項卡布局方式，界面美觀，操做簡單。

管理員端採用B/S（Browser/Server，瀏覽器/服務器）結構，B/S具備分佈性特色，管理員能夠隨時隨地進行查詢、瀏覽等業務處理。界面採用選項卡布局，功能模塊明確，操做方便。

3.3 功能性需求分析

在客戶端的需求分析中，本文得到五個核心業務，分別是用戶中心、商品中心（包括首頁、分類頁和商品詳情頁）、訂單中心、支付中心和消息中心。結構圖如圖3-1所示。

圖3-1系統總體架構示意圖

功能模塊主要分爲商品模塊、購物車模塊、訂單模塊、支付模塊、用戶模塊、消息模塊。

1.商品模塊：展現符合用戶需求的商品。

2.購物車模塊：存儲用戶將要購買的商品，知足用戶對多種類似商品進行對比和暫時保存。

3.訂單模塊：顯示訂單狀態，方便用戶查看交易過程。

4.用戶模塊：主要完成用戶註冊登陸、管理收貨信息、修改密碼等功能。

3.3.1 商品模塊功能需求分析

該模塊時APP商城最基本的頁面，爲了知足用戶的瀏覽體驗，添加分類和商品檢索功能。

商品模塊包括首頁和分類展現兩部分：

1.首頁

包括搜索功能，折扣板塊，輪播圖模塊。用戶可在搜索板塊中搜索本身想要的商品，知足用戶的針對行購買需求，折扣模塊會顯示正在打折的的商品，輪播圖模塊會顯示近期火爆的商品。在設置界面時考慮到搜索功能應該是用戶最常使用的功能模塊，折扣推薦時其次，火爆商品並不會很知足用戶的購物需求，因此最不常使用的模塊應該是輪播圖模塊。在主界面只設置這三個模塊，按照使用頻率進行排版，符合用戶習慣，有層次、有規劃、有模塊的展現商品。搜索獲得的商品以兩列瀑布流的形式展現出來，顯示商品的樣式、名稱、價格等信息。

其首頁原型圖如圖3-2所示。

圖3-2首頁原型圖

經過圖3-2明確，首頁開發界面較爲複雜，要達到有條不絮的效果就要有合適的UI架構，須要從各個方面考慮問題，大多相似APP首頁的設計比較相似，大體思路爲：

（1）界面頂部爲搜索框，便於用戶快速定位。

（2）其下面是Banner輪播圖，用來吸引用戶。

（3）下一層是公告欄，不斷刷新各類商品的活動狀況。

（4）而後是火爆一欄，經過用戶的搜索狀況推薦火爆商品。

（5）最後是比較個性的輪播圖，用來顯示主題商品。

2.分類頁面

其次，商品展現頁包含輔助頁面分類頁面，相對於首頁簡介不少，主要包括左右兩部分，左側用來展現類別列表，右側是此類別的商品。和搜索功能不一樣，搜索功能是爲了讓用戶最快最便捷地找到本身想要的商品，而分類是將商城中的雖有商品進行系統的分類，用戶能夠在此分類的範圍中隨意的瀏覽商品。分類頁面的原型圖如圖3-3所示。

圖3-3分類頁面原型圖

3.3.2 商品詳情與屬性功能需求分析

商品詳情頁是對具體商品的信息展現，通常包括商品基本信息、商品具體圖片展現、商品規格等信息，在商品詳情頁可選擇商品規格加入購物車。商品詳情頁的展現通常會以圖片的形式展現，讓用戶更加直觀的查看商品。

深層次的講，做爲用戶必需要瀏覽的地方，也是用戶購買與否的關鍵之處，必須將信息提供全面。這裏並不能像實體店同樣能夠切身感覺到商品的存在，淫詞必定要考慮如下幾點：

1.使用圖片做爲展現方式，通常使用多張圖片，能夠從不一樣角度觀察商品。

2.代表商品的價格以及原價，能夠吸引用戶購買。

3.說明商品使用方法和注意事項等信息。

4.說明商品優勢。

經過以上分析，能夠設計出大改原型圖如圖3-4所示。

圖3-4商品詳情頁原型圖

其次，商品SKU的展現在設計上也是一大難點，由於SKU的展現是一個動態效果，好比電腦的版本、配置和數量，都是經過後臺來進行獲取，將數據填充到相應的組件中。在設計此頁面是要簡介明瞭，方便用戶準確的選擇商品規格。其設計的原型圖如圖3-5所示：

圖3-5 SKU屬性原型圖

3.3.3 購物車模塊功能需求分析

在購物車中，用戶應該可以看到商品的名稱、配置、價格和數量，而且容許用戶對多個不一樣的商品進行批量購買，選中商品後將顯示總價格，點擊結算即可進行購買。可點擊編輯按鈕，對購物車中不想要的商品進行刪除。根據以上基地那，設計原型圖如圖3-6所示。

圖3-6購物車原型圖

3.4 非功能性需求分析

非功能性需求包括界面交互、產品性能、不一樣手機設備上的兼容性等方面的需求。

1.界面交互設計：要求商品繁多但可以有條理的瀏覽商品，各界面跳轉能快速找到。

2.產品性能方面：數據來源於服務器，佔用本地內存少，運行流暢，沒有明顯的卡頓現象。

3.設備兼容性：可以在市面上絕大Android版本上運行，主要適配Android4.0以上版本。

第四章系統設計

4.1系統功能設計實現流程

本系統使用Kotlin語言開發，使用模塊化思想，採用MVP架構，使用主流框架進行開發。

在編寫Android過程當中，並無使用Android流行語言Java，而是使用Kotlin來進行編寫，主要由於Kotlin相對於Java有如下優點：

1.易用性：Kotlin可以用更短的代碼實現更多的功能，減小了bug的可能性。

2.Kotlin特有的擴展屬性，使得編碼更加簡介，對開發更加友好。

3.更具備安全性。好比使用Kotlin聲明變量時須要指定是否爲空，調用對象時也會先判斷是不是空對象。

4.有更好的跨平臺特性。Kotlin不只能夠像java同樣編譯成字節碼class，還能編譯成js。

系統的設計實現流程如圖4-1所示。

圖4-1系統設計開發流程

4.1.1模塊化思想

大概分有四層，第一層是基礎Module，用來封裝基礎的通用的組件；第二層是中間件Module，提供業務模塊項目跳轉以及項目之間接口調用的常量；第三層是業務Module，主要實現各模塊獨立功能；第四層是主攻城APP，運行程序的入口。模塊化思想基本流程圖如圖4-2所示。

圖4-2模塊劃分圖

模塊化就是將相對獨立的業務拆分紅"塊"，單獨開發調試，最後將模塊組裝成APP。

本系統所使用的模塊劃分如圖4-3所示。

圖4-3模塊劃分

使用模塊化，有業務分離，解耦；通用化，代碼複用的優勢。在實現模塊化過程當中，主要經過公共模塊抽取、業務模塊抽取和主工程組裝業務模塊來實現模塊化。模塊之間通信主要有跨模塊跳轉和跨模塊接口調用兩種，在不一樣應用之間的通信使用阿里巴巴開源框架ARouter。

4.1.2 MVP模式

MVP（Model-View-Presenter）是對MVC（Model-View-Controller）的一種升級，在合做開發功能模塊細分中MVP有着得天獨厚的優點。MVP把Activity中的UI邏輯抽象成View接口，把業務邏輯抽象成Presenter接口，Model類仍是原來的Model。在MVP模式中Activity的功能就是響應生命週期和顯示界面，具體其餘的工做都丟到了Presenter層中進行完成，Presenter實際上是Model層和View層的橋樑。MVP基本流程如圖4-4所示。

圖4-4 MVP基本流程

使用MVP模式，主要有如下優勢：

1.模型與視圖徹底分離，下降耦合，單獨修改view或者presenter的邏輯並不會影響另外一方。

2.能夠更高效地使用模型。

3.咱們能夠將一個Presenter用於多個Activity，而不須要改變Presenter的邏輯。這個特性很是的有用，由於Activity的變化老是比模型的變化頻繁。

在本系統中，對原生MVP模式進行了修改，增長數據適配器和疏解生成器，如圖4-5所示。

圖4-5 系統使用的MVP架構

4.2 系統數據庫設計

本系統所用數據庫爲dada，存儲的表有user_info, goods_info, order_info, cart_goods,category, good_sku,message_info, order_info, ship_address九張表。

4.2.1用戶中心表

主要存儲用戶基本信息，手機號和密碼是必要信息。相應字段信息如表4-1所示。

表4-1用戶中心表

字段名稱	字段描述	數據類型	Not Null	備註
id	Id	int(11)	NO	主鍵、用戶惟一id
user_name	用戶名	varchar(45)	YES
user_pwd	密碼	varchar(45)	YES
user_mobile	手機號	varchar(45)	YES
user_icon	用戶頭像	varchar(256)	YES
user_real_name	用戶真實姓名	varchar(45)	YES
user_identity_card	身份證	varchar(45)	YES
user_nick_name	暱稱	varchar(45)	YES
user_gender	性別	varchar(45)	YES
user_birthday	生日	varchar(45)	YES
user_address	居住地	varchar(45)	YES
user_sign	個性簽名	varchar(45)	YES

實體圖如圖4-6所示。

圖4-6 用戶實體圖

4.2.2購物車表

主要存儲購物車中商品信息，用來管理在購物車中的各個商品。相應字段信息如表4-2所示。

表4-2購物車表

字段名稱	字段描述	數據類型	Not Null	備註
id	購物車Id	int(11)	NO	主鍵、購物車惟一id
goods_id	商品id	int(11)	YES	商品惟一id
goods_desc	商品描述	varchar(255)	YES
goods_icon	商品頭像	varchar(255)	YES
goods_price	商品圖片	varchar(45)	YES
goods_count	商品數量	int(11)	YES
user_id	用戶id	int(11)	YES	用戶惟一id
goods_sku	商品詳情數據	varchar(255)	YES

實體圖如圖4-7所示。

圖4-7 購物車實體圖

4.2.3商品分類表

用來管理分類信息和級別信息，經過本身id和父類id構建關係，生成一對多的樹形關係。相應字段信息如表4-3所示。

表4-3商品分類表

字段名稱	字段描述	數據類型	Not Null	備註
id	類別is	int(11)	NO	主鍵、類別惟一標識
category_name	類別名稱	varchar(45)	YES
category_icon	類別頭像	varchar(255)	YES
parent_id	父類別id	int(11)	YES	類別惟一標識，用來管理級別

實體圖如圖4-8所示。

圖4-8 商品類別實體圖

4.2.4商品信息表

存儲商品的各類信息，相應字段信息如表4-4所示。

表4-4商品信息表

字段名稱	字段描述	數據類型	Not Null	備註
id	id	int(11)	NO	主鍵、商品惟一標識
category_id	類別id	int(11)	YES	類別惟一標識
goods_desc	商品描述	varchar(255)	YES
goods_default_icon	商品默認圖標	varchar(255)	YES
goods_default_price	商品默認圖片	varchar(45)	YES
goods_banner	商品Banner顯示	text	YES
goods_detail_one	商品詳情1	varchar(255)	YES
goods_detail_two	商品詳情2	varchar(255)	YES
goods_sales_count	商品售賣數量	int(11)	YES
goods_stock_count	商品現存數量	int(11)	YES
goods_code	商品編碼	varchar(45)	YES
goods_default_sku	商品SKU	varchar(45)	YES

實體圖如圖4-9所示。

圖4-9 商品信息實體圖

4.2.5商品sku表

存儲商品的SKU信息，相應字段信息如表4-5所示。

表4-5商品SKU信息表

字段名稱	字段描述	數據類型	Not Null	備註
id	Sku_id	int(11)	NO	主鍵、SKU惟一標識
goods_id	商品id	int(11)	YES	商品惟一標識
goods_sku_title	商品SKU標題	varchar(45)	YES
goods_sku_content	商品SKU內容	varchar(255)	YES

實體圖如圖4-10所示。

圖4-10 商品SKU信息實體圖

4.2.6消息表

存儲系統通知用戶的消息，相應字段信息如表4-6所示。

表4-6 消息信息表

字段名稱	字段描述	數據類型	Not Null	備註
id	消息id	int(11)	NO	主鍵、消息惟一標識
msg_icon	消息標誌	varchar(255)	YES
msg_title	消息標題	varchar(45)	YES
msg_content	消息內容	varchar(255)	YES
msg_time	消息時間	varchar(45)	YES
user_id	用戶id	int(11)	YES	用戶惟一標識

實體圖如圖4-11所示。

圖4-11 消息表實體圖

4.2.7訂單商品表

用來管理已有訂單的商品，相應字段信息如表4-7所示。

表4-7訂單商品信息表

字段名稱	字段描述	數據類型	Not Null	備註
id	id	int(11)	NO	主鍵、商品惟一標識
goods_id	商品id	int(11)	YES
goods_desc	商品描述	varchar(255)	YES
goods_icon	商品標誌	varchar(255)	YES
goods_price	商品價格	varchar(45)	YES
goods_count	商品內容	int(11)	YES
goods_sku	商品SKU信息	varchar(255)	YES
order_id	訂單id	int(11)	YES	訂單惟一標識

實體圖如圖4-12所示。

圖4-12 訂單商品關係表實體圖

4.2.8訂單信息表

用來管理生成的訂單，相應字段信息如表4-8所示。

表4-8訂單信息表

字段名稱	字段描述	數據類型	Not Null	備註
id	訂單id	int(11)	NO	主鍵、惟一標識
user_id	用戶id	int(11)	YES
pay_type	支付方式	int(11)	YES
ship_id	收貨地址id	int(11)	YES
total_price	總價	int(11)	YES
order_status	訂單狀態	int(11)	YES

實體圖如圖4-13所示。

圖4-13 訂單信息表

4.2.9地址管理表建立

用來管理收貨地址信息，相應字段信息如表4-9所示。

表4-9地址管理信息表

字段名稱	字段描述	數據類型	Not Null	備註
id	地址id	int(11)	NO	主鍵、惟一標識
ship_user_name	地址用戶名	varchar(45)	YES
ship_user_mobile	地址用戶手機號	varchar(45)	YES
ship_address	地址	varchar(45)	YES
ship_is_default	是否默認地址	int(11)	YES
user_id	用戶id	int(11)	YES

實體圖如圖4-14所示。

圖4-14 地址管理表實體圖

4.2.10管理員信息表建立

用來存儲管理員信息，相應字段信息如表4-10所示。

表4-10管理員信息表

字段名稱	字段描述	數據類型	Not Null	備註
id	管理員id	int(11)	NO	主鍵、惟一標識
name	管理員用戶名	varchar(45)	YES
mobile	管理員手機號	varchar(45)	YES
pwd	管理員密碼	varchar(45)	YES

實體圖如圖4-15所示。

圖4-15 管理員信息表實體圖

系統整體E-R圖如圖4-16所示。

圖4-16 系統整體E-R圖

第五章系統實現

5.1 系統整體流程

站在一個用戶的角度，首先註冊用戶，登陸成功後進行商品瀏覽、查看商品參數，選擇商品的SKU(Stock Keeping Unit，庫存量單位)屬性，加入購物車，選擇購物車中的商品進行結算，新建或選擇收貨地址，提交訂單後進行支付，最後用戶確認收貨後完成一個商品的購買過程。系統流程圖如圖5-1所示。

圖5-1 "易圖購"App業務流程圖

其中設計的模塊有App主程序模塊、BaseLibrary基礎模塊、UserCenter用戶中心模塊、GoodsCenter商品中心模塊、MessageCenter消息中心模塊、OrderCenter訂單中心模塊、PaySDK支付寶支付模塊、Provider（MVP的P層模塊）。模塊之間相互分離，其結構如圖5-2所示。

圖5-2 模塊劃分結構圖

5.2 功能接口說明

本系統使用JSON（JavaScript Object Notation）格式將數據上傳至服務器，服務器將數據存儲到MySQL數據庫中。

JSON意爲JavaScript對象表示法，它是一種基於文本，獨立於語言的輕量級數據交換格式。因爲語法更爲簡潔,網絡傳輸,以及機器解析都更爲迅速。

5.2.1用戶中心業務模塊

本系統用戶中心模塊主要實現用戶註冊，用戶登陸，修改用用戶信息功能，重置密碼，其調用的接口名稱如表5-1所示。

表5-1用戶中心接口說明

接口名稱	userCenter/register	接口說明	用戶註冊接口
URL	http://<ServicerIP>:8080/userCenter/register	請求方式	POST
Request信息	mobile,pwd,verifyCode
返回結果	0:失敗 1：成功
接口名稱	userCenter/login	接口說明	用戶登陸接口
URL	http://<ServicerIP>:8080/userCenter/login	請求方式	POST
Request信息	userName,pwd
返回結果	0：失敗 1：成功
接口名稱	userCenter/editUser	接口說明	用戶編輯信息接口
URL	http://<ServicerIP>:8080/userCenter/editUser	請求方式	POST
Request信息	id,userIcon,userName,userMobile,userSign
返回結果	0：失敗 1：成功
接口名稱	userCenter/resetPwd	接口說明	重置密碼接口
URL	http://<ServicerIP>:8080/userCenter/resetPwd	請求方式	POST
Request信息	mobile,pwd,verifyCode
返回結果	0：失敗 1：成功

用戶進行註冊時須要三個必要參數，分別是mobile（註冊手機號），pwd（密碼），verifyCode（驗證碼），當手機號、密碼、驗證碼符合規定時可完成註冊；重置密碼時，手機號和驗證碼相匹配時可完成操做。

5.2.2商品中心管理

本系統商品中心主要分爲首頁，分類頁面和購物車接口，其調用的接口名稱如表5-2所示。

表5-2商品中心管理接口

接口名稱	goods/getGoodsList	接口說明	獲取商品列表
URL	http://<ServicerIP>:8080/goods/getGoodsList	請求方式	POST
Request信息	無
返回結果	0：失敗 1：成功
接口名稱	goods/getGoodsListByKeyword	接口說明	經過關鍵詞獲取商品列表
URL	http://<ServicerIP>:8080/goods/getGoodsListByKeyword	請求方式	POST
Request信息	Keyword
返回結果	0：失敗 1：成功
接口名稱	goods/getGoodsDetail	接口說明	獲取商品詳情
URL	http://<ServicerIP>:8080/goods/getGoodsDetail	請求方式	POST
Request信息	id
返回結果	0：失敗 1：成功
接口名稱	category/getCategory	接口說明	獲取分類列表
URL	http://<ServicerIP>:8080/category/getCategory	請求方式	POST
Request信息	無
返回結果	0：失敗 1：成功
接口名稱	cart/getList	接口說明	獲取購物車列表
URL	http://<ServicerIP>:8080/cart/getList	請求方式	POST
Request信息	無
返回結果	0：失敗 1：成功
接口名稱	cart/delete	接口說明	從購物車刪除商品
URL	http://<ServicerIP>:8080/cart/delete	請求方式	POST
Request信息	id
返回結果	0：失敗 1：成功
接口名稱	cart/add	接口說明	添加商品到購物車
URL	http://<ServicerIP>:8080/cart/add	請求方式	POST
Request信息	id
返回結果	0：失敗 1：成功
接口名稱	cart/submit	接口說明	提交購物車商品
URL	http://<ServicerIP>:8080/cart/submit	請求方式	POST
Request信息	id
返回結果	0：失敗 1：成功

5.2.3訂單中心

本系統訂單中心主要有提交訂單，取消訂單，地址管理等接口，其調用的接口名稱如表5-3所示。

表5-3訂單中心接口信息

接口名稱	order/submitOrder	接口說明	提交訂單
URL	http://<ServicerIP>:8080/order/submitOrder	請求方式	POST
Request信息	id
返回結果	0：失敗 1：成功
接口名稱	order/confirm	接口說明	訂單確認
URL	http://<ServicerIP>:8080/order/confirm	請求方式	POST
Request信息	無
返回結果	0：失敗 1：成功
接口名稱	order/cancel	接口說明	訂單取消
URL	http://<ServicerIP>:8080/order/cancel	請求方式	POST
Request信息	id
返回結果	0：失敗 1：成功
接口名稱	order/getOrderById	接口說明	根據id獲取訂單
URL	http://<ServicerIP>:8080/order/getOrderById	請求方式	POST
Request信息	id
返回結果	0：失敗 1：成功
接口名稱	order/getOrderList	接口說明	根據訂單狀態獲取訂單列表
URL	http://<ServicerIP>:8080/order/getOrderList	請求方式	POST
Request信息	無
返回結果	0：失敗 1：成功
接口名稱	shipAddress/add	接口說明	添加收貨地址
URL	http://<ServicerIP>:8080/shipAddress/add	請求方式	POST
Request信息	id
返回結果	0：失敗 1：成功
接口名稱	shipAddress/delete	接口說明	刪除收貨地址
URL	http://<ServicerIP>:8080/shipAddress/delete	請求方式	POST
Request信息	id
返回結果	0：失敗 1：成功
接口名稱	shipAddress/modify	接口說明	修改收貨地址
URL	http://<ServicerIP>:8080/shipAddress/modify	請求方式	POST
Request信息	id
返回結果	0：失敗 1：成功
接口名稱	shipAddress/getList	接口說明	得到收貨地址列表
URL	http://<ServicerIP>:8080/shipAddress/getList	請求方式	POST
Request信息	無
返回結果	0：失敗 1：成功

5.2.4支付中心

本系統支付中心主要提供支付寶支付功能和刷新訂單狀態兩個接口，其調用的接口名稱如表5-4所示。

表5-4支付中心接口

接口名稱	pay/getPaySign	接口說明	獲取支付寶簽名
URL	http://<ServicerIP>:8080/pay/getPaySign	請求方式	POST
Request信息	無
返回結果	0：失敗 1：成功
接口名稱	order/pay	接口說明	刷新訂單狀態
URL	http://<ServicerIP>:8080/order/pay	請求方式	POST
Request信息	id
返回結果	0：失敗 1：成功

5.2.5消息中心

本系統主要提供消息列表展現接口，其調用的接口名稱如表5-5所示。

表5-5消息列表接口

接口名稱	msg/getList	接口說明	獲取通知列表
URL	http://<ServicerIP>:8080/msg/getList	請求方式	POST
Request信息	無
返回結果	0：失敗 1：成功

5.3 系統功能模塊設計與實現

詳細設計是軟件開發生命週期中不可或缺的一部分，該階段主要對各個模塊詳細的功能點進行實現。

上文中提到有Provider模塊，在此模塊中定義了業務層的會讓你多公共工具類和常量。在RouterPath.kt中定義了用戶模塊、訂單模塊、支付模塊、消息模塊的模塊路由。Provider結構如圖5-3所示。

圖5-3 Provider模塊結構

5.3.1 用戶中心模塊

用戶中心模塊在UserCenter模塊中進行實現，模塊內部結構如圖5-4所示。

圖5-4 UserCenter模塊結構圖

1.用戶登陸功能

登陸界面由類LoginActivity.kt來實現，對應的佈局是activity_login.xml。實現的界面如圖5-5所示。

圖5-5 登陸界面

在RouterPath.kt中已經定義用戶登陸模塊路由，代碼實現如圖5-6所示。

圖5-6 用戶模塊路由

實現登陸發關鍵代碼如圖5-7所示。

圖5-7 登陸代碼實現

2.用戶註冊功能

註冊功能由類RegisterActivity.kt實現，關聯的佈局文件爲activity_register.xml，實現的界面如圖5-8所示。

圖5-8 註冊界面

在註冊界面須要輸入手機號、驗證碼和密碼進行註冊，點擊註冊後將調用UserApi.kt接口下的regidter()方法完成註冊。主要業務代碼如圖5-9所示。

圖5-9 註冊代碼實現

5.3.2 商品中心模塊

商品中心頁面主要分爲首頁，分類頁，搜索頁，購物車。

1.首頁

用戶登陸成功後，即進入首頁。首頁的實現類及佈局在App主程序模塊中實現，結構如圖5-10所示。

圖5-10 App主程序模塊結構

主要實現類是HomeFragment.kt，所關聯的佈局文件是fragment_home.xml。實現頁面如圖5-11所示。

圖5-11 首頁展現

所使用的圖片均來自雲存儲（本系統使用七牛雲），減小了本地內存，並且方便更新商品。在MainConstant.kt中定義了每張圖片的路徑。

2.分類頁：

分類頁主要經過Adapter適配器，引入item來實現動態展現數據的功能。分類頁面如圖5-12所示。

圖5-12 分類頁面

3.搜索頁面

搜索頁面主要經過SearchGoodsActivity.kt進行搜索後動態展現商品列表，關聯的佈局文件爲activity_search_goods.xml。好比搜索"電腦"關鍵字，出現如圖5-13所示結果。

圖5-13 搜索頁面

在SearchGoodsActivity.kt中將關鍵字傳至服務器，服務器將篩選出來的商品回顯到前臺，關鍵代碼如圖5-14所示。

圖5-14 搜索代碼實現

4.購物車頁面：

購物車頁面由CartActivity.kt實現，關聯的佈局爲activity_cart.xml,只是Fragment一個殼，數據須要從服務器動態獲取。界面如圖5-15所示。

圖5-15 購物車實現頁面

數據只須要從服務器獲取便可。

5.3.3 訂單中心模塊

訂單中心包括兩部分：訂單管理和地址管理。

訂單管理

訂單管理在OrderCenter模塊中，其模塊結構如圖5-16所示。

圖5-16 OrderCenter模塊結構

主要經過OrderActivity.kt(訂單展現頁),OrderConfirmActivity.kt(訂單確認頁), OrderDetailActivity.kt(訂單詳情頁)管理整個訂單業務涉及的頁面，關聯的佈局文件分別爲activity_order. xml，activity_order_confirm. xml和activity_order_detail.xml。所實現的頁面如圖5-17所示。

圖5-17訂單基本頁面（左），訂單確認界面（中），訂單詳情頁面（右）

訂單模塊是由服務器提供數據動態加載佈局，若練完失敗或服務器沒有開啓，則不能看到訂單頁面。

訂單基礎頁面業務邏輯關鍵代碼如圖5-18所示。

圖5-18 訂單基礎頁面回顯代碼

地址管理

地址管理主要經過ShipAddressActivity.kt實現，關聯的佈局文件爲activity_address.xml，其實現結果如圖5-19所示。

圖5-19 地址管理界面

5.3.4 支付中心模塊

支付模塊在PaySDK模塊下實現，模塊結構如圖5-20所示。

圖5-20 PaySDK模塊結構

主要由CashRegisterActivity.kt來實現，關聯的佈局文件是activity_cash_register.xml。實現的支付界面如圖5-21所示。

圖5-21 支付頁面（左）沙箱環境默認頁面（右）

本系統使用沙箱環境進行模擬支付，其主要代碼如圖5-22所示。

圖5-22沙箱配置環境關鍵代碼

5.3.5 消息中心模塊

消息中心主要在MessageCenter模塊中實現，模塊結構如圖5-23所示。

圖5-23 Message Center模塊結構

由MessageAdapter.kt實現此功能，關聯的佈局文件有兩個，一個是消息容器佈局layout_message_item.xml，另外一個是消息頁面是fragment_message.xml。實現界面如圖5-24所示。

圖5-24 消息頁面實現頁

將經過如下代碼，把系統發佈的通知以列表的形式展現出來.代碼實現如圖5-25所示。

圖5-25 消息回調函數

5.4 CBIR簡單算法實現

CBIR分爲三個層次：

1.依據提取圖像自己的顏色、形狀、紋理等低層特徵進行檢索；

2.基於圖像的低層特徵，經過識別圖像中的對象類別及對象間的空間拓撲關係進行檢索；

3.基於圖像抽象屬性的推理學習進行檢索。

本文研究了基於CBIR算法在第一層次的簡單算法實現，實現過程以下：

第一步，縮小尺寸。在進行哈希運算時，不一樣圖片會由於個圖片像素不一樣帶來尺寸的差別，而影響圖像內容的匹配。代碼如圖5-26所示。

圖5-26縮小尺寸代碼實現

第二步，簡化色彩。不一樣的顏色會帶來哈希值的不一樣，由於電子商品的搜索是按照形狀等進行搜索，而不是經過顏色進行匹配。代碼如圖5-27所示。

圖5-27簡化色彩代碼實現

第三步，計算平均值，做爲灰度的對比線，使用此標準進行灰度分類。代碼實現如圖5-28所示。

圖5-28計算數組平均值代碼實現

第四步，計算圖片指紋。使用每一個像素的灰度與平均值進行對比。經過灰度和平均值的關係來肯定圖片的指紋。本系統將灰度大於或等於平均值，記爲1；灰度小於平均值，記爲0。代碼如圖5-29所示。

圖5-29比較像素的灰度代碼實現

第五步，計算哈希值。本系統將圖片壓縮爲8x8d大小，因此有64個像素，生成64個數字，將64個數字進行組合，就構成了一張圖片的指紋，也就是哈希值。要保持每張圖片的指紋組合順序保持一致代碼如圖5-30所示。

圖5-30計算哈希值代碼實現

第六步，進行匹配。上一步得到每張圖片的指紋，美國人指紋都是由64爲0和1進行組合的，計算兩張圖片者64位由多少位不一樣，即產生"漢明距離"，而後根據漢明距離的大小進行判斷。漢明距離越小，說明兩張圖片越類似。代碼實現如圖5-31所示。

圖5-31計算漢明距離

對比圖片對比後返回結果實現代碼如圖5-32所示。

圖5-32使用漢明距離判斷圖片類似度

第六章系統測試

6.1 測試方法介紹

本系統主要使用黑盒測試方法，也就是功能測試，對系統總體或部分功能進行測試，主要關注軟件的功能是否實現，而不關心其中的內部邏輯。在測試過程當中，軟件的內部結構是不可見的，主要根據其規格進行測試，驗證其與規格的一致性。

6.2測試過程

6.2.1 用戶中心模塊測試

用戶模塊主要測試註冊和登陸頁面及功能，測試用例如表6-1所示。

表6-1 用戶模塊測試用例

項目	內容
測試用例編號	T-USER01
測試用例名稱	用戶中心測試
目的	測試用戶註冊是否成功，用戶登陸是否成功，修改信息是否成功
測試用例級別	功能性測試
測試流程	1.進入"個人"，點擊左上角"登陸/註冊"按鈕進入登陸界面
	2.點擊右上角"註冊"按鈕進入註冊界面
	3.輸入手機號點擊"獲取驗證碼"，輸入驗證碼，密碼和確認密碼，點擊註冊
	4.返回到登陸按鈕輸入手機號和密碼進行登陸
	5.登陸成功自動跳轉"個人"頁面
	6.點擊頭像進入我的信息編輯頁面
	7.點擊頭像選擇本地圖片，輸入暱稱，選擇性別，設置個性簽名後點擊右上角"保存"按鈕
	7.點擊忘記密碼，輸入正確的手機驗證碼後從新設置密碼
預期結果	1. 進入"個人"，點擊左上角"登陸/註冊"按鈕進入登陸界面
	2.點擊右上角"註冊"按鈕進入註冊界面
	3.點擊"註冊"提示註冊成功
	4.點擊"登陸"後登陸成功
	5. 登陸成功自動跳轉"個人"頁面
	6.點擊頭像進入我的信息編輯頁面
	7.點擊"保存"按鈕後提示"保存成功"
	8.修改密碼成功後提示修改密碼成功
結論	經過

註冊測試過程

註冊成功後，提示"註冊成功"，如6-1所示；若是帳號已註冊，提示"該帳號已註冊"，如圖6-2所示。

圖6-1 註冊成功測試成功展現

圖6-2 帳號已被註冊測試展現

在數據庫中能夠看到已經註冊的帳號信息，如圖6-3所示。

圖6-3 數據庫帳戶信息

登陸測試過程

在登陸界面輸入手機號和密碼，若是輸入正確，則提示"登陸成功"，並跳轉到我的中心頁面；若是輸入的用戶名並未註冊，則提示"用戶不存在"；若是輸入密碼錯誤，則提示"密碼錯誤"。測試效果如圖6-四、6-五、6-6所示。

圖6-4 登陸成功展現

圖6-5 用戶不存在展現

圖6-6 密碼錯誤展現

修改我的信息測試過程

進入我的信息界面進行修改信息，修改完成後點擊保存，保存成功會提示"修改爲功"，測試展現如圖6-7所示。

圖6-7 修改信息測試

數據庫的數據將會發生改變，如圖6-8所示。

圖6-8 數據庫修改信息展現

重置密碼測試過程

點擊忘記密碼按鈕，輸入正確的驗證碼後可進行重置密碼。輸入兩次密碼，密碼一致時修改爲功，跳轉至登陸界面；密碼不一致時提示"密碼不一致"。效果如圖6-9，6-10所示。

圖6-9 密碼重置成功展現

圖6-10密碼不一致展現頁面

6.2.2 商品模塊測試

商品模塊測試主要測試首頁商品展現，分類頁面展現，搜索功能及商品展現，商品詳情頁及SKU信息選取，購物車功能測試。

1.首頁商品展現

進入系統見到的第一個頁面，數據均來自網頁，可正常展現數據。

2.分類頁面測試

主要測試類別展現、分類展現圖片功能，其測試用例如表6-2所示：

表6-2 分類頁面測試用例

項目	內容
測試用例編號	T-CATEGORY01
測試用例名稱	分類頁面測試
目的	展現類別和分來展現商品
測試用例級別	功能性測試
測試流程	1.點擊底部導航欄"分類"按鈕進入分類頁面
測試流程	2.點擊左側類別，右側顯示此類中的各個商品
預期結果	1. 點擊底部導航欄"分類"按鈕成功進入分類頁面
預期結果	2.點擊左側類別，成功顯示相應商品
結論	經過

分類頁面測試效果圖如圖6-11所示。

圖6-11分類測試展現

3.搜索功能測試

主要測試關鍵字搜索功能，其測試用例如表6-3所示。

表6-3 搜索測試用例

項目	內容
測試用例編號	T-SEARCH01
測試用例名稱	搜索功能測試
目的	經過關鍵字進行搜索並展現相關商品
測試用例級別	功能性測試
測試流程	1.點擊首頁頂部搜索框
	2.輸入關鍵詞後點擊右側"搜索"按鈕跳轉結果頁面
	3.搜索結果以兩列瀑布流的形式展現
預期結果	1.點擊首頁頂部搜索框，成功跳轉至輸入界面
預期結果	2.輸入關鍵詞後點擊右側"搜索"按鈕成功跳轉結果頁面
	3.搜索結果成功以兩列瀑布流的形式展現
結論	經過

在搜索框搜索"電腦"後，顯示效果如圖6-12所示。

圖6-12 搜索"電腦"結果圖

4.商品詳情頁測試

主要測試商品詳情展現狀況和商品規格選擇狀況，其測試用例如表6-4所示：

表6-4商品詳情測試用例

項目	內容
測試用例編號	T-DETAIL01
測試用例名稱	商品詳情測試
目的	測試商品詳情展現狀況及SKU選擇狀況
測試用例級別	功能性測試
測試流程	1.在搜索出的商品或分類商品中點擊商品進入詳情頁面
	2.在詳情頁面點擊規格選擇框進行SKU選擇
	3.右划進入商品詳情介紹
預期結果	1.在搜索出的商品或分類商品中點擊商品進入詳情頁面
預期結果	2.在詳情頁面點擊規格選擇框進行SKU選擇
	3.右划進入商品詳情介紹，顯示相關圖片
結論	經過

商品詳情頁分爲商品詳情和商品介紹，在商品詳情可選擇商品SKU信息。商品詳情測試效果如圖6-12所示。

圖6-13 商品詳情頁測試效果

5.購物車測試

主要測試購物車的添加、刪除、編輯、結算等功能，其測試用例如表6-5所示：

表6-5 購物車測試用例

項目	內容
測試用例編號	T-CAR01
測試用例名稱	購物車測試
目的	測試購物車的添加、刪除、編輯、結算等功能
測試用例級別	功能性測試
測試流程	1.在商品詳情頁面點擊右下角"加入購物車"
	2.點擊底部中間按鈕可進入購物車頁面
	3.點擊商品右側"+"或"-"可邊界商品購買數量，下面的總價會根絕商品數量和多選狀況進行計算
預期結果	1.在商品詳情頁面點擊右下角"加入購物車"，可看到購物車圖標數量提示
預期結果	2.點擊底部中間按鈕可成功跳轉購物車頁面
	3.點擊商品右側"+"或"-"可邊界商品購買數量，下面的總價會根絕商品數量和多選狀況進行計算
結論	經過

在購物車中選擇電腦一個，手機4個，全選後如圖6-14所示。

圖6-14 購物車測試頁面

6.2.3 訂單模塊測試

訂單模塊主要測試訂單狀態管理、取消訂單等功能其測試用例如表6-6所示：

表6-6 訂單測試用例

項目	內容
測試用例編號	T-ORDER01
測試用例名稱	訂單測試
目的	測試訂單狀態變化以及取消訂單功能
測試用例級別	功能性測試
測試流程	1.在購物車中點擊"結算"跳轉提交訂單頁面
	2.在提交訂單頁面選擇收貨地址，點擊提交訂單，跳轉支付頁面，同時生成訂單
	3.點擊當即支付跳轉至沙箱模擬支付系統
	4.輸入相關信息進行支付
	5.在待收貨訂單中點擊確認收貨，訂單完成
	6.在訂單條目下面點擊取消訂單
預期結果	1.在購物車中點擊"結算"成功跳轉提交訂單頁面
	2.在提交訂單頁面選擇收貨地址，點擊提交訂單，跳轉支付頁面，同時生成訂單，處於待付款狀態
	3.點擊當即支付跳轉至沙箱模擬支付系統
	4.輸入相關信息進行支付，支付成功後處於待收貨狀態
	5.在待收貨訂單中點擊確認收貨，訂單完成，處於已完成狀態
	16.在訂單條目下面點擊取消訂單，處於已取消狀態
結論	經過

根據付款和收貨狀態能夠改變訂單的狀態，效果圖如6-15和6-16所示。

圖6-15 訂單狀態測試1

圖6-16 訂單狀態測試2

6.2.4 支付模塊測試

因爲支付寶關閉我的申請支付接口，因此如今使用沙箱環境進行模擬支付。相關測試已在訂單測試中體現。測試效果如圖6-17所示。

圖6-17 沙箱測試支付功能

6.2.5 消息模塊測試

消息模塊主要測試系統給用戶發送的消息，其測試用例如表6-7所示：

表6-7 消息模塊測試用例

項目	內容
測試用例編號	T-MESSAGE01
測試用例名稱	消息測試
目的	系統能正常根據用戶操做提供消息
測試用例級別	功能性測試
測試流程	1.在主頁點擊底部導航欄的"消息"按鈕
測試流程	2.用戶登陸、下單等信息在此頁面內顯示
預期結果	1.在主頁點擊底部導航欄的"消息"按鈕
預期結果	2.用戶登陸、下單等信息在此頁面內成功顯示
結論	經過

系統會用戶登陸、購買等操做發送通知，在消息模塊能夠查看。測試效果如圖6-18所示。

圖6-18 消息測試展現

6.3測試結論

經過黑盒測試，"易圖購"App基本功能都符合規格，與預期結果一致，系統功能完善，符合需求分析階段的要求。測試重點在於用戶註冊、登陸，瀏覽、購買商品，提交訂單功能和支付功能，以上功能都可實現，知足用戶的購物基本要求，其中支付功能因爲支付寶未向我的用戶提供支付結構，本系統使用支付寶提供的沙箱環境進行模擬支付，在沙箱環境中可完成支付功能。其餘功能如購物車功能，搜索功能等均經過測試。圖像搜索算法已在後臺基本實現，但前端與後臺數據交互不夠完善，圖片上傳功能有待改善。

第七章總結與展望

7.1 總結

本系統基於Android使用Kotlin，採用MVP架構進行前端平臺開發，使用Spring + MyBatis框架實現服務器功能。本系統經過Kotlin-Android- Extensions、RxAndroid和RxKotlin進行MVP配置，使用Anko和Dagger2進行框架配置，使用模塊化思想解耦，最終組裝業務模塊實現完整系統。

本系統主要實現了用戶登陸、註冊和編輯信息功能，商品查詢、搜索、分類和加入購物車功能，訂單狀態提醒，添加收貨人信息功能，支付功能，消息提示功能。主要研究了基於內容的圖像檢索算法實現類似產品匹配和基於百度地圖進行地圖搜索實體店的核心功能。本系統經過黑盒測試，基本功能符合規格。同時，圖片搜索和地理位置功能有待優化。

7.2 展望

經過測試發現，本系統有如下功能須要進行添加和完善。

類似商品匹配功能沒有實現較完善的先後端數據交互。擬在後期完善先後臺交互功能，實現流暢的信息傳輸。在算法實現方面，算法較簡單，處理結果慢，時間複雜度高，並且經過哈希值方法準確性不高。擬在後期經過Tamura 紋理分析法、小波變換或LBP（局部二值模式，Local Binary Patterns）提取紋理以匹配更加準確的結果。

地圖搜索功能沒有徹底實現，擬在後期將經過百度地圖Android地圖SDK，經過AccessKey調用百度地圖，在此基礎上完成搜索商店的功能。

附錄

關於"易圖購"App的調查問卷

尊敬的各位用戶：

您好！首先感謝您參與本問卷的填答！我正在進行數碼商城App的調研，很想了解您在這方面的想法。您的意見對咱們的工做十分重要，請各位業主認真填寫如下問卷。本次問卷調查活動採用無記名的方式，全部我的信息資料咱們都將爲您保密，謝謝！

Q1：您的年齡：

○ 25歲如下

○ 26-35歲

○ 36-50歲

○ 51歲以上

Q2：您的性別：

○ 男

○ 女

Q3：你常常在網上購買電子商品嗎？

○ 常常

○ 通常

○ 從不

Q4：你喜歡在電腦網頁上購物仍是喜歡用手機上網購物？

○ 電腦

○ 比較差

○ 手機

Q5：你通常花多長時間瀏覽購物類網站和購買？

○ 30分鐘如下

○ 30分鐘-1小時

○ 1小時-2小時

○ 兩小時以上

Q6：您認爲系統最應當提供的功能包括？

□ 關鍵字搜索商品

□ 圖片搜索商品

□ 商品分類展現

□ 用戶操做消息推送

□ 搜索商品實體店

□ 其餘:

Q7：您感受電子商品搜索功能重要嗎？

○ 很大

○ 通常

○ 不是很重要

Q8：您對搜索出來的電子商品滿意嗎？

○ 很是滿意

○ 滿意

○ 通常

○ 不滿意

○ 很不滿意

Q9：您認爲有必要使用一個專門售賣電子商品的購物App嗎？

○ 須要

○ 不須要

○ 無所謂

Q10：您但願經過圖片來進行搜索商品嗎？

○ 很是但願

○ 但願

○ 無所謂

Q11：您認爲如下哪幾種商品須要經過圖片來進行搜索更加方便？

□ 鼠標

□ 電腦

□ 平板

□ 手機

□ 耳機

□ 黑科技

□ 音響

□ AI機器人

參考文獻

[1] 劉娜.我國網絡購物的發展及現狀[J].中國商界, 2008,(5X):44-46.

[2] 黃俊萍. 基於 iOS 的購物類電子商務APP的研究與設計[D]. 閩南理工學院, 2017.

[3] 劉均前. 基於Android的"易都行"在線購物商城系統的設計與實現[D]. 北京交通大學, 2018.

[4] 李峯. Android平臺下基於地理置信息的購物系統的設計與實現[D]. 南京郵電大學, 2017.

[5] 劉蓬. 基於 Android 平臺移動購物系統的設計與實現[J].信息與電腦（理論版）,2017,(24): 40.

[6]黃俊萍. 基於iOS的購物類電子商務App的研究與設計[J].齊齊哈爾大學學報,2017,33(6): 33-35.

[7] 李雪蓮.基於Android混合開發模式的網上購物系統的設計與實現[J].電子設計工程, 2018, 26(05):17-21.

[8] 戶磊.基於移動商品搜索的研究與實現[D].西南交通大學,2014.

[9] 疏斌,陳隆耀. 以圖搜圖技術的發展及應用探究[D].吉林大學,2017.

[10] 晉傑.基於多特徵融合的服裝圖片檢索關鍵技術研究[D].昆明理工大學,2017.

[11] Jrgensen C., Jrgensen P. Image Querying by Image Professionals[J]. Journal of the American Society for Information Science and Technology, 2005, 56(12): 1346-1359.

[12] 戴澤華,路誌爽,張連連,秦景. 基於內容的圖像檢索算法研究[J]. 河北建築工程學院學報, 2018, 36(2):117-121.

致謝

本設計是在**老師的悉心指導和嚴格要求下得以完成的，從課題選取、方案論證到具體設計和調試，無不凝聚着老師的心血和汗水，在四年的本科學習和生活期間，也始終感覺着導師的精心指導和無私的關懷，我受益不淺。在此向**老師表示深深的感謝和崇高的敬意。

不積跬步何以致千里，本設計可以順利的完成，也歸功於各位任課老師的認真負責，使我可以很好的掌握和運用專業知識，並在設計中得以體現。正是有了他們的悉心幫忙和支持，才使個人畢業論文順利完成，在此向個人任課老師以及信息工程學院的全部老師表示由衷的謝意，感謝他們四年來的辛勤栽培。

四年時光一晃而過，讓我成長了許多，成長的背後離不開父母對個人支持和同窗們對個人幫助，在此感謝父母對個人培養和指導，感謝同窗們的美好陪伴，願咱們的友誼地久天長。感謝全部幫助過、關心過個人人們！