หัวข้อนี้อธิบายวิธีเพิ่มแผนที่พื้นฐานลงในแอป Android หลังจากที่คุณกําหนดค่าโปรเจ็กต์ให้ใช้ Maps SDK สําหรับ Android แล้ว หลังจากเพิ่มแผนที่แล้ว คุณจะเปลี่ยนประเภทแผนที่และฟีเจอร์ได้
ภาพรวม
Maps SDK สำหรับ Android มีคลาสหลายคลาสที่แอปของคุณสามารถใช้เพื่อจัดการวงจร ฟังก์ชันการทำงาน และข้อมูลของแผนที่ คลาสเหล่านี้รองรับการโต้ตอบของผู้ใช้ตามรูปแบบ UI ของ Android เช่น การตั้งค่าสถานะเริ่มต้นของแผนที่ และการตอบสนองต่ออินพุตด้วยท่าทางสัมผัสจากผู้ใช้ขณะรันไทม์
อินเทอร์เฟซและคลาสหลักสำหรับการจัดการแผนที่
GoogleMap
— จุดแรกเข้าสำหรับจัดการองค์ประกอบและข้อมูลแผนที่พื้นฐาน แอปของคุณจะเข้าถึงออบเจ็กต์GoogleMap
ได้หลังจากที่ดึงข้อมูลจากออบเจ็กต์SupportMapFragment
หรือMapView
เท่านั้นSupportMapFragment
— Framgnet สำหรับการจัดการวงจรของออบเจ็กต์GoogleMap
OnMapReadyCallback
— อินเทอร์เฟซการเรียกกลับที่จัดการเหตุการณ์และการโต้ตอบของผู้ใช้สําหรับออบเจ็กต์GoogleMap
ออบเจ็กต์ GoogleMap
จะดําเนินการต่อไปนี้โดยอัตโนมัติ
- การเชื่อมต่อกับบริการ Google Maps
- กำลังดาวน์โหลดชิ้นส่วนแผนที่
- การแสดงการ์ดบนหน้าจออุปกรณ์
- การแสดงตัวควบคุมต่างๆ เช่น การเลื่อนและซูม
- ตอบสนองต่อท่าทางสัมผัสในการเลื่อนและซูมโดยเลื่อนแผนที่และซูมเข้าหรือออก
หากต้องการใช้ออบเจ็กต์ GoogleMap
ในแอป คุณต้องออบเจ็กต์ SupportMapFragment
หรือ MapView
เป็นแออบเจ็กต์คอนเทนเนอร์สําหรับแผนที่ แล้วดึงออบเจ็กต์ GoogleMap
ออกจากคอนเทนเนอร์ เนื่องจากคลาสคอนเทนเนอร์มาจาก Fragment หรือ View ของ 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")); } }
วิธีเพิ่มแผนที่
ส่วนนี้จะอธิบายวิธีเพิ่มแผนที่พื้นฐานโดยใช้ข้อมูลโค้ดเป็นคอนเทนเนอร์แผนที่ แต่คุณใช้มุมมองแทนได้ ดูตัวอย่างได้ที่ RawMapViewDemoActivity ใน GitHub
ขั้นตอนพื้นฐาน
หากต้องการรับ SDK, รับคีย์ API และเพิ่มเฟรมเวิร์กที่จำเป็น ให้ทำตามขั้นตอนในหัวข้อต่อไปนี้
เพิ่มออบเจ็กต์
SupportMapFragment
ลงในกิจกรรมที่จะจัดการแผนที่ คุณสามารถเพิ่มข้อมูลโค้ดแบบคงที่หรือแบบไดนามิกก็ได้ใช้อินเทอร์เฟซ
OnMapReadyCallback
ตั้งค่าไฟล์เลย์เอาต์เป็นมุมมองเนื้อหา
หากคุณเพิ่มข้อมูลโค้ดแบบคงที่ ให้รับแฮนเดิลของข้อมูลโค้ด
ลงทะเบียนการโทรกลับ
รับตัวแฮนเดิลของออบเจ็กต์
GoogleMap
เพิ่มออบเจ็กต์ SupportMapFragment
คุณเพิ่มออบเจ็กต์ SupportMapFragment
ลงในแอปแบบคงที่หรือแบบไดนามิกได้
วิธีที่ง่ายที่สุดคือการเพิ่มแบบคงที่ หากเพิ่มข้อมูลโค้ดแบบไดนามิก คุณจะดําเนินการเพิ่มเติมกับข้อมูลโค้ดได้ เช่น นําออกและแทนที่ข้อมูลโค้ดขณะรันไทม์
วิธีเพิ่มข้อมูลโค้ดแบบคงที่
ในไฟล์เลย์เอาต์ของกิจกรรมที่จะจัดการแผนที่ ให้ทำดังนี้
- เพิ่มองค์ประกอบ
fragment
- เพิ่มประกาศชื่อ
xmlns:map="http://schemas.android.com/apk/res-auto"
ซึ่งจะช่วยให้ใช้maps
แอตทริบิวต์ XML ที่กําหนดเองได้ - ในองค์ประกอบ
fragment
ให้ตั้งค่าแอตทริบิวต์android:name
เป็นcom.google.android.gms.maps.SupportMapFragment
- ในองค์ประกอบ
fragment
ให้เพิ่มแอตทริบิวต์android:id
และตั้งค่าเป็น รหัสทรัพยากร (@+id/map
) ของ R.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); }
รับแฮนเดิลของข้อมูลโค้ดและลงทะเบียนการเรียกกลับ
หากต้องการรับแฮนเดิลของข้อมูลโค้ด ให้เรียกใช้เมธอด
FragmentManager.findFragmentById
แล้วส่งรหัสทรัพยากรของข้อมูลโค้ดในไฟล์เลย์เอาต์ หากคุณเพิ่มข้อมูลโค้ดแบบไดนามิก ให้ข้ามขั้นตอนนี้เนื่องจากคุณได้ดึงข้อมูลแฮนเดิลแล้วเรียกใช้เมธอด
getMapAsync
เพื่อตั้งค่าการเรียกกลับในฟragment
เช่น หากคุณเพิ่มข้อมูลโค้ดแบบคงที่ ให้ทำดังนี้
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
การเรียกกลับจะทริกเกอร์เมื่อแผนที่พร้อมรับการป้อนข้อมูลของผู้ใช้ ซึ่งจะแสดงอินสแตนซ์ที่ไม่ใช่ค่า Null ของคลาส 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")); }
เมื่อสร้างและเรียกใช้แอปเรียบร้อยแล้ว แอปจะแสดงแผนที่ที่มีเครื่องหมายบนเกาะ Null (ละติจูด 0 องศาและลองจิจูด 0 องศา)
ดูโค้ดของกิจกรรมที่สมบูรณ์
ขั้นตอนถัดไป
หลังจากทำตามขั้นตอนเหล่านี้เสร็จแล้ว คุณจะกำหนดการตั้งค่าแผนที่ได้