1. ภาพรวม
ARCore เป็นแพลตฟอร์มสำหรับสร้างแอป Augmented Reality บนอุปกรณ์เคลื่อนที่ Cloud Anchors API ช่วยให้คุณสร้างแอป AR ที่ใช้กรอบอ้างอิงร่วมกันได้ ซึ่งช่วยให้ผู้ใช้หลายคนวางเนื้อหาเสมือนในตำแหน่งเดียวกันในโลกจริงได้
Codelab นี้จะแนะนําคุณเกี่ยวกับ Cloud Anchors API คุณจะใช้แอป ARCore ที่มีอยู่ แก้ไขให้ใช้ Cloud Anchor และสร้างประสบการณ์ AR ที่แชร์
Anchor ของ ARCore และ Cloud Anchor แบบถาวร
แนวคิดพื้นฐานใน ARCore คือAnchor ซึ่งอธิบายตำแหน่งคงที่ในโลกแห่งความจริง ARCore จะปรับค่าของท่าทางของ Anchor โดยอัตโนมัติเมื่อการติดตามการเคลื่อนไหวดีขึ้นเมื่อเวลาผ่านไป
Cloud Anchor คือ Anchor ที่โฮสต์ไว้ในระบบคลาวด์ ผู้ใช้หลายคนสามารถแก้ไขได้เพื่อสร้างกรอบอ้างอิงร่วมกันในหมู่ผู้ใช้และอุปกรณ์ของผู้ใช้
การโฮสต์ Anchor
เมื่อมีการโฮสต์พอดแคสต์ สิ่งที่จะเกิดขึ้นมีดังนี้
- ระบบจะอัปโหลดท่าทางของ Anchor ที่สัมพันธ์กับโลกไปยังระบบคลาวด์ และรับรหัส Cloud Anchor
รหัส Cloud Anchor คือสตริงที่ต้องส่งให้ทุกคนที่ต้องการแก้ไข Anchor นี้ - ระบบจะอัปโหลดชุดข้อมูลที่มีข้อมูลภาพสำหรับจุดยึดไปยังเซิร์ฟเวอร์ของ Google
ชุดข้อมูลนี้มีข้อมูลภาพที่อุปกรณ์เห็นล่าสุด การขยับอุปกรณ์เล็กน้อยเพื่อจับภาพพื้นที่รอบๆ จุดยึดจากมุมมองต่างๆ ก่อนที่จะโฮสต์จะช่วยให้การแปลเป็นภาษาท้องถิ่นดีขึ้น
การโอนรหัส Cloud Anchor
ในโค้ดแล็บนี้ คุณจะโอนรหัส Cloud Anchor โดยใช้ Firebase คุณแชร์รหัส Cloud Anchor โดยใช้วิธีอื่นได้
การแก้ไขลิงก์ Anchor
คุณสามารถใช้ Cloud Anchor API เพื่อแก้ไข Anchor โดยใช้รหัส Cloud Anchor การดำเนินการนี้จะสร้างสมอใหม่ในตำแหน่งจริงเดียวกันกับสมอที่โฮสต์เดิม ขณะแก้ไข อุปกรณ์ต้องดูสภาพแวดล้อมจริงเดียวกันกับที่แองเคอร์ที่โฮสต์เดิมอยู่
Cloud Anchor แบบถาวร
ก่อนเวอร์ชัน 1.20 คุณจะแก้ไข Cloud Anchor ได้เพียง 24 ชั่วโมงหลังจากที่โฮสต์ Persistent Cloud Anchors API ช่วยให้คุณสร้าง Cloud Anchor ที่แก้ไขได้เป็นเวลา 1-365 วันหลังจากสร้าง
สิ่งที่คุณจะสร้าง
ใน Codelab นี้ คุณจะได้สร้างแอป ARCore ที่มีอยู่แล้ว เมื่อสิ้นสุด Codelab แอปของคุณจะทำสิ่งต่อไปนี้ได้
- โฮสต์ Cloud Anchor แบบถาวรและรับรหัส Cloud Anchor ได้
- บันทึกรหัส Cloud Anchor ไว้ในอุปกรณ์เพื่อให้เรียกข้อมูลได้ง่ายโดยใช้ Android
SharedPreferences - ใช้รหัส Cloud Anchor ที่บันทึกไว้เพื่อแก้ไข Anchor ที่โฮสต์ไว้ก่อนหน้านี้ ซึ่งจะช่วยให้เราจำลองประสบการณ์การใช้งานแบบหลายผู้ใช้ด้วยอุปกรณ์เครื่องเดียวเพื่อวัตถุประสงค์ของโค้ดแล็บนี้ได้ง่าย
- แชร์รหัส Cloud Anchor กับอุปกรณ์อื่นที่เรียกใช้แอปเดียวกัน เพื่อให้ผู้ใช้หลายคนเห็นรูปปั้น Android ในตำแหน่งเดียวกัน
ระบบจะแสดงรูปปั้น Android ที่ตำแหน่งของ Cloud Anchor ดังนี้

สิ่งที่คุณจะได้เรียนรู้
- วิธีโฮสต์ Anchor โดยใช้ ARCore SDK และรับรหัส Cloud Anchor
- วิธีใช้รหัส Cloud Anchor เพื่อแก้ไข Anchor
- วิธีจัดเก็บและแชร์รหัส Cloud Anchor ระหว่างเซสชัน AR ต่างๆ ในอุปกรณ์เดียวกันหรือในอุปกรณ์ที่ต่างกัน
สิ่งที่คุณต้องมี
- อุปกรณ์ ARCore ที่รองรับซึ่งเชื่อมต่อผ่านสาย USB กับคอมพิวเตอร์สำหรับการพัฒนาซอฟต์แวร์
- บริการ Google Play สำหรับ AR เวอร์ชัน 1.22 ขึ้นไป
- เครื่องพัฒนาซอฟต์แวร์ที่มี Android Studio (v3.0 ขึ้นไป)
2. ตั้งค่าสภาพแวดล้อมในการพัฒนาซอฟต์แวร์
การตั้งค่าเครื่องสำหรับการพัฒนาซอฟต์แวร์
เชื่อมต่ออุปกรณ์ ARCore กับคอมพิวเตอร์ผ่านสาย USB ตรวจสอบว่าอุปกรณ์อนุญาตการแก้ไขข้อบกพร่องผ่าน USB
เปิดเทอร์มินัลแล้วเรียกใช้ adb devices ดังที่แสดงด้านล่าง
adb devices List of devices attached <DEVICE_SERIAL_NUMBER> device
<DEVICE_SERIAL_NUMBER> จะเป็นสตริงที่ไม่ซ้ำกันสำหรับอุปกรณ์ของคุณ โปรดตรวจสอบว่าคุณเห็นอุปกรณ์ 1 เครื่องเท่านั้นก่อนดำเนินการต่อ
การดาวน์โหลดและติดตั้งโค้ด
คุณจะโคลนที่เก็บได้โดยทำดังนี้
git clone https://github.com/googlecodelabs/arcore-cloud-anchors.git
หรือดาวน์โหลดไฟล์ ZIP แล้วแตกไฟล์โดยทำดังนี้
เปิด Android Studio คลิกเปิดโปรเจ็กต์ Android Studio ที่มีอยู่ จากนั้นไปที่ไดเรกทอรีที่คุณแตกไฟล์ ZIP ที่ดาวน์โหลดไว้ด้านบน แล้วดับเบิลคลิกไดเรกทอรี arcore-cloud-anchors
นี่คือโปรเจ็กต์ Gradle เดียวที่มีหลายโมดูล หากแผงโปรเจ็กต์ที่ด้านซ้ายบนของ Android Studio ยังไม่แสดงในแผงโปรเจ็กต์ ให้คลิกโปรเจ็กต์จากเมนูแบบเลื่อนลง ผลลัพธ์ควรมีลักษณะดังนี้

คุณจะทำงานในโมดูล work เป็นหลัก โมดูลอื่นๆ ได้แก่ โมดูล helpers ซึ่งมีชุดคลาส Wrapper ที่มีประโยชน์ซึ่งคุณจะใช้ นอกจากนี้ยังมีโซลูชันที่สมบูรณ์สำหรับแต่ละส่วนของ Codelab ยกเว้นโมดูล helpers แต่ละโมดูลเป็นแอปที่สร้างได้
หากเห็นกล่องโต้ตอบที่แนะนำให้อัปเกรดปลั๊กอิน Android Gradle ให้คลิกอย่าแจ้งเตือนฉันอีกสำหรับโปรเจ็กต์นี้

คลิกเรียกใช้ > เรียกใช้... > ‘งาน’ ในกล่องโต้ตอบเลือกเป้าหมายการติดตั้งใช้งานที่แสดง อุปกรณ์ของคุณควรแสดงอยู่ในส่วนอุปกรณ์ที่เชื่อมต่อ เลือกอุปกรณ์ แล้วคลิกตกลง Android Studio จะสร้างแอปเริ่มต้นและเรียกใช้ในอุปกรณ์
เมื่อคุณเรียกใช้แอปเป็นครั้งแรก แอปจะขอCAMERAสิทธิ์ แตะอนุญาตเพื่อดำเนินการต่อ

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

ปัจจุบันแอปนี้ใช้การติดตามการเคลื่อนไหวที่ ARCore จัดหาให้เพื่อติดตาม Anchor ในการเรียกใช้แอปครั้งเดียวเท่านั้น หากคุณตัดสินใจที่จะปิด ฆ่า และรีสตาร์ทแอป Anchor ที่วางไว้ก่อนหน้านี้และข้อมูลใดๆ ที่เกี่ยวข้อง รวมถึงท่าทางของ Anchor จะหายไป
ในอีก 2-3 ส่วนถัดไป คุณจะสร้างแอปนี้เพื่อดูวิธีแชร์ Anchor ในเซสชัน AR
3. หาแก่นหลักในการไลฟ์สด
ในส่วนนี้ คุณจะแก้ไขworkโปรเจ็กต์เพื่อโฮสต์ Anchor ก่อนเขียนโค้ด คุณจะต้องทำการแก้ไขการกำหนดค่าของแอปเล็กน้อย
ประกาศสิทธิ์ INTERNET
เนื่องจาก Cloud Anchor ต้องสื่อสารกับบริการ ARCore Cloud Anchor API แอปของคุณจึงต้องมีสิทธิ์เข้าถึงอินเทอร์เน็ต
ในไฟล์ AndroidManifest.xml ให้เพิ่มบรรทัดต่อไปนี้ใต้การประกาศสิทธิ์ android.permission.CAMERA
<!-- Find this line... -->
<uses-permission android:name="android.permission.CAMERA"/>
<!-- Add the line right below -->
<uses-permission android:name="android.permission.INTERNET"/>
เปิดใช้ ARCore API
- ไปที่หน้าบริการ ARCore API
- ในรายการโปรเจ็กต์ ให้เลือกโปรเจ็กต์หรือสร้างโปรเจ็กต์ใหม่
- คลิกเปิดใช้
ตั้งค่าการตรวจสอบสิทธิ์แบบไม่ใช้คีย์
หากต้องการใช้ Cloud Anchor แบบถาวร คุณจะต้องใช้การตรวจสอบสิทธิ์แบบไม่มีคีย์เพื่อตรวจสอบสิทธิ์กับ ARCore API
- ไปที่คอนโซล Google Cloud Platform
- เลือกโปรเจ็กต์จากรายการโปรเจ็กต์
- หากหน้า API และบริการยังไม่เปิด ให้เปิดเมนูด้านซ้ายของคอนโซลแล้วเลือก API และบริการ
- คลิกข้อมูลเข้าสู่ระบบทางด้านซ้าย
- คลิกสร้างข้อมูลเข้าสู่ระบบ แล้วเลือกรหัสไคลเอ็นต์ OAuth
- กรอกค่าต่อไปนี้
- ประเภทแอปพลิเคชัน: Android
- ชื่อแพ็กเกจ:
com.google.ar.core.codelab.cloudanchor
- ดึงลายนิ้วมือของใบรับรองการลงนามสำหรับแก้ไขข้อบกพร่อง:
- เปิดแผงเครื่องมือ Gradle ในโปรเจ็กต์ Android Studio
- ใน cloud-anchors > work > Tasks > android ให้เรียกใช้งาน signingReport
- คัดลอกลายนิ้วมือ SHA-1 ลงในช่องลายนิ้วมือใบรับรอง SHA-1 ใน Google Cloud
กำหนดค่า ARCore
จากนั้นคุณจะแก้ไขแอปเพื่อโฮสต์ Anchor เมื่อผู้ใช้แตะแทนการแตะปกติ โดยคุณจะต้องกำหนดค่าเซสชัน ARCore เพื่อเปิดใช้ Cloud Anchor
เพิ่มโค้ดต่อไปนี้ในไฟล์ CloudAnchorFragment.java
// Find this line...
session = new Session(requireActivity());
// Add these lines right below:
// Configure the session.
Config config = new Config(session);
config.setCloudAnchorMode(CloudAnchorMode.ENABLED);
session.configure(config);
ก่อนดำเนินการต่อ ให้สร้างและเรียกใช้แอป ตรวจสอบว่าได้สร้างเฉพาะโมดูล work แอปควรสร้างได้สำเร็จและทำงานเหมือนเดิม
โฮสต์ Anchor
ถึงเวลาโฮสต์ Anchor ที่จะอัปโหลดไปยัง ARCore API แล้ว
เพิ่มฟิลด์ใหม่ต่อไปนี้ลงในคลาส CloudAnchorFragment
// Find this line...
private Anchor currentAnchor = null;
// Add these lines right below.
@Nullable
private Future future = null;
อย่าลืมเพิ่มการนำเข้าสำหรับ com.google.ar.core.Future
แก้ไขonClearButtonPressedวิธีดังนี้
private void onClearButtonPressed() {
// Clear the anchor from the scene.
if (currentAnchor != null) {
currentAnchor.detach();
currentAnchor = null;
}
// The next part is the new addition.
// Cancel any ongoing asynchronous operations.
if (future != null) {
future.cancel();
future = null;
}
}
จากนั้นเพิ่มเมธอดต่อไปนี้ลงในคลาส CloudAnchorFragment
private void onHostComplete(String cloudAnchorId, CloudAnchorState cloudState) {
if (cloudState == CloudAnchorState.SUCCESS) {
messageSnackbarHelper.showMessage(getActivity(), "Cloud Anchor Hosted. ID: " + cloudAnchorId);
} else {
messageSnackbarHelper.showMessage(getActivity(), "Error while hosting: " + cloudState.toString());
}
}
ค้นหาเมธอด handleTap ในคลาส CloudAnchorFragment แล้วเพิ่มบรรทัดต่อไปนี้
// Find this line...
currentAnchor = hit.createAnchor();
// Add these lines right below:
messageSnackbarHelper.showMessage(getActivity(), "Now hosting anchor...");
future = session.hostCloudAnchorAsync(currentAnchor, 300, this::onHostComplete);
เรียกใช้แอปจาก Android Studio อีกครั้ง คุณควรเห็นข้อความ "กำลังวางสมอ..." เมื่อวางสมอ คุณควรเห็นข้อความอีกข้อความเมื่อโฮสติ้งเสร็จสมบูรณ์แล้ว หากเห็นข้อความ "ข้อผิดพลาดในการโฮสต์ Anchor: ERROR_NOT_AUTHORIZED" ให้ตรวจสอบว่าไคลเอ็นต์ OAuth ได้รับการกำหนดค่าอย่างถูกต้อง

ทุกคนที่ทราบรหัส Anchor และอยู่ในพื้นที่เดียวกันกับ Anchor จะใช้รหัส Anchor เพื่อสร้าง Anchor ที่ท่าทาง (ตำแหน่งและการวางแนว) เดียวกันได้โดยอิงตามสภาพแวดล้อมรอบๆ
อย่างไรก็ตาม รหัส Anchor นั้นยาวและผู้ใช้รายอื่นป้อนด้วยตนเองได้ยาก ในส่วนต่อไปนี้ คุณจะจัดเก็บรหัส Cloud Anchor ในลักษณะที่เรียกข้อมูลได้ง่ายเพื่ออนุญาตให้มีการแก้ไข Anchor ในอุปกรณ์เดียวกันหรืออุปกรณ์อื่น
4. รหัสร้านค้าและจุดยึดที่แก้ไขแล้ว
ในส่วนนี้ คุณจะกำหนดรหัสแบบสั้นให้กับรหัส Cloud Anchor แบบยาวเพื่อให้ผู้ใช้รายอื่นป้อนด้วยตนเองได้ง่ายขึ้น คุณจะใช้ API Shared Preferences เพื่อจัดเก็บรหัส Cloud Anchor เป็นค่าในตารางคีย์-ค่า ตารางนี้จะยังคงอยู่แม้ว่าแอปจะถูกปิดและรีสตาร์ท
เรามีคลาสตัวช่วยชื่อ StorageManager ให้คุณอยู่แล้ว ซึ่งเป็น Wrapper รอบ SharedPreferences API ที่มีเมธอดสำหรับการสร้างรหัสย่อที่ไม่ซ้ำกันใหม่ และการอ่าน/เขียนรหัส Cloud Anchor
ใช้ StorageManager
แก้ไข CloudAnchorFragment เพื่อใช้ StorageManager ในการจัดเก็บรหัส Cloud Anchor ด้วยรหัสย่อเพื่อให้ดึงข้อมูลได้ง่าย
สร้างฟิลด์ใหม่ต่อไปนี้ใน CloudAnchorFragment
// Find this line...
private TapHelper tapHelper;
// And add the storageManager.
private final StorageManager storageManager = new StorageManager();
จากนั้นแก้ไขเมธอด onHostComplete โดยทำดังนี้
private void onHostComplete(String cloudAnchorId, CloudAnchorState cloudState) {
if (cloudState == CloudAnchorState.SUCCESS) {
int shortCode = storageManager.nextShortCode(getActivity());
storageManager.storeUsingShortCode(getActivity(), shortCode, anchor.getCloudAnchorId());
messageSnackbarHelper.showMessage(
getActivity(), "Cloud Anchor Hosted. Short code: " + shortCode);
} else {
messageSnackbarHelper.showMessage(getActivity(), "Error while hosting: " + cloudState.toString());
}
}
ตอนนี้ให้สร้างและเรียกใช้แอปจาก Android Studio คุณควรเห็นรหัสสั้นแสดงแทนรหัส Cloud Anchor แบบยาวเมื่อสร้างและโฮสต์ Anchor
ทันทีหลังจากวางสมอ | หลังจากรอสักครู่ |
|
|
โปรดทราบว่าขณะนี้ระบบจะกำหนดรหัสย่อที่สร้างโดย StorageManager ตามลำดับจากน้อยไปมากเสมอ
จากนั้นคุณจะเพิ่มองค์ประกอบ UI บางอย่างที่จะช่วยให้คุณป้อนรหัสย่อและสร้างจุดยึดใหม่ได้
เพิ่มปุ่มแก้ไข
คุณจะเพิ่มปุ่มอื่นข้างปุ่มCLEAR ซึ่งจะเป็นปุ่มแก้ไข การคลิกปุ่มแก้ไขจะเปิดกล่องโต้ตอบที่แจ้งให้ผู้ใช้ป้อนรหัสแบบสั้น ระบบจะใช้รหัสสั้นเพื่อดึงรหัส Cloud Anchor จาก StorageManager และแก้ไข Anchor
หากต้องการเพิ่มปุ่ม คุณจะต้องแก้ไขไฟล์ res/layout/cloud_anchor_fragment.xml ใน Android Studio ให้ดับเบิลคลิกไฟล์ แล้วคลิกแท็บ "ข้อความ" ที่ด้านล่างเพื่อแสดง XML ดิบ ทำการแก้ไขต่อไปนี้
<!-- Find this element. -->
<Button
android:text="CLEAR"
android:id="@+id/clear_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<!-- Add this element right below. -->
<Button
android:text="RESOLVE"
android:id="@+id/resolve_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
ตอนนี้ให้เพิ่มฟิลด์ใหม่ลงใน CloudAnchorFragment ดังนี้
private Button resolveButton;
วิธีเพิ่มวิธีการใหม่
private void onResolveButtonPressed() {
ResolveDialogFragment dialog = new ResolveDialogFragment();
dialog.show(getFragmentMagetActivity().getSupportFragmentManagernager(), "Resolve");
}
เริ่มต้น resolveButton ในเมธอด onCreateView ดังนี้
// Find these lines...
Button clearButton = rootView.findViewById(R.id.clear_button);
clearButton.setOnClickListener(v -> onClearButtonPressed());
// Add these lines right below.
resolveButton = rootView.findViewById(R.id.resolve_button);
resolveButton.setOnClickListener(v -> onResolveButtonPressed());
ค้นหาhandleTap แล้วแก้ไขโดยทำดังนี้
private void handleTap(Frame frame, Camera camera) {
// ...
// Find this line.
currentAnchor = hit.createAnchor();
// Add this line right below.
getActivity().runOnUiThread(() -> resolveButton.setEnabled(false));
}
เพิ่มบรรทัดในonClearButtonPressedเมธอด:
private void onClearButtonPressed() {
// Clear the anchor from the scene.
if (currentAnchor != null) {
currentAnchor.detach();
currentAnchor = null;
}
// Cancel any ongoing async operations.
if (future != null) {
future.cancel();
future = null;
}
// The next line is the new addition.
resolveButton.setEnabled(true);
}
สร้างและเรียกใช้แอปจาก Android Studio คุณควรเห็นปุ่มแก้ไขข้างปุ่มล้าง การคลิกปุ่ม RESOLVE จะทำให้กล่องโต้ตอบปรากฏขึ้นดังที่แสดงด้านล่าง
ตอนนี้ปุ่มแก้ไขจะปรากฏให้เห็นแล้ว | การคลิกปุ่มจะทำให้กล่องโต้ตอบนี้ปรากฏขึ้น |
|
|
การแตะเครื่องบินและการโฮสต์สมอควรปิดใช้ปุ่ม RESOLVE แต่การแตะปุ่ม CLEAR ควรเปิดใช้ปุ่มอีกครั้ง ซึ่งเป็นไปตามการออกแบบเพื่อให้มีเฉพาะสมอเดียวในฉากในแต่ละครั้ง
กล่องโต้ตอบ "Resolve Anchor" จะไม่ทำอะไร แต่คุณจะเปลี่ยนตอนนี้
แก้ไข Anchor
เพิ่มเมธอดต่อไปนี้ในคลาส CloudAnchorFragment
private void onShortCodeEntered(int shortCode) {
String cloudAnchorId = storageManager.getCloudAnchorId(getActivity(), shortCode);
if (cloudAnchorId == null || cloudAnchorId.isEmpty()) {
messageSnackbarHelper.showMessage(
getActivity(),
"A Cloud Anchor ID for the short code " + shortCode + " was not found.");
return;
}
resolveButton.setEnabled(false);
future = session.resolveCloudAnchorAsync(
cloudAnchorId, (anchor, cloudState) -> onResolveComplete(anchor, cloudState, shortCode));
}
private void onResolveComplete(Anchor anchor, CloudAnchorState cloudState, int shortCode) {
if (cloudState == CloudAnchorState.SUCCESS) {
messageSnackbarHelper.showMessage(getActivity(), "Cloud Anchor Resolved. Short code: " + shortCode);
currentAnchor = anchor;
} else {
messageSnackbarHelper.showMessage(
getActivity(),
"Error while resolving anchor with short code "
+ shortCode
+ ". Error: "
+ cloudState.toString());
resolveButton.setEnabled(true);
}
}
จากนั้นแก้ไขonResolveButtonPressedวิธีดังนี้
private void onResolveButtonPressed() {
ResolveDialogFragment dialog = ResolveDialogFragment.createWithOkListener(
this::onShortCodeEntered);
dialog.show(getActivity().getSupportFragmentManager(), "Resolve");
}
สร้างและเรียกใช้แอปจาก Android Studio แล้วทำตามขั้นตอนต่อไปนี้
- สร้างการถ่ายทอดสดบนเครื่องบินและรอให้มีการโฮสต์การถ่ายทอดสด
จดจำรหัสแบบสั้น - กดปุ่มCLEARเพื่อลบจุดยึด
- กดปุ่มแก้ไข ป้อนรหัสย่อจากขั้นตอนที่ 1
- คุณควรเห็นสมอในตำแหน่งเดียวกันเมื่อเทียบกับสภาพแวดล้อมตามที่คุณวางไว้ในตอนแรก
- ออกจากแอปและปิดแอป แล้วเปิดอีกครั้ง
- ทำขั้นตอนที่ (3) และ (4) ซ้ำ คุณควรเห็นจุดยึดใหม่ในตำแหน่งเดิม
การป้อนรหัสย่อ | แก้ไข Anchor เรียบร้อยแล้ว |
|
|
5. แชร์ระหว่างอุปกรณ์
คุณได้เห็นวิธีจัดเก็บ Cloud Anchor ID ของ Anchor ไว้ในพื้นที่เก็บข้อมูลในอุปกรณ์ และเรียกข้อมูลดังกล่าวในภายหลังเพื่อสร้าง Anchor เดียวกันอีกครั้ง แต่คุณจะปลดล็อกศักยภาพทั้งหมดของ Cloud Anchor ได้ก็ต่อเมื่อแชร์รหัส Cloud Anchor ระหว่างอุปกรณ์ต่างๆ ได้
คุณจะแชร์รหัส Cloud Anchor อย่างไรก็ได้ คุณใช้อะไรก็ได้เพื่อโอนสตริงจากอุปกรณ์เครื่องหนึ่งไปยังอีกเครื่องหนึ่ง ในโค้ดแล็บนี้ คุณจะใช้ฐานข้อมูลเรียลไทม์ของ Firebase เพื่อโอนรหัส Cloud Anchor ระหว่างอินสแตนซ์ของแอป
การตั้งค่า Firebase
คุณต้องตั้งค่าเรียลไทม์ดาต้าเบสของ Firebase ด้วยบัญชี Google เพื่อใช้กับแอปนี้ ซึ่งทำได้ง่ายๆ ด้วย Firebase Assistant ใน Android Studio
ใน Android Studio ให้คลิกเครื่องมือ > Firebase ในแผง Assistant ที่ปรากฏขึ้น ให้คลิก Realtime Database แล้วคลิกบันทึกและเรียกข้อมูล

คลิกปุ่มเชื่อมต่อกับ Firebase เพื่อเชื่อมต่อโปรเจ็กต์ Android Studio กับโปรเจ็กต์ Firebase ใหม่หรือที่มีอยู่

ซึ่งจะแจ้งให้คุณเลือกโมดูล เลือกโมดูล work

กล่องโต้ตอบ "กำลังเริ่มเชื่อมต่อ" จะปรากฏขึ้น ขั้นตอนนี้อาจใช้เวลาสักครู่

ลงชื่อเข้าใช้ด้วยบัญชี Google แล้วทําตามเวิร์กโฟลว์บนเว็บเพื่อสร้างโปรเจ็กต์ Firebase สําหรับแอปจนกว่าจะกลับไปที่ Android Studio
จากนั้นในแผง Assistant ให้คลิกเพิ่ม Realtime Database ลงในแอป

ในกล่องโต้ตอบที่ปรากฏขึ้น ให้เลือกงานจากเมนูแบบเลื่อนลงโมดูลเป้าหมาย แล้วคลิกยอมรับการเปลี่ยนแปลง

การดำเนินการนี้จะมีผลดังนี้
- เพิ่มไฟล์
google-services.jsonลงในไดเรกทอรีwork - เพิ่ม 2 บรรทัดลงในไฟล์
build.gradleในไดเรกทอรีเดียวกัน - สร้างและเรียกใช้แอป (คุณอาจเห็นข้อผิดพลาดในการแก้ไขเกี่ยวกับหมายเลขเวอร์ชันของฐานข้อมูล Firebase)
ในไฟล์ work module build.gradle ให้ค้นหาและนำบรรทัดต่อไปนี้ออก (xxxx เป็นตัวยึดตำแหน่งสำหรับหมายเลขเวอร์ชันล่าสุด)
dependencies {
...
implementation 'com.google.firebase:firebase-database:xxxx'
จากนั้น ให้อ่าน (แต่ยังไม่ต้องทำตาม) วิธีการที่ลิงก์จากหน้ากำหนดค่ากฎสำหรับการเข้าถึงแบบสาธารณะเพื่อกำหนดค่าฐานข้อมูลเรียลไทม์ของ Firebase ให้เขียนได้จากทุกที่ ซึ่งจะช่วยให้การทดสอบในโค้ดแล็บนี้ง่ายขึ้น

จากคอนโซล Firebase ให้เลือกโปรเจ็กต์ที่คุณเชื่อมต่อโปรเจ็กต์ Android Studio แล้ว จากนั้นเลือกสร้าง > Realtime Database

คลิกสร้างฐานข้อมูลเพื่อกำหนดค่าและตั้งค่า Realtime Database ดังนี้

เลือกตำแหน่งฐานข้อมูล
ในขั้นตอนถัดไป ให้เลือกกฎความปลอดภัยโหมดทดสอบ แล้วคลิกเปิดใช้

ตอนนี้แอปได้รับการกำหนดค่าให้ใช้ฐานข้อมูล Firebase แล้ว
การใช้ FirebaseManager
ตอนนี้คุณจะแทนที่ StorageManager ด้วย FirebaseManager
ใน Android Studio ให้ค้นหาคลาส CloudAnchorFragment ในไดเรกทอรี work แทนที่ StorageManager ด้วย FirebaseManager:
// Find this line.
private final StorageManager storageManager = new StorageManager();
// And replace it with this line.
private FirebaseManager firebaseManager;
เริ่มต้น firebaseManager ในเมธอด onAttach ดังนี้
public void onAttach(@NonNull Context context) {
super.onAttach(context);
tapHelper = new TapHelper(context);
trackingStateHelper = new TrackingStateHelper(requireActivity());
// The next line is the new addition.
firebaseManager = new FirebaseManager(context);
}
แก้ไขonShortCodeEnteredวิธีดังนี้
private void onShortCodeEntered(int shortCode) {
firebaseManager.getCloudAnchorId(shortCode, cloudAnchorId -> {
if (cloudAnchorId == null || cloudAnchorId.isEmpty()) {
messageSnackbarHelper.showMessage(
getActivity(),
"A Cloud Anchor ID for the short code " + shortCode + " was not found.");
return;
}
resolveButton.setEnabled(false);
future = session.resolveCloudAnchorAsync(
cloudAnchorId, (anchor, cloudState) -> onResolveComplete(anchor, cloudState, shortCode));
});
}
จากนั้นแก้ไขเมธอด onHostComplete ดังนี้
private void onHostComplete(String cloudAnchorId, CloudAnchorState cloudState) {
if (cloudState == CloudAnchorState.SUCCESS) {
firebaseManager.nextShortCode(shortCode -> {
if (shortCode != null) {
firebaseManager.storeUsingShortCode(shortCode, cloudAnchorId);
messageSnackbarHelper.showMessage(getActivity(), "Cloud Anchor Hosted. Short code: " + shortCode);
} else {
// Firebase could not provide a short code.
messageSnackbarHelper.showMessage(getActivity(), "Cloud Anchor Hosted, but could not "
+ "get a short code from Firebase.");
}
});
} else {
messageSnackbarHelper.showMessage(getActivity(), "Error while hosting: " + cloudState.toString());
}
}
สร้างและเรียกใช้แอป คุณควรเห็นขั้นตอน UI เดียวกันกับในส่วนก่อนหน้า ยกเว้นว่าตอนนี้ระบบจะใช้ฐานข้อมูล Firebase ออนไลน์เพื่อจัดเก็บรหัส Cloud Anchor และรหัสย่อแทนที่เก็บข้อมูลในอุปกรณ์
การทดสอบแบบหลายผู้ใช้
หากต้องการทดสอบประสบการณ์การใช้งานแบบหลายผู้ใช้ ให้ใช้โทรศัพท์ 2 เครื่องที่แตกต่างกัน โดยทำดังนี้
- ติดตั้งแอปในอุปกรณ์ 2 เครื่อง
- ใช้อุปกรณ์เครื่องเดียวเพื่อโฮสต์อุปกรณ์หลักและสร้างรหัสย่อ
- ใช้อุปกรณ์อื่นเพื่อแก้ไขจุดยึดโดยใช้รหัสย่อดังกล่าว
คุณควรโฮสต์ Anchor จากอุปกรณ์เครื่องหนึ่ง รับรหัสแบบสั้น และใช้รหัสแบบสั้นในอุปกรณ์อีกเครื่องเพื่อดู Anchor ในตำแหน่งเดียวกันได้
6. สรุป
ยินดีด้วย คุณมาถึงตอนจบของ Codelab นี้แล้ว
สิ่งที่เราได้พูดถึงไปแล้ว
- วิธีโฮสต์ Anchor โดยใช้ ARCore SDK และรับรหัส Cloud Anchor
- วิธีใช้รหัส Cloud Anchor เพื่อแก้ไข Anchor
- วิธีจัดเก็บและแชร์รหัส Cloud Anchor ระหว่างเซสชัน AR ต่างๆ ในอุปกรณ์เดียวกันหรือในอุปกรณ์ต่างๆ





