標(biāo)記是一個(gè)塊標(biāo)記，可以實(shí)現(xiàn)盒子內(nèi)頁(yè)面的規(guī)劃和布局，將頁(yè)面再分割為獨(dú)立的部分。標(biāo)記屬性先在父DIV中設(shè)置相對(duì)定位，然后再在子DIV中用絕對(duì)定位法定位。在設(shè)計(jì)過(guò)程中，使用絕對(duì)法定位position：absolute，而浮動(dòng)法float容易出現(xiàn)溢出問(wèn)題，會(huì)加大工作量，因此不采用。

1.3.1 首頁(yè)設(shè)計(jì)

首頁(yè)采用頂部輪播圖，即中間圖文展示推薦商品，底部菜單導(dǎo)航的構(gòu)造方式，包括用戶近期搜索記錄與當(dāng)下熱門(mén)搜索推薦商品。具體首頁(yè)頁(yè)面的效果圖如圖1所示。

圖1 首頁(yè)展示

主要代碼（輪播圖Carousel模塊，tap導(dǎo)航模塊，圖文展示模塊）如下。

1.3.2 分類(lèi)頁(yè)面的設(shè)計(jì)

在頂部和底部，分類(lèi)頁(yè)面均采用宮格導(dǎo)航的方式來(lái)使用戶能夠迅速進(jìn)入目標(biāo)頁(yè)面，中間部分使用側(cè)邊導(dǎo)航將校園招聘、電子產(chǎn)品、學(xué)習(xí)用品和失物招領(lǐng)等分類(lèi)項(xiàng)目細(xì)化，使該程序的內(nèi)容更清晰明顯，以便找到對(duì)應(yīng)目標(biāo)。具體首頁(yè)頁(yè)面的效果圖如圖2所示。

圖2 分類(lèi)頁(yè)面展示

主要代碼（頂部導(dǎo)航nav模塊和分類(lèi)模塊Classfication）如下。

"navOption"： [//頂部導(dǎo)航欄設(shè)置考研，四六級(jí)，二手書(shū)籍和搜索四個(gè)功能按鈕，選用navOption模塊，用img圖片覆蓋icon，形成新的按鈕實(shí)施跳轉(zhuǎn)功能

1.3.3 發(fā)布界面的設(shè)計(jì)

設(shè)置文本輸入框，發(fā)布者需要在此對(duì)發(fā)布品做一個(gè)概述，可以上傳9張以內(nèi)的圖片，更清晰地展示所發(fā)布實(shí)體的內(nèi)容。根據(jù)發(fā)布品的屬性，該程序增加了分類(lèi)選擇功能，發(fā)布后能夠自動(dòng)歸類(lèi)。還設(shè)置了價(jià)格和是否論價(jià)的功能。發(fā)布頁(yè)面細(xì)化了forminput、formimage、formselect和formswitch等主要模塊，具體首頁(yè)頁(yè)面的效果圖如圖3所示。

圖3 發(fā)布頁(yè)面設(shè)計(jì)

主要代碼如下。

"component": "FormInput"，//通過(guò)使用表單上傳模塊，將發(fā)布的商品更新到分類(lèi)頁(yè)面中，在表單模塊將文字處理與圖片展示等細(xì)節(jié)進(jìn)行具體化處理

1.3.4 個(gè)人界面的設(shè)計(jì)

個(gè)人頁(yè)面主要分為3個(gè)盒子模型，第一個(gè)盒子模型為個(gè)人信息，涉及學(xué)校、姓名和賬號(hào)，代碼設(shè)計(jì)如發(fā)布頁(yè)面的上傳模塊；第二個(gè)盒子模型為個(gè)人頁(yè)面功能鍵，如交易記錄、設(shè)置和客服等；第三個(gè)盒子模型為廣告輪播圖，設(shè)置為廣告位，具體首頁(yè)頁(yè)面的效果圖如圖4所示。

圖4 個(gè)人頁(yè)面

主要代碼如下。

"component"： "GridLayout"，//采用網(wǎng)格布局，使頭像上傳模塊與信息輸入模塊再次細(xì)分為3∶9的大小，分成兩個(gè)新盒子模型

2 大學(xué)生閑置物品微信小程序功能及作用

2.1 整合資源，分類(lèi)查找

隨著網(wǎng)絡(luò)的迅速發(fā)展，許多學(xué)校通過(guò)閑置互助的QQ群或者微信群來(lái)進(jìn)行資源的互通互助，便捷的同時(shí)也存在許多弊端：如消息覆蓋，不利于目標(biāo)信息的篩選以及解決問(wèn)題的效率低等。同時(shí)，很多學(xué)校之間存在資源不共享的問(wèn)題，例如學(xué)習(xí)一門(mén)專(zhuān)業(yè)課時(shí)想要搜尋相關(guān)資源，當(dāng)下只能通過(guò)慕課等一類(lèi)專(zhuān)業(yè)性的課程軟件來(lái)獲得，這類(lèi)軟件同時(shí)也存在交流困難的問(wèn)題，很難進(jìn)行學(xué)生與學(xué)生之間的資源互通。

針對(duì)此現(xiàn)狀，該文在整合各大高校各類(lèi)資源的同時(shí)，在首頁(yè)設(shè)置了一些熱門(mén)信息的按鈕，方便同學(xué)直接搜索自己想要的內(nèi)容，也可以篩選地點(diǎn)，進(jìn)行本校資源的迅速查找。具體如圖1和圖2所示。

2.2 校園認(rèn)證，擁有專(zhuān)門(mén)保障團(tuán)隊(duì)

經(jīng)調(diào)查顯示，閑魚(yú)等二手軟件近年來(lái)出現(xiàn)了不少詐騙、虛假信息等問(wèn)題，加上部分同學(xué)經(jīng)常通過(guò)閑魚(yú)等二手軟件進(jìn)行校園資源的轉(zhuǎn)賣(mài)，其財(cái)產(chǎn)安全難以得到很好的保障。因此，該小程序設(shè)計(jì)了校園認(rèn)證這一版塊，同學(xué)需要提供自己真實(shí)的學(xué)校、學(xué)號(hào)和姓名等信息。與此同時(shí)，該小程序在每個(gè)學(xué)校都擁有一個(gè)專(zhuān)業(yè)性的保障團(tuán)隊(duì)，他們的任務(wù)是將本校同學(xué)需要交易的商品進(jìn)行寄出前的現(xiàn)場(chǎng)核對(duì)，以確保商品的準(zhǔn)確與完好。這一做法可以保障同學(xué)的財(cái)產(chǎn)安全，減少詐騙等虛假信息。具體如圖4所示。

2.3 轉(zhuǎn)賣(mài)二手書(shū)籍

每當(dāng)進(jìn)入新的學(xué)期，身邊經(jīng)常會(huì)有轉(zhuǎn)賣(mài)二手書(shū)籍的情形，同時(shí)也有很多同學(xué)想要尋找其他學(xué)校和自己專(zhuān)業(yè)相關(guān)的書(shū)籍，但是很多課程比較具體化，沒(méi)有相關(guān)參考書(shū)和資料，這時(shí)就需要各大高校學(xué)生之間進(jìn)行信息上的互通。

因此該小程序還專(zhuān)門(mén)設(shè)計(jì)了二手書(shū)版塊，學(xué)生可以使用發(fā)布這一功能，將自己不需要的書(shū)籍進(jìn)行售賣(mài)，同時(shí)此版塊還可以和其他跨校同學(xué)互換書(shū)籍，這樣的設(shè)計(jì)大大提高了專(zhuān)業(yè)性書(shū)籍的利用效率。發(fā)布頁(yè)面具體如圖3所示。

2.4 懸賞答題

經(jīng)調(diào)查顯示，市場(chǎng)上已經(jīng)存在的作業(yè)幫等解題軟件，或多或少都集拍題、搜答案與學(xué)生討論解答為一體，但是其中與大學(xué)專(zhuān)業(yè)課及其解答相關(guān)的少之又少，其目標(biāo)人群大部分為中小學(xué)學(xué)生，對(duì)大學(xué)專(zhuān)業(yè)性問(wèn)題提出幫助的很少。

因此，針對(duì)大學(xué)專(zhuān)業(yè)性問(wèn)題，該小程序設(shè)置了懸賞解答版塊，通過(guò)支付報(bào)酬的方法來(lái)提高用戶解惑答疑的積極性。學(xué)生也可以向全國(guó)各大高校學(xué)生提出問(wèn)題，由于面向?qū)ο蟮膶哟蜗嗤瑢?zhuān)業(yè)的針對(duì)性高，因此他們的問(wèn)題可以更快速地得到解決。

2.5 生活互助

針對(duì)一些校園互助的問(wèn)題，該小程序還設(shè)置了同校拼車(chē)、校園跑腿等功能，在方便同學(xué)的同時(shí)，也能夠減少同學(xué)的生活開(kāi)銷(xiāo)。

2.6 消毒服務(wù)

平臺(tái)用戶可根據(jù)自身需要或者所出售（購(gòu)買(mǎi)）物品種類(lèi)選擇物品消毒服務(wù)，以此提高物品的衛(wèi)生質(zhì)量，減弱消費(fèi)者對(duì)閑置物品的排斥心理，進(jìn)而提高對(duì)閑置物品交易平臺(tái)的使用頻率。

3 結(jié)語(yǔ)

大學(xué)生閑置物品小程序的開(kāi)發(fā)有效地促進(jìn)了資源的循環(huán)利用和綠色經(jīng)濟(jì)的發(fā)展，改善校內(nèi)閑置交易現(xiàn)狀，為大學(xué)生提供了一個(gè)安全化、規(guī)范化和人性化的交易平臺(tái)，使校內(nèi)大學(xué)生的二手交易在更便捷的同時(shí)，提高了交易效率，減少了資源的過(guò)度浪費(fèi)。