之前我們在第四章學到用手機的Sensor抓到目前的位置並用Button觸發顯示定位經緯度
接下來我們要結合Google Map，讓按下Button後會抓取使用者位置，然後顯示在Google Map上
Step.1 新建一個專案 專案名稱為CH5_學號
Step.2 設計Layout 使用一個WebView和一個Button，按下Botton會在Map顯示自己的位置
● WebView 元件一般在 Palette → Widgets
Step.3 設定存取權限
(1) 在Android列表中的app → manifests資料夾中，點擊 Androidmanifest.xml
(2) 在Androidmanifest.xml 加上許可權
Step.4 設計Google maps javascript api
還記得之前上課時學到如何將Google Map嵌入網頁中嗎?
我們一樣要先將地圖的html放到專案中
(1) 進入到Google Map官網
https://developers.google.com/maps/documentation/javascript/examples/?hl=zh-tw
(2) 找到simple markers，在裡面新增一個function centerat，等等會呼叫來改變地圖中心
● 部分程式碼如下：
● html 完整程式碼 高清圖： https://imgur.com/a/h3f7hs7
(3) 在Src -> main建立一個名為 assets 的資料夾
1. 點app資料夾，滑鼠右鍵 → New → Folder → Assets Folder
2. 跳出New Android Component視窗後，Target Source Set 預設 main ，確認完畢，按 Finish
3. assets 資料夾就會新增在Android列表中的app裡
(4) 在assets 資料夾中，新增html檔
1. 在Android列表中的app中，點擊 assets 滑鼠右鍵 → New → File
2. 跳出 New File 視窗，輸入 simplemarker.html 的檔名，然後按 Enter
3. html 檔就會在 assets 資料夾中新增完成
4. 點擊html 檔後，就能輸入 Google maps javascript api 的程式碼
html 完整程式碼 高清圖： https://imgur.com/a/h3f7hs7
※ 除了在 Android Studio 程式上新增 assets 資料夾 及 html 檔外，也能夠透過專案路徑去新增 assets 資料夾 ，將 html 檔放到 assets 中。
Step.5 接下來就是上次第四章的步驟啦
(1)宣告和設定
(2)在 onCreate 裡加上加上指定 LocationManager 的定位方法
● LocationManager.GPS_PROVIDER //使用GPS定位
● LocationManager.NETWORK_PROVIDER //使用網路定位
(3) 建立一個按下按鈕後的事件聆聽
(4) 在按鈕事件內新增一個LocationManager
● LocationManager可以用來獲取當前的位置，追蹤設備的移動路線
(5) 加上事件的更新條件設定
● 事件的條件設定為時間間隔1秒，距離改變0米，設定監聽位置變化
(6) 利用locationManager.getLastKnownLocation取得當下的位置資料
※ 因為 Android 的版本差異，會發現在程式碼下方會出現紅色問題波浪
1. 這時候使用 Alt + Enter ，會跳出選單，選擇 Add permission check 
2. 程式會自動補上許可證明
3. 同時將 this 改寫為 MainActivity.this
4. 然後在內部補上用來開啟手機定位權限
(7) 使用WebView
1. 只是這次不需要TextView，而是使用WebView顯示，復習一下之前的上課內容，把WebView加進去，同時加上botton
2. 再來我們把按鈕上下的動作，改成呼叫 html 裡的 centerat 改變中心位置
● 設定一個判斷式，如果座標有值，就把座標從centerat抓出來並顯示到 WebView 上
(8) 新增一個新的監聽器， 當位置生變化時觸動事件發生
程式到這邊就大功告成了
Step.6 執行程式
(1) 開啟程式後，會先進入到 html 預設的定位
(2) 按下Position後，程式就抓到現在的位置並顯示在手機上啦
完整程式碼 高清圖：https://imgur.com/a/LUmlFqa
留言列表
