หัวข้อนี้จะอธิบายวิธีเพิ่มแผนที่พื้นฐานลงในแอป Android หลังจากที่คุณ กำหนดค่าโครงการให้ใช้ Maps SDK สำหรับ Android หลัง การเพิ่มแผนที่ คุณสามารถเปลี่ยนประเภทและคุณลักษณะของแผนที่ได้
ภาพรวม
Maps SDK สำหรับ Android มีคลาสต่างๆ ที่แอปของคุณสามารถใช้เพื่อ จัดการอายุการใช้งาน ฟังก์ชันการทำงาน และข้อมูลของแผนที่ ชั้นเรียนรองรับผู้ใช้ การโต้ตอบตามโมเดล UI ของ Android เช่น การตั้งค่าสถานะเริ่มต้นของ แผนที่ และตอบสนองต่อการป้อนข้อมูลด้วยท่าทางสัมผัสจากผู้ใช้ในระหว่างรันไทม์
อินเทอร์เฟซหลักและคลาสสำหรับการจัดการแผนที่มีดังนี้
GoogleMap
— จุดแรกเข้าสำหรับการจัดการแผนที่พื้นฐาน ฟีเจอร์และข้อมูล แอปของคุณจะเข้าถึงออบเจ็กต์GoogleMap
ได้หลังจากที่มี ถูกดึงข้อมูลจากออบเจ็กต์SupportMapFragment
หรือMapView
SupportMapFragment
— ส่วนย่อยสำหรับ จัดการวงจรของออบเจ็กต์GoogleMap
MapView
— ข้อมูลพร็อพเพอร์ตี้สำหรับจัดการวงจรGoogleMap
ออบเจ็กต์OnMapReadyCallback
— อินเทอร์เฟซ Callback ที่ จัดการเหตุการณ์และการโต้ตอบของผู้ใช้สำหรับออบเจ็กต์GoogleMap
ออบเจ็กต์ GoogleMap
จะดำเนินการต่อไปนี้โดยอัตโนมัติ
- กำลังเชื่อมต่อกับบริการ Google Maps
- กำลังดาวน์โหลดชิ้นส่วนแผนที่
- กำลังแสดงการ์ดบนหน้าจออุปกรณ์
- กำลังแสดงการควบคุมต่างๆ เช่น เลื่อนและซูม
- การตอบสนองต่อท่าทางสัมผัสการแพนและซูมโดยการเลื่อนแผนที่และการซูมออก
หากต้องการใช้ออบเจ็กต์ GoogleMap
ในแอป คุณต้องใช้
SupportMapFragment
หรือ MapView
เป็นออบเจ็กต์คอนเทนเนอร์สำหรับแผนที่ และ
จากนั้นเรียกออบเจ็กต์ GoogleMap
จากคอนเทนเนอร์ เนื่องจากคอนเทนเนอร์
ที่มาจากส่วนย่อยหรือมุมมองของ Android จะมีแผนที่ให้
ด้วยการจัดการอายุการใช้งานและความสามารถของ UI ของคลาสพื้นฐาน Android
คลาส SupportMapFragment
เป็นคอนเทนเนอร์ที่ทันสมัยและมีการใช้งานทั่วสำหรับ
GoogleMap
ออบเจ็กต์
ดูโค้ด
โค้ดต่อไปนี้มาจากกิจกรรม Java เต็มรูปแบบที่ใช้ในหัวข้อนี้เมื่อเพิ่ม ส่วนย่อยแบบคงที่ โปรเจ็กต์ Android สร้างขึ้นจากโปรเจ็กต์ที่ว่างเปล่า จากนั้นจะอัปเดตตามคู่มือการกำหนดค่าโปรเจ็กต์ หลังจากทำตามขั้นตอนในหัวข้อนี้แล้ว โค้ดของคุณอาจแตกต่างกันไป เทมเพลตโปรเจ็กต์
package com.example.mapsetup; import androidx.appcompat.app.AppCompatActivity; import android.os.Bundle; import com.google.android.gms.maps.GoogleMap; import com.google.android.gms.maps.OnMapReadyCallback; import com.google.android.gms.maps.SupportMapFragment; import com.google.android.gms.maps.model.LatLng; import com.google.android.gms.maps.model.MarkerOptions; // Implement OnMapReadyCallback. public class MainActivity extends AppCompatActivity implements OnMapReadyCallback { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); // Set the layout file as the content view. setContentView(R.layout.activity_main); // Get a handle to the fragment and register the callback. SupportMapFragment mapFragment = (SupportMapFragment) getSupportFragmentManager() .findFragmentById(R.id.map); mapFragment.getMapAsync(this); } // Get a handle to the GoogleMap object and display marker. @Override public void onMapReady(GoogleMap googleMap) { googleMap.addMarker(new MarkerOptions() .position(new LatLng(0, 0)) .title("Marker")); } }
ในการเพิ่มแผนที่
หัวข้อนี้จะอธิบายวิธีเพิ่มแผนที่พื้นฐานโดยใช้ส่วนย่อยเป็นแผนที่ container; อย่างไรก็ตาม คุณสามารถใช้มุมมองแทนได้ ดูตัวอย่างได้ที่ RawMapViewDemoActivity ใน GitHub
ขั้นตอนพื้นฐานมีดังนี้
หากต้องการรับ SDK ให้รับคีย์ API และเพิ่มเฟรมเวิร์กที่จำเป็น ให้ทำตามขั้นตอนใน
เพิ่มวัตถุ
SupportMapFragment
ในกิจกรรมที่จะจัดการแผนที่ คุณจะเพิ่มส่วนย่อยแบบคงที่หรือแบบไดนามิกได้ใช้อินเทอร์เฟซ
OnMapReadyCallback
ตั้งค่าไฟล์เลย์เอาต์เป็นมุมมองเนื้อหา
หากเพิ่มส่วนย่อยแบบคงที่ ให้รับแฮนเดิลลงในส่วนย่อยนั้น
ลงทะเบียนการติดต่อกลับ
รับแฮนเดิลของออบเจ็กต์
GoogleMap
เพิ่มออบเจ็กต์ SupportMapFragment
คุณเพิ่มออบเจ็กต์ SupportMapFragment
ลงในแอปแบบคงที่หรือแบบไดนามิกได้
วิธีที่ง่ายที่สุดคือการเพิ่มแบบคงที่ หากคุณเพิ่มส่วนย่อยแบบไดนามิก
คุณสามารถดำเนินการเพิ่มเติมกับส่วนย่อยได้ เช่น ลบและ
และแทนที่ด้วยรันไทม์
วิธีเพิ่มส่วนย่อยแบบคงที่
ในไฟล์เลย์เอาต์ของกิจกรรมที่จะจัดการแผนที่ ให้ทำดังนี้
- เพิ่มองค์ประกอบ
fragment
- เพิ่มการประกาศชื่อ
xmlns:map="http://schemas.android.com/apk/res-auto"
ซึ่งช่วยให้สามารถใช้ แอตทริบิวต์ XML ที่กำหนดเองmaps
รายการ - ในองค์ประกอบ
fragment
ให้ตั้งค่าแอตทริบิวต์android:name
เป็นcom.google.android.gms.maps.SupportMapFragment
- ในองค์ประกอบ
fragment
ให้เพิ่มแอตทริบิวต์android:id
และตั้งค่าเป็น R.id.map รหัสทรัพยากร (@+id/map
).
ลองดูไฟล์เลย์เอาต์ที่สมบูรณ์ที่มีเอลิเมนต์ fragment
ดังนี้
<?xml version="1.0" encoding="utf-8"?>
<fragment xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:map="http://schemas.android.com/apk/res-auto"
android:name="com.google.android.gms.maps.SupportMapFragment"
android:id="@+id/map"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
วิธีเพิ่มส่วนย่อยแบบไดนามิก
ในกิจกรรม ให้ทำดังนี้
- สร้างอินสแตนซ์
SupportMapFragment
- คอมมิตธุรกรรมที่เพิ่มส่วนย่อยลงในกิจกรรม หากต้องการข้อมูลเพิ่มเติม ดู ธุรกรรมแบบแยกส่วน
เช่น
Kotlin
val mapFragment = SupportMapFragment.newInstance() supportFragmentManager .beginTransaction() .add(R.id.my_container, mapFragment) .commit()
Java
SupportMapFragment mapFragment = SupportMapFragment.newInstance(); getSupportFragmentManager() .beginTransaction() .add(R.id.my_container, mapFragment) .commit();
ใช้อินเทอร์เฟซ OnMapReadyCallback
อัปเดตการประกาศกิจกรรมดังนี้
Kotlin
class MainActivity : AppCompatActivity(), OnMapReadyCallback { // ... }
Java
class MainActivity extends AppCompatActivity implements OnMapReadyCallback { // ... }
ตั้งค่ามุมมองเนื้อหา
ในเมธอด onCreate
ของกิจกรรม ให้เรียกเมธอด
setContentView
และตั้งค่าไฟล์เลย์เอาต์เป็นมุมมองเนื้อหา
ตัวอย่างเช่น หากไฟล์เลย์เอาต์ชื่อ main.xml
Kotlin
override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(R.layout.main) }
Java
@Override protected void onCreate(@Nullable Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); }
รับแฮนเดิลสำหรับส่วนย่อยและลงทะเบียน Callback
ในการรับแฮนเดิลส่วนย่อย ให้เรียกเมธอด
FragmentManager.findFragmentById
และส่งต่อ รหัสทรัพยากรของส่วนย่อยในไฟล์เลย์เอาต์ หากคุณเพิ่มส่วนย่อย แบบไดนามิก ให้ข้ามขั้นตอนนี้เนื่องจากคุณได้เรียกข้อมูลแฮนเดิลแล้วเรียกใช้เมธอด
getMapAsync
เพื่อตั้งค่า Callback ใน ส่วนย่อย
เช่น หากคุณเพิ่มส่วนย่อยแบบคงที่ ให้ทำดังนี้
Kotlin
val mapFragment = supportFragmentManager .findFragmentById(R.id.map) as SupportMapFragment mapFragment.getMapAsync(this)
Java
SupportMapFragment mapFragment = (SupportMapFragment) getSupportFragmentManager() .findFragmentById(R.id.map); mapFragment.getMapAsync(this);
รับแฮนเดิลของออบเจ็กต์ GoogleMap
ใช้เมธอด Callback onMapReady
เพื่อรับแฮนเดิลของ
GoogleMap
ออบเจ็กต์ การเรียกกลับจะถูกเรียกใช้เมื่อแผนที่พร้อมที่จะรับ
ข้อมูลจากผู้ใช้ ซึ่งเป็นอินสแตนซ์ที่ไม่ใช่ค่าว่างของคลาส GoogleMap
ที่คุณ
สามารถใช้เพื่ออัปเดตแผนที่
ในตัวอย่างนี้ Callback onMapReady
จะดึงแฮนเดิลไปยัง GoogleMap
จากนั้นจะมีการเพิ่มเครื่องหมายลงในแผนที่
Kotlin
override fun onMapReady(googleMap: GoogleMap) { googleMap.addMarker( MarkerOptions() .position(LatLng(0.0, 0.0)) .title("Marker") ) }
Java
@Override public void onMapReady(GoogleMap googleMap) { googleMap.addMarker(new MarkerOptions() .position(new LatLng(0, 0)) .title("Marker")); }
เมื่อคุณสร้างและเรียกใช้แอปสำเร็จแล้ว แอปจะแสดงแผนที่ พร้อมเครื่องหมายบนเกาะนัล (ละติจูด 0 องศาและลองจิจูด 0 องศา)
ดูโค้ดของกิจกรรมทั้งหมด:
ขั้นตอนถัดไป
หลังจากทำตามขั้นตอนเหล่านี้แล้ว คุณจะทำสิ่งต่อไปนี้ได้ กำหนดการตั้งค่าแผนที่