Android Tutorial 第四堂(2)設計地圖應用程式 - Google Maps Android API v2
專欄作者新書出版:Android App程式開發剖析 第三版(適用Android 8 Oreo與Android Studio 3) Android Tutorial 第四堂(1)使用照相機與麥克風 << 前情 地圖已經是非常普遍的使用在各種應用程式,Google在2013年2月,為Android平台推出Google Maps Android API v2,使用全新的設計方式,改良地圖元件的畫面與效率,增加3D建築物,還有簡化的繪圖API。Android已經在2013年4月停止舊的API,所以這裡只會說明Google Maps Android API v2的設計方式。 Google Maps Android API v2包含在「Google Play Service SDK」,目前不能在模擬裝置中測試地圖應用程式,所以必需準備好實體裝置,接下來的應用程式必須安裝在實體裝置執行測試。 這一章為記事資料加入地圖元件的應用,如果使用者在記事資料儲存座標的資料,就可以啟動地圖元件顯示儲存的地點: 13-1 建立地圖元件地圖元件從網路下載所有的資料,包含地圖、接道名稱、衛星空照與地形。應用程式必須申請專用的「Google Maps API Key」,才可以正確的下載資料。使用Android Studio可以簡化地圖應用程式的開發,在開始設計地圖應用程式之前,先依照下列的的步驟,確認已經安裝好「Google Play services」SDK:
依照下列的的步驟,為記事應用程式新增一的地圖元件:
完成上面的步驟以後,就已經建立好一個預設的地圖元件。依照下列的說明,檢查Android Studio為應用程式加入的內容:
13-2 啟動地圖元件建立好的地圖元件,可以使用一般的方式啟動它。開啟「ItemActivity.java」,參考下列的內容,加入啟動地圖元件的程式碼: public void clickFunction(View view) { int id = view.getId(); switch (id) { ... case R.id.set_location: // 啟動地圖元件用的Intent物件 Intent intentMap = new Intent(this, MapsActivity.class); // 啟動地圖元件 startActivityForResult(intentMap, START_LOCATION); break; ... } } 完成上面的程式碼,連接實體裝置到電腦,執行應用程式後選擇安裝到實體裝置。在應用程式的主畫面選擇任何一個記事資料,選擇位置按鈕元件: 應用程式啟動地圖元件以後,如果出現下列的畫面,表示地圖元件可以正確的運作: 13-3 管理與新增Google Maps API Key每一個使用地圖元件的應用程式,都需要依照上列的方式建立Google Maps API Key,地圖才可以正確下載與顯示。如果開發其它使用地圖元件的應用程式,可以繼續使用同一個Google Maps API Key。參考下列的步驟,先瞭解執行設定的作法:
13-4 設定地圖顯示的位置目前地圖元件顯示的畫面是預設的位置,以記事應用程式來說,在啟動地圖元件以後,需要將位置移動到儲存的位置,或是根據裝置資訊顯示目前的位置。目前的記事資料還沒有儲存位置資訊,下一章就會說明讀取與儲存位置資訊的作法,現在先瞭解設定地圖顯示位置的作法。 開啟「MapsActivity.java」,加入提供移動地圖功能的方法: // 移動地圖到參數指定的位置 private void moveMap(LatLng place) { // 建立地圖攝影機的位置物件 CameraPosition cameraPosition = new CameraPosition.Builder() .target(place) .zoom(17) .build(); // 使用動畫的效果移動地圖 mMap.animateCamera(CameraUpdateFactory.newCameraPosition(cameraPosition)); } 同樣在「MapsActivity.java」,找到預設的「setUpMap」方法,參考下列的內容修改原有的程式碼: private void setUpMap() { // 刪除原來預設的內容 //mMap.addMarker(new MarkerOptions().position(new LatLng(0, 0)).title("Marker")); // 建立位置的座標物件 LatLng place = new LatLng(25.033408, 121.564099); // 移動地圖 moveMap(place); } 完成上面的程式碼,執行應用程式後選擇安裝到實體裝置。在應用程式的主畫面選擇任何一個記事資料,選擇位置按鈕元件。應用程式啟動地圖元件以後,地圖畫面就會移動到指定的位置: 13-5 新增地圖標記地圖元件可以依照應用程式的需求,在地圖指定的位置加入標記。在「com.google.android.gms.maps.model」套件提供下列的元件:
開啟「MapsActivity.java」,加入設定地圖標記的方法: // 在地圖加入指定位置與標題的標記 private void addMarker(LatLng place, String title, String snippet) { BitmapDescriptor icon = BitmapDescriptorFactory.fromResource(R.drawable.ic_launcher); MarkerOptions markerOptions = new MarkerOptions(); markerOptions.position(place) .title(title) .snippet(snippet) .icon(icon); mMap.addMarker(markerOptions); } 同樣在「MapsActivity.java」,找到「setUpMap」方法,參考下列的內容修改原有的程式碼: private void setUpMap() { // 刪除原來預設的內容 //mMap.addMarker(new MarkerOptions().position(new LatLng(0, 0)).title("Marker")); // 建立位置的座標物件 LatLng place = new LatLng(25.033408, 121.564099); // 移動地圖 moveMap(place); // 加入地圖標記 addMarker(place, "Hello!", " Google Maps v2!"); } 完成上面的程式碼,執行應用程式後選擇安裝到實體裝置。在應用程式的主畫面選擇任何一個記事資料,選擇位置按鈕元件。應用程式啟動地圖元件以後,地圖畫面在指定的位置顯示標記: 點選標記以後,標記上方就會顯示設定的說明: 完成這一章關於地圖的應用,下一章加入位置資訊的讀取與儲存以後,就可以在地圖元件顯示記事儲存的位置,或是根據裝置資訊顯示目前的位置。 課程相關的檔案都可以GitHub瀏覽與下載。 後續 >> Android Tutorial 第四堂(3)讀取裝置目前的位置 – Google Services Location |
a45639
09/19
老師你好!這是我寫的標記
mMap.addMarker(new MarkerOptions().title("北海道昆布鍋").position(new LatLng(23.476080, 120.450168)).anchor(0.0f, 0.0f)
但是標記上方顯示設定的中文說明是亂碼,求解決方法!!感謝