Maps API บน Wear OS

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

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

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

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

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

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

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

การสร้างแอปแผนที่แอปแรกของคุณบน Wear OS

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

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

ตรวจสอบว่าทรัพยากร Dependency ต่อไปนี้รวมอยู่ในไฟล์ build.gradle ของโมดูล 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:18.2.0'

    // This dependency is necessary for ambient mode
    implementation 'androidx.wear:wear:1.3.0'
}

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

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

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

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

เพิ่มองค์ประกอบ 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(savedState: Bundle?) {
        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.
        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. เพิ่มทรัพยากร Dependency ที่สวมใส่ได้ลงในไฟล์ build.gradle ของแอป ดูตัวอย่างในหน้านี้
  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(savedState: Bundle?) {
        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.
        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

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

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