Maps API บน Wear OS

แผนที่ในอุปกรณ์ที่สวมใส่ได้

การใช้ Maps SDK สำหรับ Android ช่วยให้คุณสร้างแอปที่ใช้กับอุปกรณ์สวมใส่ที่อิงตามแผนที่ ซึ่งทำงานบนอุปกรณ์ Wear OS by Google ได้โดยตรง ผู้ใช้แอปของคุณ จะดูตำแหน่งของตนเองบนแผนที่ได้เพียงแค่เหลือบมองข้อมือ ผู้ใช้สามารถ วางตำแหน่งของตนเองบนเส้นทางได้ เช่น จากนั้นซูมเข้าเพื่อดูรายละเอียด หรือแตะ เครื่องหมายเพื่อดูหน้าต่างข้อมูลที่แอปของคุณระบุ

หน้านี้อธิบายฟังก์ชันการทำงานของ API ที่พร้อมใช้งานในอุปกรณ์ Wear และช่วยให้คุณเริ่มต้นสร้างแอปได้

เริ่มต้นใช้งานใน Wear OS

การสร้างแอปที่ใช้กับอุปกรณ์สวมใส่ด้วย Maps SDK สำหรับ Android นั้นโดยพื้นฐานแล้วจะเหมือนกับการสร้างแอป Google Maps สำหรับอุปกรณ์ Android อื่นๆ ความแตกต่าง อยู่ที่การออกแบบสำหรับรูปแบบขนาดเล็กของอุปกรณ์ที่สวมใส่ได้ เพื่อ เพิ่มประสิทธิภาพการใช้งานและประสิทธิภาพของแอป

Android Studio เป็นเครื่องมือที่แนะนำสำหรับการพัฒนา Wear OS เนื่องจากมีฟีเจอร์ต่างๆ เช่น การตั้งค่าโปรเจ็กต์ การรวมไลบรารี และการจัดแพ็กเกจ

หากต้องการความช่วยเหลือทั่วไปเกี่ยวกับการออกแบบแอปที่ใช้กับอุปกรณ์สวมใส่ โปรดดูหลักเกณฑ์การออกแบบ Wear OS หากต้องการความช่วยเหลือในการสร้างแอปสำหรับอุปกรณ์สวมใส่แอปแรก โปรดดูคำแนะนำในการสร้างแอปสำหรับอุปกรณ์สวมใส่

สร้างแอปแผนที่แอปแรกใน Wear OS

คำแนะนำฉบับย่อนี้ถือว่าคุณคุ้นเคยกับ Maps SDK สำหรับ Android และได้ทำตามคำแนะนำของ Wear OS เพื่อสร้างโมดูลอุปกรณ์ที่สวมใส่ได้ใน แอปของคุณแล้ว และตอนนี้คุณต้องการเพิ่มแผนที่ลงในโมดูลอุปกรณ์ที่สวมใส่ได้

การเพิ่มทรัพยากร Dependency สำหรับโมดูล Wear

ตรวจสอบว่ามีการรวมการอ้างอิงต่อไปนี้ไว้ในไฟล์ build.gradle.kts ของโมดูล Wear OS ของแอป

dependencies {
    // ...
    compileOnly("com.google.android.wearable:wearable:2.9.0")
    implementation("com.google.android.support:wearable:2.9.0")
    implementation("com.google.android.gms:play-services-maps:19.0.0")

    // This dependency is necessary for ambient mode
    implementation("androidx.wear:wear:1.3.0")
}

ดูข้อมูลเพิ่มเติมเกี่ยวกับทรัพยากร Dependency ได้ที่คู่มือเพิ่มโมดูล Wear OS ในโปรเจ็กต์ที่มีอยู่

การใช้ท่าทางสัมผัสปัดเพื่อปิดและตั้งค่าสีพื้นหลังเริ่มต้น

เราขอแนะนำให้ใช้ SwipeDismissFrameLayout เพื่อแสดงแผนที่บน อุปกรณ์ที่สวมใส่ได้ การใช้คลาส SwipeDismissFrameLayout จะช่วยให้คุณ ใช้ท่าทางสัมผัสปัดเพื่อปิดได้ ซึ่งจะช่วยให้ผู้ใช้ ออกจากแอปได้โดยการปัดจากขอบซ้ายสุดของหน้าจอ

หากต้องการตั้งค่าสีพื้นหลังเริ่มต้นที่กำหนดเอง ให้ใช้แอตทริบิวต์ map:backgroundColor XML เพื่อกำหนดสีที่จะแสดงจนกว่าแผนที่จริงจะโหลด

เพิ่มองค์ประกอบ SwipeDismissFrameLayout และ backgroundColor ลงในคำจำกัดความเลย์เอาต์เป็นคอนเทนเนอร์ของ SupportMapFragment ดังนี้

  <androidx.wear.widget.SwipeDismissFrameLayout
      android:id="@+id/map_container"
      android:layout_width="match_parent"
      android:layout_height="match_parent">
    <fragment
        android:id="@+id/map"
        android:name="com.google.android.gms.maps.SupportMapFragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        map:backgroundColor="#fff0b2dd" />
  </androidx.wear.widget.SwipeDismissFrameLayout>

เมื่อได้รับออบเจ็กต์ SwipeDismissFrameLayout ในกิจกรรม ให้เพิ่ม การเรียกกลับและตั้งค่าลักษณะการทำงานของการเรียกกลับเพื่อดำเนินการปิด ที่จำเป็นตามที่แสดงด้านล่าง

Kotlin

class MainActivity : AppCompatActivity(), OnMapReadyCallback,
                     AmbientModeSupport.AmbientCallbackProvider {


    public override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        // Set the layout. It only contains a SupportMapFragment and a DismissOverlay.
        setContentView(R.layout.activity_main)

        // Enable ambient support, so the map remains visible in simplified, low-color display
        // when the user is no longer actively using the app but the app is still visible on the
        // watch face.
        val controller = AmbientModeSupport.attach(this)
        Log.d(MainActivity::class.java.simpleName, "Is ambient enabled: " + controller.isAmbient)

        // Retrieve the containers for the root of the layout and the map. Margins will need to be
        // set on them to account for the system window insets.
        val mapFrameLayout = findViewById<SwipeDismissFrameLayout>(R.id.map_container)
        mapFrameLayout.addCallback(object : SwipeDismissFrameLayout.Callback() {
            override fun onDismissed(layout: SwipeDismissFrameLayout) {
                onBackPressed()
            }
        })

        // Obtain the MapFragment and set the async listener to be notified when the map is ready.
        mapFragment = supportFragmentManager
            .findFragmentById(R.id.map) as SupportMapFragment
        mapFragment.getMapAsync(this)
    }

    // ...
}

      

Java

public class MainActivity extends AppCompatActivity implements OnMapReadyCallback,
    AmbientModeSupport.AmbientCallbackProvider {


    public void onCreate(Bundle savedState) {
        super.onCreate(savedState);

        // Set the layout. It only contains a SupportMapFragment and a DismissOverlay.
        setContentView(R.layout.activity_main);

        // Enable ambient support, so the map remains visible in simplified, low-color display
        // when the user is no longer actively using the app but the app is still visible on the
        // watch face.
        AmbientModeSupport.AmbientController controller = AmbientModeSupport.attach(this);
        Log.d(MainActivity.class.getSimpleName(), "Is ambient enabled: " + controller.isAmbient());

        // Retrieve the containers for the root of the layout and the map. Margins will need to be
        // set on them to account for the system window insets.
        final SwipeDismissFrameLayout mapFrameLayout = (SwipeDismissFrameLayout) findViewById(
            R.id.map_container);
        mapFrameLayout.addCallback(new SwipeDismissFrameLayout.Callback() {
            @Override
            public void onDismissed(SwipeDismissFrameLayout layout) {
                onBackPressed();
            }
        });

        // Obtain the MapFragment and set the async listener to be notified when the map is ready.
        mapFragment = (SupportMapFragment) getSupportFragmentManager()
            .findFragmentById(R.id.map);
        mapFragment.getMapAsync(this);
    }

    // ...
}

      

การเพิ่มแผนที่

ใช้วิธีเรียกกลับ onMapReady(GoogleMap) ตามปกติ เพื่อรับแฮนเดิลไปยังออบเจ็กต์ GoogleMap ระบบจะทริกเกอร์การเรียกกลับเมื่อแผนที่พร้อมใช้งาน ในเมธอดเรียกกลับ คุณสามารถ เพิ่มเครื่องหมายหรือเส้นหลายเส้นลงในแผนที่ เพิ่ม Listener หรือย้ายกล้องได้ ตัวอย่างด้านล่างจะเพิ่มเครื่องหมายใกล้กับโรงอุปรากรซิดนีย์

Kotlin

private val sydney = LatLng(-33.85704, 151.21522)

override fun onMapReady(googleMap: GoogleMap) {
    // Add a marker with a title that is shown in its info window.
    googleMap.addMarker(
        MarkerOptions().position(sydney)
            .title("Sydney Opera House")
    )

    // Move the camera to show the marker.
    googleMap.moveCamera(CameraUpdateFactory.newLatLngZoom(sydney, 10f))
}

      

Java

private static final LatLng SYDNEY = new LatLng(-33.85704, 151.21522);

@Override
public void onMapReady(@NonNull GoogleMap googleMap) {
    // Add a marker with a title that is shown in its info window.
    googleMap.addMarker(new MarkerOptions().position(SYDNEY)
        .title("Sydney Opera House"));

    // Move the camera to show the marker.
    googleMap.moveCamera(CameraUpdateFactory.newLatLngZoom(SYDNEY, 10));
}

      

การเปิดใช้โหมดแอมเบียนท์

Maps SDK สำหรับ Android รองรับโหมดแอมเบียนท์สำหรับแอปบนอุปกรณ์ที่สวมใส่ได้ บางครั้งเราเรียกแอปที่รองรับโหมดแอมเบียนท์ว่าแอปเปิดตลอดเวลา โหมดแอมเบียนท์จะเปิดใช้งานเมื่อผู้ใช้ไม่ได้ใช้แอปอย่างต่อเนื่องอีกต่อไป และช่วยให้แอปยังคงแสดงบนอุปกรณ์ที่สวมใส่ได้

Maps SDK สำหรับ Android มีการแสดงผลแผนที่แบบสีน้อยที่เรียบง่าย สำหรับใช้ในโหมดแอมเบียนท์ และรูปแบบแผนที่จะปรับโดยอัตโนมัติเมื่อ อุปกรณ์เปลี่ยนจากโหมดอินเทอร์แอกทีฟเป็นโหมดแอมเบียนท์ เครื่องหมาย ออบเจ็กต์ และการควบคุม UI ทั้งหมดจะหายไปในโหมดแอมเบียนท์ ซึ่งจะช่วยลดการใช้พลังงานของแอปและทำให้รูปลักษณ์สอดคล้องกับแอปแอมเบียนต์อื่นๆ เช่น หน้าปัดนาฬิกา

ทำตามขั้นตอนต่อไปนี้เพื่อให้แน่ใจว่าแอปใช้โหมดแอมเบียนท์ของแผนที่

  1. อัปเดต Android SDK ให้มีแพลตฟอร์ม Android 6.0 (API 23) ขึ้นไป ซึ่งมี API ที่อนุญาตให้กิจกรรมเข้าสู่โหมดแอมเบียนท์ ดูข้อมูลเกี่ยวกับวิธีอัปเดต SDK ได้ในเอกสารประกอบ Android เกี่ยวกับการเพิ่มแพ็กเกจ SDK
  2. ตรวจสอบว่าโปรเจ็กต์กำหนดเป้าหมายเป็น Android 6.0 ขึ้นไปโดยตั้งค่า targetSdkVersionเป็น 23 ขึ้นไปในไฟล์ Manifest ของแอป
  3. เพิ่มการอ้างอิงของอุปกรณ์ที่สวมใส่ได้ลงในไฟล์ build.gradle.kts ของแอป ดูตัวอย่างในหน้านี้
  4. เพิ่มรายการไลบรารีที่ใช้ร่วมกันของอุปกรณ์ที่สวมใส่ได้ลงในไฟล์ Manifest ของแอปอุปกรณ์ที่สวมใส่ได้ตามที่อธิบายไว้ในคลาสการฝึกอบรม Android เกี่ยวกับการทำให้แอปของคุณมองเห็นได้
  5. เพิ่มWAKE_LOCKลงในไฟล์ Manifest ของแอปแบบพกพาและแอปที่สวมใส่ได้ ตามที่อธิบายไว้ในคลาสการฝึกอบรม Android เกี่ยวกับ การทำให้แอปของคุณมองเห็นได้
  6. ในonCreate()เมธอดของกิจกรรม ให้เรียกใช้เมธอด AmbientModeSupport.attach() ซึ่งจะบอกระบบปฏิบัติการว่าแอปพลิเคชันเปิดอยู่เสมอ ดังนั้นเมื่ออุปกรณ์ปิดเครื่อง แอปควรเข้าสู่โหมดแอมเบียนท์แทนที่จะกลับไปที่หน้าปัดนาฬิกา
  7. ใช้AmbientModeSupport.AmbientCallbackProviderอินเทอร์เฟซใน กิจกรรมเพื่อให้รับการเปลี่ยนแปลงสถานะโหมดแอมเบียนท์ได้
  8. ตั้งค่าแผนที่ให้รองรับโหมดแอมเบียนท์ คุณทำได้โดยการตั้งค่าแอตทริบิวต์ map:ambientEnabled="true" ในไฟล์เลย์เอาต์ XML ของกิจกรรม หรือทำ แบบเป็นโปรแกรมโดยการตั้งค่า GoogleMapOptions.ambientEnabled(true) การตั้งค่านี้จะแจ้งให้ API ทราบว่าต้องโหลดแผนที่ที่จำเป็นล่วงหน้าเพื่อ ใช้ในโหมดแอมเบียนท์
  9. เมื่อกิจกรรมเปลี่ยนเป็นโหมดแอมเบียนท์ ระบบจะเรียกใช้เมธอด onEnterAmbient() ใน AmbientCallback ที่คุณระบุ ลบล้าง onEnterAmbient() แล้วโทรหา SupportMapFragment.onEnterAmbient(ambientDetails) หรือ MapView.onEnterAmbient(ambientDetails) API จะเปลี่ยนไปใช้การแสดงแผนที่แบบ ไม่โต้ตอบและมีสีน้อย
  10. ในทำนองเดียวกัน ในการโทร onExitAmbient() SupportMapFragment.onExitAmbient() หรือ MapView.onExitAmbient() API จะเปลี่ยนไปใช้การแสดงผลแผนที่ตามปกติ

โค้ดตัวอย่างต่อไปนี้จะเปิดใช้โหมดแอมเบียนท์ในกิจกรรม

Kotlin

class AmbientActivity : AppCompatActivity(), AmbientModeSupport.AmbientCallbackProvider {

    private lateinit var mapFragment: SupportMapFragment

    public override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        // Set the layout. It only contains a SupportMapFragment and a DismissOverlay.
        setContentView(R.layout.activity_main)

        // Enable ambient support, so the map remains visible in simplified, low-color display
        // when the user is no longer actively using the app but the app is still visible on the
        // watch face.
        val controller = AmbientModeSupport.attach(this)
        Log.d(AmbientActivity::class.java.simpleName, "Is ambient enabled: " + controller.isAmbient)

        // Obtain the MapFragment and set the async listener to be notified when the map is ready.
        mapFragment = supportFragmentManager
            .findFragmentById(R.id.map) as SupportMapFragment
    }

    override fun getAmbientCallback(): AmbientModeSupport.AmbientCallback {
        return object : AmbientModeSupport.AmbientCallback() {
            /**
             * Starts ambient mode on the map.
             * The API swaps to a non-interactive and low-color rendering of the map when the user is no
             * longer actively using the app.
             */
            override fun onEnterAmbient(ambientDetails: Bundle) {
                super.onEnterAmbient(ambientDetails)
                mapFragment.onEnterAmbient(ambientDetails)
            }

            /**
             * Exits ambient mode on the map.
             * The API swaps to the normal rendering of the map when the user starts actively using the app.
             */
            override fun onExitAmbient() {
                super.onExitAmbient()
                mapFragment.onExitAmbient()
            }
        }
    }
}

      

Java

public class AmbientActivity extends AppCompatActivity implements
    AmbientModeSupport.AmbientCallbackProvider {

    private SupportMapFragment mapFragment;

    public void onCreate(Bundle savedState) {
        super.onCreate(savedState);

        // Set the layout. It only contains a SupportMapFragment and a DismissOverlay.
        setContentView(R.layout.activity_main);

        // Enable ambient support, so the map remains visible in simplified, low-color display
        // when the user is no longer actively using the app but the app is still visible on the
        // watch face.
        AmbientModeSupport.AmbientController controller = AmbientModeSupport.attach(this);
        Log.d(AmbientActivity.class.getSimpleName(), "Is ambient enabled: " + controller.isAmbient());

        // Obtain the MapFragment and set the async listener to be notified when the map is ready.
        mapFragment = (SupportMapFragment) getSupportFragmentManager()
            .findFragmentById(R.id.map);
    }

    @Override
    public AmbientCallback getAmbientCallback() {
        return new AmbientCallback() {
            /**
             * Starts ambient mode on the map.
             * The API swaps to a non-interactive and low-color rendering of the map when the user is no
             * longer actively using the app.
             */
            @Override
            public void onEnterAmbient(Bundle ambientDetails) {
                super.onEnterAmbient(ambientDetails);
                mapFragment.onEnterAmbient(ambientDetails);
            }

            /**
             * Exits ambient mode on the map.
             * The API swaps to the normal rendering of the map when the user starts actively using the app.
             */
            @Override
            public void onExitAmbient() {
                super.onExitAmbient();
                mapFragment.onExitAmbient();
            }
        };
    }
}

      

คุณอัปเดตหน้าจอได้ขณะที่แอปอยู่ในโหมดแอมเบียนท์ ดูรายละเอียดเพิ่มเติม เกี่ยวกับการอัปเดตเนื้อหาและโหมดแอมเบียนท์โดยทั่วไปได้ในคลาสการฝึกอบรม Android เกี่ยวกับการทำให้แอปมองเห็นได้

การใช้ Street View ใน Wear OS

Street View รองรับอุปกรณ์ที่สวมใส่ได้อย่างเต็มที่

หากต้องการอนุญาตให้ผู้ใช้ออกจากแอปเมื่อดูภาพพาโนรามา Street View ให้ใช้อินเทอร์เฟซ StreetViewPanorama.OnStreetViewPanoramaLongClickListener เพื่อฟังท่าทางสัมผัสแบบแตะค้าง เมื่อผู้ใช้แตะค้างที่ใดที่หนึ่ง ในภาพ Street View คุณจะได้รับonStreetViewPanoramaLongClick(StreetViewPanoramaOrientation)เหตุการณ์ โทร DismissOverlayView.show() เพื่อแสดงปุ่มออก

โค้ดตัวอย่าง

แอปตัวอย่างพร้อมให้ใช้งานใน GitHub ซึ่งคุณสามารถใช้เป็น จุดเริ่มต้นสำหรับแอปของคุณได้ ตัวอย่างจะแสดงวิธีตั้งค่า Google Maps พื้นฐานบน Wear OS

ฟังก์ชันที่รองรับใน Maps API บน Wear OS

ส่วนนี้จะอธิบายความแตกต่างของฟังก์ชันที่รองรับสำหรับแผนที่ในอุปกรณ์ที่สวมใส่ได้เมื่อเทียบกับอุปกรณ์มือถือ (โทรศัพท์และแท็บเล็ต) ฟีเจอร์ API ทั้งหมดที่ไม่ได้กล่าวถึงด้านล่างควรทำงานตามที่ระบุไว้ในเอกสารสำหรับ API แบบเต็ม

ฟังก์ชันการทำงาน
โหมดอินเทอร์แอกทีฟเต็มรูปแบบและโหมด Lite

คุณใช้ Maps SDK สำหรับ Android ในโหมดแบบอินเทอร์แอกทีฟเต็มรูปแบบหรือ ในโหมด Lite ได้ พิจารณาใช้โหมด Lite หากต้องการเพิ่มประสิทธิภาพใน อุปกรณ์ที่สวมใส่ได้ และแอปของคุณไม่จำเป็นต้องรองรับ การโต้ตอบ เช่น ท่าทางสัมผัส หรือการเลื่อนและซูมแผนที่

ในโหมด Lite ความตั้งใจที่จะเริ่มแอป Google Maps บนอุปกรณ์เคลื่อนที่เมื่อผู้ใช้แตะแผนที่จะปิดใช้และเปิดใช้ในอุปกรณ์ที่สวมใส่ไม่ได้

ดูรายการความแตกต่างทั้งหมดระหว่างโหมด Lite กับโหมด โต้ตอบเต็มรูปแบบได้ในเอกสารประกอบของโหมด Lite

แถบเครื่องมือแผนที่ แถบเครื่องมือ แผนที่ปิดใช้และเปิดใช้ใน อุปกรณ์ที่สวมใส่ไม่ได้
การควบคุม UI ระบบจะปิดใช้การควบคุม UI โดยค่าเริ่มต้นในอุปกรณ์ที่สวมใส่ได้ ซึ่งรวมถึง การควบคุมการซูม เข็มทิศ และตำแหน่งของฉัน คุณเปิดใช้ได้โดยใช้คลาส UiSettings ตามปกติ
ท่าทางสัมผัส ท่าทางสัมผัสแบบแตะครั้งเดียว ทำงานได้ตามที่คาดไว้ ตัวอย่างเช่น แตะแล้วลากเพื่อเลื่อนแผนที่ แตะสองครั้ง เพื่อซูมเข้า และแตะด้วย 2 นิ้วเพื่อซูมออก การรองรับท่าทางสัมผัสแบบมัลติทัชจะแตกต่างกันไปตามอุปกรณ์ของผู้ใช้ ตัวอย่างท่าทางสัมผัสแบบมัลติทัช ได้แก่ การใช้ 2 นิ้วดันเพื่อเอียงแผนที่ การบีบเพื่อซูม และการหมุนด้วย 2 นิ้ว
แผนที่ในอาคารและอาคาร แผนที่ในอาคารจะ ปิดใช้โดยค่าเริ่มต้นในอุปกรณ์ที่สวมใส่ได้ คุณเปิดใช้ได้โดยโทรไปที่ GoogleMap.setIndoorEnabled(true) หากเปิดใช้แผนที่ในอาคาร แผนที่จะแสดงระดับพื้นเริ่มต้น อุปกรณ์ที่สวมใส่ไม่ได้รองรับองค์ประกอบ UI ของเครื่องมือเลือก ระดับ
การวางซ้อนของชิ้นส่วนแผนที่ การซ้อนทับไทล์ ไม่รองรับในอุปกรณ์ที่สวมใส่ได้

แนวทางปฏิบัติแนะนำสำหรับการพัฒนาด้วย Maps API บน Wear OS

วิธีมอบประสบการณ์การใช้งานที่ดีที่สุดในแอป

  • แผนที่ควรใช้พื้นที่ส่วนใหญ่ของหน้าจอ ซึ่งจำเป็นต่อการเพิ่มประสิทธิภาพการใช้งานแผนที่ในอุปกรณ์แบบพกพาขนาดเล็ก
  • เมื่อออกแบบประสบการณ์ของผู้ใช้ในแอป ให้คำนึงถึงข้อเท็จจริงที่ว่าอุปกรณ์ที่สวมใส่ได้มีกำลังแบตเตอรี่ต่ำ การเปิดหน้าจอไว้และ การแสดงแผนที่จะส่งผลต่อประสิทธิภาพของแบตเตอรี่