PAGE第3頁，共8頁上海商學(xué)院2019~2020學(xué)年第2學(xué)期《移動(dòng)應(yīng)用開發(fā)與實(shí)現(xiàn)》期末考試試卷總課時(shí)：48A卷（開卷）適用年級：2017級本科適用專業(yè)：電子商務(wù)考試時(shí)間：2周班級：姓名：學(xué)號：題號一二三四五總分閱卷人復(fù)核人得分具體要求及分?jǐn)?shù)設(shè)定如下：一（總分20分）使用墨刀的內(nèi)置素材，實(shí)現(xiàn)支付寶支付的應(yīng)用邏輯。運(yùn)行效果如圖1所示，項(xiàng)目由“主頁”、“支付寶啟動(dòng)”、“支付”、“指紋支付”、“付款成功1”、“付款成功2”六個(gè)頁面組成，并且每一個(gè)頁面上有【真實(shí)的學(xué)號】與【真實(shí)的姓名】。當(dāng)單擊“主頁”上的“支付演示”按鈕時(shí)，將在用戶的交互作用下依次實(shí)現(xiàn)“支付寶啟動(dòng)”頁面—>“支付”頁面—>“指紋支付”頁面—>“付款成功1”頁面—>“付款成功2”頁面的跳轉(zhuǎn)。（a）“主頁”（b）“支付寶啟動(dòng)”頁面（c）“支付”頁面（d）“指紋支付”頁面（e）“付款成功1”頁面（f）“付款成功2”頁面圖1二（總分20分）側(cè)邊欄布局是一種常見的布局方案，實(shí)現(xiàn)一個(gè)側(cè)邊欄實(shí)例，具體如下所示：(1)實(shí)例有兩個(gè)頁面：一個(gè)頁面上有標(biāo)識【真實(shí)的學(xué)號】；一個(gè)頁面上標(biāo)識為真實(shí)的姓名，并且有頂部導(dǎo)航欄，頂部導(dǎo)航欄上左側(cè)有圖標(biāo)，標(biāo)題文字為【真實(shí)的班級簡稱】。(2)實(shí)例有兩個(gè)狀態(tài)，如圖2所示。當(dāng)單擊狀態(tài)1中頁面的頂部導(dǎo)航欄左側(cè)圖標(biāo)，切換到狀態(tài)2；單擊狀態(tài)2中頁面的頂部導(dǎo)航欄左側(cè)圖標(biāo)，恢復(fù)到狀態(tài)1。（a）狀態(tài)1（b）狀態(tài)2圖2三（總分20分）請?jiān)O(shè)計(jì)一個(gè)APP，并且滿足下面條件：(1)實(shí)現(xiàn)個(gè)性化的APP首頁。如圖3（a）所示，要求首頁由頂部標(biāo)題欄、廣告位滑塊、4X4宮格組成。頂部標(biāo)題欄中的標(biāo)題文字為【真實(shí)的姓名-真實(shí)的學(xué)號末三位】；(2)單擊宮格中的第一個(gè)格子，實(shí)現(xiàn)頁面跳轉(zhuǎn)。跳轉(zhuǎn)頁面如圖3（b）所示，要求頂部標(biāo)題欄中的標(biāo)題文字為【真實(shí)的班級簡稱】。（a）首頁（b）跳轉(zhuǎn)頁面圖3四（總分20分）開發(fā)小程序。小程序的tabBar上有二個(gè)tab(如圖4所示)，其中“首頁”顯示數(shù)據(jù)庫中的動(dòng)態(tài)店鋪信息、“我的”頁面顯示真實(shí)的班級、學(xué)號、姓名。（a）首頁（b）跳轉(zhuǎn)頁面圖4五（總分20分）在小程序中，可以采用模塊化方法把公共的邏輯代碼放到一個(gè)js文件中。請將下面所示的details.js中bindManual、bindPlus、bindMinus的共有代碼放在一個(gè)公共的common.js文件中。//pages/details/details.jsvarcommon=require('../../utils/common.js')//獲取common.js文件暴露的數(shù)據(jù)接口Page({data:{…},/*輸入框事件*/bindManual:function(e){constfid=e.currentTarget.dataset.fid;//獲取fidletinput_num=parseInt(e.detail.value);//獲取輸入框數(shù)值letlist=this.data.foodsList;//獲取餐品列表//更新餐品件數(shù)for(vari=0;i<list.length;i++){if(list[i].fid==fid){list[i].num=input_num;break;}}this.setData({foodsList:list});//計(jì)算總件數(shù)varsum=0;for(vari=0;i<list.length;i++){varQC=list[i].num;sum+=parseFloat(QC);}//計(jì)算總價(jià)格varprice=0;if(sum>0){for(vari=0;i<list.length;i++){varQB=list[i].price;varQR=list[i].num;price+=QB*QR;}}//更新動(dòng)態(tài)數(shù)據(jù)：總件數(shù)、總價(jià)格this.setData({allNum:sum,allPrice:price.toFixed(2),})},/*加號單擊事件*/bindPlus:function(e){constfid=e.currentTarget.dataset.fid;letlist=this.data.foodsList;//更新餐品件數(shù)letnum=0;for(vari=0;i<list.length;i++){if(list[i].fid==fid){num=parseInt(list[i].num);num=num+1;list[i].num=num;break;}}this.setData({foodsList:list});//計(jì)算總件數(shù)varsum=0;for(vari=0;i<list.length;i++){varQC=list[i].num;sum+=parseFloat(QC);}//計(jì)算總價(jià)格varprice=0;if(sum>0){for(vari=0;i<list.length;i++){varQB=list[i].price;varQR=list[i].num;price+=QB*QR;}}//更新動(dòng)態(tài)數(shù)據(jù)：總件數(shù)、總價(jià)格this.setData({allNum:sum,allPrice:price.toFixed(2)})},/*減號單擊事件*/bindMinus:function(e){constfid=e.currentTarget.dataset.fid;letlist=this.data.foodsList;//更新餐品件數(shù)letnum=0;for(vari=0;i<list.length;i++){if(list[i].fid==fid){num=parseInt(list[i].num);if(num<1){list[i].num=0;}else{num=num-1;list[i].num=num;}break;}}this.setData({foodsList:list});//計(jì)算總件數(shù)varsum=0;for(vari=0;i<list.length;i++){varQC=list[i].num;sum+=parseFloat(QC);}//計(jì)算總價(jià)格varprice=0;if(sum>0){for(vari=0;i<list.length;i++){varQ