APPinventor-GPS定位程序說明

1、4.2 程序界面設計圖4-1 程序界面程序界面采用藍白灰搭配的簡潔配色和扁平化的視覺設計，減少用戶的認知成本。在APP Inventor中采用Screen Arrangement控件對屏幕進行分割與排版來保持界面美觀。圖4-2 界面布局程序一共有3屏，分別是Screen1搖一搖定位界面、Screen2定位信息和Screen3數(shù)據(jù)記錄。每個Screen之間可以跳轉返回。4.3 程序架構設計Screen1搖一搖定位界面，當用戶晃動手機觸發(fā)定位功能。當手機定位成功獲取到經(jīng)緯高度數(shù)據(jù)時，便將數(shù)據(jù)傳到Screen2。當定位失敗，沒有獲取到數(shù)據(jù)，Screen1就會觸發(fā)一個計時器，每0.5秒重新獲取一次經(jīng)緯

2、高度，此時界面顯示正在定位。直至獲取到信息后才會打開Screen2，否則一直停留在Screen1。Screen2定位信息界面。Screen2接受到Screen1傳來的經(jīng)緯高度信息后通過WebPost向API發(fā)送請求，WebGet獲取API返回的數(shù)據(jù)進行處理從而將結果顯示到Screen2。用戶錄入設備信息后按保存按鈕，Screen2將通過WebPost向數(shù)據(jù)庫上傳數(shù)據(jù)。圖4-3 程序界面流程圖Screen3數(shù)據(jù)記錄。數(shù)據(jù)記錄可對數(shù)據(jù)庫的數(shù)據(jù)進行瀏覽、刪除、發(fā)送的操作。4.4 搖一搖功能當用戶晃動手機，重力傳感器AccelerometerSensor觸發(fā)震動效果并激活GPS定位功能。4.5 GPS

3、定位功能GPS定位功能是調用了LocationSensor部件獲取經(jīng)緯高度信息。手機晃動，計時器Clock2生效。Clock2生效時每0.5秒觸發(fā)一次。當獲取的Latitiude不等于0時，也就是成功獲取經(jīng)緯高度信息時，Clock2失效，同時將數(shù)據(jù)傳到Screen2并打開Screen2。圖4-4 搖一搖定位功能編程 GPS定位成功的判斷過程在Screen1完成。4.6 API調用利用APP Inventop里的Web組件對API進行調用，利用Web.get來獲取返回的數(shù)據(jù)程序。一共調用了3個API。第一個是轉換坐標的API：/gpsApi.php?lat=

4、22.2&lng=113.將經(jīng)緯度發(fā)送過去獲得轉換后的百度坐標系的經(jīng)緯高度。第二個是獲取靜態(tài)地圖的API：/staticimage?center=116.,39.&width=300&height=200&zoom=11將轉換后的經(jīng)緯高度發(fā)送過去獲得對應經(jīng)緯高度的靜態(tài)地圖。第三個是獲取街道名稱的API：/geocoder?location=23.,112.&output=json&key=E78ebbf34f3b7d067d7b94a18dd642bb將轉換后的經(jīng)緯高度發(fā)送過去獲得對應街道地址。圖4-5

5、 Json解碼編程第一個和第三個API的返回值是包含結果的JSON值，需要將結果提取出來。Web1即第一個API的JSON提取如圖。4.7 信息錄入功能利用ListPicket組件，可讓對設備類型進行選擇，texebox組件可獲得用戶輸入的設備信息。右圖是將用戶選擇的設備類型的值+用戶輸入的設備信息的值設為tag的值。將經(jīng)緯高度信息的值設為val值。圖4-6 信息錄入功能編碼4.8 新浪SAE數(shù)據(jù)庫的搭建程序中所使用的網(wǎng)絡數(shù)據(jù)庫是新浪SAE的MySQL數(shù)據(jù)庫。首先在新浪SAE注冊一個開發(fā)者賬號，注冊完畢就就能使用MySQL服務。數(shù)據(jù)庫的PHP代碼如下runSql ( $sql );echo 1

6、;break;case 2 :$result = mysql_query ( SELECT * FROM test1 where tag= . $tag . ); / 下載數(shù)據(jù)while ( $row = mysql_fetch_array ( $result ) ) echo $row value . ,;break;case 3 :$sql = SELECT * FROM test1; / 獲取所有val$result = mysql_query ( $sql );while ( $row = mysql_fetch_array ( $result ) ) echo $row value

7、. ,;break;case 4 :$sql = delete from test1 where tag = . $tag . ;/ 獲取所有tag$mysql-runSql ( $sql );echo 1; / 刪除指定tag的數(shù)據(jù)break;case 5 :$sql = update test1 set value = . $value . where tag = . $tag . ;$mysql-runSql ( $sql );echo 1; / 更換數(shù)據(jù)break;default :echo 0;$mysql-closeDb ();?數(shù)據(jù)庫的訪問連接為http:/1.chyang201

8、4./index.php?ord=1通過修改ord=1,2,3,4,5的值來實現(xiàn)不同的功能。1為上傳數(shù)據(jù)，2為獲取所有tag，3為獲取所有val，4為刪除指定tag的數(shù)據(jù)，5為替換指定tag的數(shù)據(jù)。4.9 數(shù)據(jù)操作功能圖4-7 數(shù)據(jù)上傳功能編程4.9.1 數(shù)據(jù)上傳功能利用web組件訪問網(wǎng)址http:/1./index.php?ord=1，利用Web.Post將tag和val的值上傳到數(shù)據(jù)庫4.9.2 數(shù)據(jù)刪除功能同理，利用web組件訪問網(wǎng)址http:/1./index.php?ord=

9、4，利用Web.Post將tag的值上傳到數(shù)據(jù)庫就能刪除對應的val和tag。4.9.3 數(shù)據(jù)發(fā)送功能利用ActivityStarter1組件，呼叫的action為 ent.action.SEND，ExtraKey為ent.extra.TEXT即可呼出類似分享按鈕的功能。通過這個Acivity，可將經(jīng)緯高度信息通過短信、微信、郵件、QQ等以分享方式發(fā)送出去。4.9.4數(shù)據(jù)列表獲取利用web組件訪問http:/1./index.php?ord=2圖4-8 數(shù)據(jù)記錄界面和http:/1.chyang2014.s

10、/index.php?ord=3獲取所有的tag和val值，并將它們逐個顯示到label中。當中利用tag數(shù)組的長度來確定列表的長度。第五章 程序調試與測試在開發(fā)過程中，遇到兩個難題導致程序一直報錯，最后經(jīng)過調試后終于得以解決。5.1 Screen2定位信息報錯Screen2定位信息報錯的原因由于當初沒有在Screen1設置判斷經(jīng)緯高度的數(shù)值。若果定位失敗，經(jīng)緯高度的值為0.0，0.0，0.0。當Screen2將這串數(shù)值發(fā)送到API后，返回的結果跟正常結果不同，使原本Screen2中的Json解析函數(shù)不能解析，發(fā)生錯誤導致程序報錯。解決辦法：在Screen1中設置定位是否成

11、功的判斷，如圖4-所示，當LocaticonSensor1.Latitude不等于0，也就是定位成功后才執(zhí)行后邊的語句，否則就重復獲取經(jīng)緯高度直至LocaticonSensor1.Latitude不等于0。圖5-1 程序報錯信息5.2 Screen3數(shù)據(jù)記錄報錯Screen3數(shù)據(jù)記錄報錯的原因是原來列表項數(shù)的判斷位于tag數(shù)組的語句中， val數(shù)組語句中并沒有根據(jù)數(shù)據(jù)長度來決定列表項數(shù)。當網(wǎng)速受影響，val數(shù)組獲取快于tag數(shù)組，由于沒有判讀列表項數(shù)，空列表會執(zhí)行讀取語句導致讀取到空的數(shù)組導致程序報錯。解決辦法：添加val數(shù)組中列表項數(shù)的判斷。圖5-2 添加的代碼5.3 錄入信息設置限制字符圖5-4 限制字符提示圖5-3 限制字符編程數(shù)據(jù)庫中返回的tag值是由“,”來隔開每一個值。所以如果tag數(shù)組中（即設備類型+設備信息）含有“,”將影響Screen3中數(shù)據(jù)列表的解析，從而導致列表結果顯示出錯。所以在輸入設備信息中加入限制的字符，當輸入的設備信息含有該字符時，程序會出現(xiàn)相應提示。5