亚洲免费av电影一区二区三区,日韩爱爱视频,51精品视频一区二区三区,91视频爱爱,日韩欧美在线播放视频,中文字幕少妇AV,亚洲电影中文字幕,久久久久亚洲av成人网址,久久综合视频网站,国产在线不卡免费播放

        ?

        智慧校園導(dǎo)游系統(tǒng)設(shè)計(jì)

        2019-01-06 02:19:22李春紅陳又銨李靖怡
        中國(guó)科技縱橫 2019年22期
        關(guān)鍵詞:跨平臺(tái)

        李春紅 陳又銨 李靖怡

        摘 要:隨著移動(dòng)互聯(lián)網(wǎng)技術(shù)的快速發(fā)展,移動(dòng)設(shè)備已經(jīng)成為了現(xiàn)代生活必不可少的一部分,如今在國(guó)內(nèi)外很多校園都可以看到智慧校園導(dǎo)游的身影,智慧校園導(dǎo)游可以幫助新生和游玩的訪客快速找到他們想要到達(dá)的位置,還可以方便地在線上了解校園的信息。一個(gè)基于現(xiàn)代GPS和交互式的應(yīng)用出現(xiàn)彌補(bǔ)了傳統(tǒng)導(dǎo)游系統(tǒng)的不足。本文將使用React Native架構(gòu)結(jié)合Express、Leancloud、Socket.IO等技術(shù)快速開(kāi)發(fā)一個(gè)跨平臺(tái)的智慧校園導(dǎo)游系統(tǒng)。

        關(guān)鍵詞:校園導(dǎo)游;React Native;跨平臺(tái);Node.js

        中圖分類號(hào):TP311.52 文獻(xiàn)標(biāo)識(shí)碼:A 文章編號(hào):1671-2064(2019)22-0057-02

        1 緒論

        1.1 項(xiàng)目背景

        大學(xué)校園是一個(gè)復(fù)雜的基礎(chǔ)設(shè)施,特別是新生和第一次接觸的人很難找到自己方向和位置。廣東海洋大學(xué)寸金學(xué)院占地超過(guò)2100畝,里面有許多不同的建筑,最高有11層。大多數(shù)建筑物互相連接。即使校園中的某些地方有地圖提示,用戶還是無(wú)法獲得繼續(xù)的幫助來(lái)到達(dá)目的地。目前有許多應(yīng)用程序提供導(dǎo)航系統(tǒng),如高德地圖、Apple Map等,當(dāng)然它們的功能在大學(xué)校園內(nèi)并不是很有效地提供大學(xué)校園內(nèi)的所有位置。

        1.2 項(xiàng)目目的

        (1)使用移動(dòng)解決方案開(kāi)發(fā)校園導(dǎo)航模塊,方便廣東海洋大學(xué)寸金學(xué)院的新生和訪客。(2)管理員可以通過(guò)后臺(tái)管理系統(tǒng)推送、更新和管理信息。(3)用戶可以在社交模塊進(jìn)行交流。

        2 可行性分析

        (1)本軟件導(dǎo)航模塊主要分為內(nèi)部用戶和外界用戶。內(nèi)部用戶包括學(xué)校師生、職工。本系統(tǒng)幫助他們獲取校園內(nèi)部各個(gè)基礎(chǔ)設(shè)施(包括教學(xué)樓、學(xué)院樓、學(xué)生公寓、食堂、運(yùn)動(dòng)場(chǎng)、超市、等等)的空間位置、詳細(xì)信息,為其生活、工作、學(xué)習(xí)提供方便。外界用戶為訪問(wèn)學(xué)者和新生家長(zhǎng),他們能方便的向系統(tǒng)尋求幫助,比如快速獲取學(xué)校某地的地理位置及最短路線,查詢某地點(diǎn)詳細(xì)信息等,通過(guò)以上分析具有一定的實(shí)用價(jià)值,有很強(qiáng)的用戶需求,該系統(tǒng)值得開(kāi)發(fā)。(2)本團(tuán)隊(duì)有很好的編程技術(shù)基礎(chǔ)。(3)有專業(yè)指導(dǎo)老師的支持和指導(dǎo)。

        3 需求分析

        3.1 軟件設(shè)計(jì)

        軟件設(shè)計(jì)架構(gòu)如圖1所示。

        3.2 軟件描述、開(kāi)發(fā)環(huán)境及生產(chǎn)環(huán)境

        3.2.1 軟件描述

        本軟件主要由校園資訊、校園導(dǎo)航、社交三大模塊組成。用戶可以在校園資訊模塊獲取到校園的最新資訊。如:校園、學(xué)生會(huì)、各社團(tuán)等校園機(jī)構(gòu)的新聞和通知;導(dǎo)航模塊:為不熟悉校園的用戶提供最快捷的導(dǎo)航;社交模塊:類似于微博、Twitter、Facebook、微信朋友圈微博客系統(tǒng),用戶可以發(fā)表最新動(dòng)態(tài)、想法和問(wèn)題。

        3.2.2 開(kāi)發(fā)環(huán)境及生產(chǎn)環(huán)境

        (1)開(kāi)發(fā)系統(tǒng):macOS Catalina 10.15。(2)基礎(chǔ)工具:Node.js、yarn。(3)開(kāi)發(fā)工具:Visual Studio Code、Webstorm、Xcde、Android Studio。(4)核心架構(gòu):React Native、Express。(5)數(shù)據(jù)庫(kù):MongoDB。(6)用戶管理系統(tǒng):LeanCloud。

        4 系統(tǒng)總體設(shè)計(jì)

        4.1 系統(tǒng)架構(gòu)設(shè)計(jì)

        系統(tǒng)架構(gòu)圖如圖2所示。

        4.2 數(shù)據(jù)庫(kù)設(shè)計(jì)

        本系統(tǒng)采用MongoDB作為數(shù)據(jù)庫(kù)。其主要特點(diǎn)是高性能、易存儲(chǔ),易部署。MongoDB支持類似于json的bson格式,可以很方便地存儲(chǔ)比較復(fù)雜的數(shù)據(jù)類型。

        本系統(tǒng)數(shù)據(jù)集合總有6個(gè),分別是_User(用戶信息集合)、Map(地圖信息集合)、New(校園資訊集合)、Comments(微博客推文集合)、CommentReply(微博客推文回復(fù)集合)。

        5 系統(tǒng)詳細(xì)設(shè)計(jì)與實(shí)現(xiàn)

        5.1 校園資訊模塊

        校園資訊模塊是系統(tǒng)的首個(gè)頁(yè)面,用戶第一時(shí)間看到校園的最新資訊。頁(yè)面布局十分簡(jiǎn)潔,背景主頁(yè)有白色和黑色,應(yīng)用會(huì)根據(jù)系統(tǒng)的設(shè)定改變而改變,完成適配IOS13的Dark Model。頁(yè)內(nèi)元素只有右上角的當(dāng)天時(shí)間、和卡片式按鈕組成。

        5.2 導(dǎo)游模塊

        導(dǎo)游模塊是系統(tǒng)的第二個(gè)頁(yè)面。設(shè)計(jì)和布局上采用簡(jiǎn)約化、扁平化風(fēng)格。頁(yè)內(nèi)元素主要由一個(gè)List組成,每個(gè)List元素左上角都有一個(gè)建筑物類別名稱,方便用戶方便快速尋找目的地點(diǎn),為用戶打開(kāi)目的地的詳細(xì)頁(yè)。在詳細(xì)頁(yè)里面用戶可以看到目的地所在位置、圖片、介紹和一個(gè)路線按鈕。當(dāng)用戶點(diǎn)擊路線按鈕后系統(tǒng)會(huì)在底部彈出一個(gè)ActionSheet,用戶可以根據(jù)自己的愛(ài)好選擇要使用的導(dǎo)航軟件進(jìn)行導(dǎo)航,用戶點(diǎn)擊后系統(tǒng)會(huì)跳轉(zhuǎn)到用戶所選擇的導(dǎo)航軟件并開(kāi)始導(dǎo)航。

        5.3 社交模塊

        5.3.1 用戶登錄注冊(cè)頁(yè)面

        用戶注冊(cè)登錄社交模塊的入口,這是用戶進(jìn)行的第一步操作,用戶輸入賬號(hào)密碼后,LeanCloud會(huì)查詢?cè)撚脩羰欠翊嬖?若是存在,LeanCloud會(huì)自動(dòng)判斷用戶所輸入的密碼是否匹配,若匹配,LeanCloud回發(fā)送一個(gè)SessionToken到軟件上,并跳轉(zhuǎn)到發(fā)現(xiàn)頁(yè)(社交模塊的首頁(yè))。

        5.3.2 發(fā)現(xiàn)頁(yè)

        (1)發(fā)布推文功能。用戶可以發(fā)布動(dòng)態(tài)、想法和問(wèn)題,以實(shí)現(xiàn)用戶之間的交流。發(fā)布推文是以純文字形式發(fā)布。

        當(dāng)用戶按下發(fā)送鍵時(shí),系統(tǒng)會(huì)檢測(cè)用戶是否輸入內(nèi)容,若輸入內(nèi)容為空,則返回當(dāng)前操作并提示用戶當(dāng)前輸入的內(nèi)容為空;若不為空,系統(tǒng)會(huì)把用戶的信息和用戶所輸入的內(nèi)容發(fā)送到LeanCloud上存儲(chǔ)。

        (2)發(fā)現(xiàn)頁(yè)頁(yè)面。用戶打開(kāi)發(fā)現(xiàn)頁(yè)后,系統(tǒng)會(huì)先判斷用戶是否在別的設(shè)備登錄,如果是則退出登錄,彈出登錄頁(yè)面讓用戶重新登錄;若否,系統(tǒng)會(huì)判斷當(dāng)前SessionToken是否過(guò)期,如果是則退出登錄,彈出登錄頁(yè)面;若否,系統(tǒng)會(huì)自動(dòng)向LeanCloud發(fā)送請(qǐng)求,獲取推文信息數(shù)據(jù),并保存到本地內(nèi)存中,渲染至頁(yè)面。發(fā)現(xiàn)頁(yè)內(nèi)用戶發(fā)布的每個(gè)推文。用戶都可以點(diǎn)擊評(píng)論按鈕后,把自己的想法發(fā)布到該推文的評(píng)論區(qū)。

        6 系統(tǒng)測(cè)試

        6.1 系統(tǒng)測(cè)試目的

        系統(tǒng)測(cè)試是軟件開(kāi)發(fā)中必不可少的環(huán)節(jié),測(cè)試結(jié)果直接反映出系統(tǒng)在不同的測(cè)試環(huán)境中是否會(huì)出現(xiàn)致命性錯(cuò)誤,也可以測(cè)試系統(tǒng)是否達(dá)到預(yù)想的效果。通過(guò)不同的測(cè)試可以提高代碼的質(zhì)量,為后期系統(tǒng)維護(hù)帶來(lái)便捷。本文主要對(duì)校園導(dǎo)航功能、用戶登錄注冊(cè)功能等進(jìn)行了測(cè)試。

        6.2 校園導(dǎo)航功能測(cè)試

        該功能比較簡(jiǎn)單,當(dāng)用戶在建筑具體界面點(diǎn)擊路線按鈕時(shí),只需要判斷用戶選擇的導(dǎo)航應(yīng)用是否存在。本系統(tǒng)在沒(méi)有安裝高德地圖和有安裝高德地圖的環(huán)境下進(jìn)行測(cè)試,都成功的實(shí)現(xiàn)了測(cè)試目的。

        6.3 社交模塊功能測(cè)試

        用戶登錄注冊(cè)功能測(cè)試流程;用戶登錄注冊(cè)功能是社交模塊的唯一入口,它的邏輯功能和市面上大多數(shù)的登錄注冊(cè)一樣:(1)判斷用戶是否登錄,若用戶已經(jīng)登錄,則跳轉(zhuǎn)到社交模塊主界面;若否,則彈出登錄注冊(cè)界面。(2)如果用戶已經(jīng)擁有賬戶,并在輸入框中輸入賬戶和密碼,若密碼錯(cuò)誤彈出提示框,提示用戶“密碼錯(cuò)誤”;若密碼正確,則跳轉(zhuǎn)到主界面。(3)當(dāng)用戶沒(méi)有賬戶,用戶需注冊(cè)賬戶,注冊(cè)成功并跳轉(zhuǎn)到主頁(yè)面。

        7 結(jié)語(yǔ)

        本項(xiàng)目目標(biāo)已經(jīng)基本完成,測(cè)試效果也到達(dá)預(yù)期。本系統(tǒng)實(shí)現(xiàn)了iOS和Android兩個(gè)平臺(tái)的客戶端,在性能上完全超過(guò)使用傳統(tǒng)的跨平臺(tái)Web架構(gòu),媲美原生架構(gòu)。在React Native的基礎(chǔ)上引入Expo庫(kù)讓開(kāi)發(fā)進(jìn)程又加快了一個(gè)檔次。LeanCloud,可以一行后端代碼都不用寫(xiě)就可以在全平臺(tái)上快速搭建自己的后端服務(wù)。

        當(dāng)然,軟件也有很多的不足,例如:社交模塊的推文系統(tǒng),不能發(fā)布圖文推文,不能像微信朋友圈那樣發(fā)布一條新的推文或者回復(fù)后及時(shí)顯示在頁(yè)面上,而是要刷新一下才能顯示在頁(yè)面上等等,后期會(huì)對(duì)軟件進(jìn)行不斷的修改和完善。

        參考文獻(xiàn)

        [1] 向治洪.React Native移動(dòng)開(kāi)發(fā)實(shí)戰(zhàn)[M].北京:人民郵電出版社,2018:1.

        [2] Expo[EB/OL].https://expo.io.

        [3] React Native中文網(wǎng)[EB/OL].https://reactnative.cn.

        [4] Ethan Brown.Web development with Node and Express leveraging the JavaScript stack[M].北京:人民郵電出版社,2015.

        [5] Mike Cantelon.Node.js in action[M].北京:人民郵電出版社,2014.

        猜你喜歡
        跨平臺(tái)
        跨層級(jí)網(wǎng)絡(luò)、跨架構(gòu)、跨平臺(tái)的數(shù)據(jù)共享交換關(guān)鍵技術(shù)研究與系統(tǒng)建設(shè)
        一款游戲怎么掙到全平臺(tái)的錢(qián)?
        潛力雙跨平臺(tái):進(jìn)階:誰(shuí)將跨入下一個(gè)“十大”?
        跨平臺(tái)APEX接口組件的設(shè)計(jì)與實(shí)現(xiàn)
        基于C++語(yǔ)言的跨平臺(tái)軟件開(kāi)發(fā)的設(shè)計(jì)
        基于C++語(yǔ)言的跨平臺(tái)軟件開(kāi)發(fā)
        移動(dòng)互聯(lián)網(wǎng)應(yīng)用跨平臺(tái)開(kāi)發(fā)
        一種虛擬現(xiàn)實(shí)應(yīng)用程序跨平臺(tái)方法的研究
        基于QT的跨平臺(tái)輸電鐵塔監(jiān)控終端軟件設(shè)計(jì)與實(shí)現(xiàn)
        基于OPC跨平臺(tái)通信的電機(jī)監(jiān)測(cè)與診斷系統(tǒng)
        国产激情无码一区二区| 男人的天堂av一二三区| 操老熟妇老女人一区二区| 中文字日产幕码三区国产| 男女猛烈xx00免费视频试看| 日韩av高清无码| 韩国日本亚洲精品视频| 免费视频一区二区三区美女| 欧美成人精品第一区| 久久综合国产乱子伦精品免费| 欧美精品在线一区| 亚洲高清乱码午夜电影网| 日韩a无v码在线播放| 精品国产乱码一区二区三区在线| 国产一区精品二区三区四区| 亚洲av色香蕉一区二区三区| 一本无码人妻在中文字幕免费| 人妻av一区二区三区av免费| 草青青视频手机免费观看| 国产日产亚洲系列最新| 欧美丰满熟妇乱xxxxx图片| 国产v精品成人免费视频400条 | 國产AV天堂| 午夜在线观看一区二区三区四区| 亚洲 小说区 图片区 都市| 真人作爱免费视频| 免费高清日本中文| 在线观看视频亚洲一区二区三区 | 亚洲精品无码久久久久牙蜜区| 女性自慰网站免费看ww| 亚洲精品中文字幕码专区| 男人添女人囗交做爰视频| av蓝导航精品导航| 亚洲综合久久1区2区3区| 全亚洲高清视频在线观看| 国产美女精品一区二区三区| 高清国产日韩欧美| 日本一区二区高清视频| 国产精品久久久爽爽爽麻豆色哟哟 | 大伊香蕉在线精品视频75| 亚洲a∨好看av高清在线观看|