ฮาวทู

การนำ Androidify มาสู่ XR ด้วย Jetpack XR SDK

ใช้เวลาอ่าน 9 นาที
Dereck Bridie
วิศวกรนักพัฒนาซอฟต์แวร์สัมพันธ์

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

การเปิดตัว Samsung Galaxy XR ทำให้อุปกรณ์เครื่องแรกที่ขับเคลื่อนโดย Android XR พร้อมใช้งานอย่างเป็นทางการแล้ว ตอนนี้ผู้ใช้สามารถเพลิดเพลินกับแอปโปรดมากมายจาก Play Store ในมิติใหม่ นั่นก็คือมิติที่ 3

มิติที่ 3 คือมิติที่กว้างขวาง ซึ่งมีพื้นที่เหลือเฟือสำหรับแอปของคุณด้วย เริ่มใช้งานได้เลยวันนี้โดยใช้เครื่องมือที่เหมาะกับแอปของคุณ เช่น คุณสามารถใช้ Jetpack XR SDK เพื่อสร้างประสบการณ์ XR ที่สมจริงโดยใช้เครื่องมือพัฒนา Android สมัยใหม่ เช่น Kotlin และ Compose

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

ทัวร์ชม Androidify

Androidify เป็นแอปโอเพนซอร์สที่ให้คุณสร้างบ็อต Android โดยใช้เทคโนโลยีล่าสุดบางอย่าง เช่น Gemini, CameraX, Navigation 3 และแน่นอนว่า Jetpack Compose Androidify ได้รับการออกแบบมาตั้งแต่แรกให้ดูดีในโทรศัพท์ อุปกรณ์แบบพับได้ และแท็บเล็ตด้วยการสร้างเลย์เอาต์ที่ปรับเปลี่ยนตามอุปกรณ์

customize.png

Androidify ดูดีในอุปกรณ์หลายรูปแบบ

เสาหลักที่สำคัญของเลย์เอาต์ที่ปรับเปลี่ยนตามพื้นที่คือ Composable ที่นำกลับมาใช้ใหม่ได้ Jetpack Compose ช่วยให้คุณสร้างคอมโพเนนต์ UI ขนาดเล็กที่จัดวางได้หลายวิธีเพื่อสร้างประสบการณ์ของผู้ใช้ที่ใช้งานง่าย ไม่ว่าผู้ใช้จะใช้อุปกรณ์ประเภทใดก็ตาม ที่จริงแล้ว Androidify เข้ากันได้กับ Android XR โดยไม่ต้องแก้ไขแอปเลย

customize_2.png

Androidify ปรับให้เข้ากับ XR โดยใช้เลย์เอาต์ที่ตอบสนองตามหน้าจอขนาดใหญ่โดยไม่ต้องเปลี่ยนแปลงโค้ด

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

การปรับทิศทางใน XR

มาดูแนวคิดพื้นฐานที่สำคัญสำหรับ Android XR กัน โดยเริ่มจาก 2 โหมดที่แอปสามารถทำงานได้ ได้แก่ Home Space และ Full Space

homespace.png
แอปใน Home Space
homespace2.png
แอปใน Full Space

ใน Home Space คุณสามารถเรียกใช้แอปหลายแอปควบคู่กันไปเพื่อให้ผู้ใช้ทำงานหลายอย่างพร้อมกันในหน้าต่างต่างๆ ได้ ในแง่นั้น การทำงานของฟีเจอร์นี้จึงคล้ายกับการใช้งานหน้าต่างเดสก์ท็อปบนอุปกรณ์ Android ที่มีหน้าจอขนาดใหญ่ แต่เป็นการทำงานในพื้นที่เสมือน

ใน Full Space แอปจะไม่มีขอบเขตพื้นที่และสามารถใช้ฟีเจอร์เชิงพื้นที่ทั้งหมดของ Android XR ได้ เช่น UI เชิงพื้นที่และการควบคุมสภาพแวดล้อมเสมือน

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

การออกแบบสำหรับมิติข้อมูลใหม่ของ Androidify

แอปที่น่าพึงพอใจเริ่มต้นด้วยการออกแบบที่ยอดเยี่ยม Ivy Knight ผู้สนับสนุนด้านการออกแบบอาวุโสใน Android DevRel ได้รับมอบหมายให้ปรับปรุงการออกแบบที่มีอยู่สำหรับ Androidify และออกแบบใหม่สำหรับ XR เชิญเลย ไอวี่

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

เริ่มต้นการออกแบบด้วย Home Space

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

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

การออกแบบสำหรับการเปลี่ยนไปใช้ Full Space

Full Space เป็นการเปลี่ยนแปลงครั้งใหญ่ที่สุด แต่ก็ทำให้เรามีพื้นที่สร้างสรรค์มากที่สุดในการปรับดีไซน์ 

tablet_to_xr.webp
จากแท็บเล็ตสู่ XR

Androidify ใช้การบรรจุภาพหรือแผงเพื่อจัดกลุ่มฟีเจอร์ที่มีพื้นหลังและเส้นขอบ เช่น แผง "ถ่ายหรือเลือกรูปภาพ" นอกจากนี้ เรายังใช้คอมโพเนนต์ต่างๆ เช่น แถบแอปด้านบน เพื่อสร้างการบรรจุตามธรรมชาติด้วยการจัดกรอบให้กับแผงอื่นๆ สุดท้ายนี้ การบรรจุภายในจะแนะนำโดยความใกล้เคียงขององค์ประกอบบางอย่างกับองค์ประกอบอื่นๆ เช่น ปุ่มด้านล่าง "เริ่มการเปลี่ยนรูป" ซึ่งอยู่ใกล้กับแผง "เลือกสีบอทของฉัน"

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

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

เคล็ดลับการออกแบบอื่นๆ ที่ช่วยให้แอปของคุณรองรับพื้นที่

  • ปล่อยให้สิ่งต่างๆ ไม่ถูกจำกัด: แยกส่วนประกอบต่างๆ ออกมาและให้พื้นที่จริง (เชิงพื้นที่) แก่ส่วนประกอบเหล่านั้น ได้เวลาเว้นที่ว่างให้องค์ประกอบ UI เหล่านั้นแล้ว
  • นำพื้นผิวออก: ซ่อนพื้นหลังเพื่อดูว่าการดำเนินการดังกล่าวส่งผลต่อการออกแบบอย่างไร
  • กระตุ้นด้วยการเคลื่อนไหว: คุณใช้ทรานซิชันในแอปอย่างไร ใช้อักขระดังกล่าวเพื่อจินตนาการถึงการเปิดตัวแอปของคุณใน VR
  • เลือกจุดยึด: อย่าปล่อยให้ผู้ใช้หลงทางในพื้นที่ มีองค์ประกอบที่ช่วยรวบรวมหรือยึด UI

ดูข้อมูลเพิ่มเติมเกี่ยวกับรูปแบบการออกแบบ UI ของ XR ได้ที่ออกแบบสำหรับ Android XR ในนักพัฒนาแอป Android

พื้นฐานของ UI เชิงพื้นที่

ตอนนี้เราได้พูดถึงประสบการณ์ของ Ivy ในการปรับเปลี่ยนแนวคิดขณะออกแบบ Androidify สำหรับ XR แล้ว มาพูดถึงการพัฒนา UI เชิงพื้นที่กัน การพัฒนา UI เชิงพื้นที่ด้วย Jetpack XR SDK ควรจะคุ้นเคยหากคุณเคยใช้เครื่องมือและไลบรารี Android สมัยใหม่ คุณจะเห็นแนวคิดที่คุ้นเคยอยู่แล้ว เช่น การสร้างเลย์เอาต์ด้วย Compose จริงๆ แล้วเลย์เอาต์เชิงพื้นที่นั้นคล้ายกับเลย์เอาต์ 2 มิติที่ใช้แถว คอลัมน์ และตัวคั่นมาก

spatialrows.png

องค์ประกอบเหล่านี้จัดเรียงอยู่ใน SpatialRows และ SpatialColumns

องค์ประกอบเชิงพื้นที่ที่แสดงที่นี่คือ Composable SpatialPanel ซึ่งช่วยให้คุณแสดงเนื้อหา 2 มิติ เช่น ข้อความ ปุ่ม และวิดีโอได้

Subspace {
    SpatialPanel(
        SubspaceModifier
            .height(824.dp)
            .width(1400.dp)
    ) {
        Text("I'm a panel!")
    }
}

SpatialPanel เป็น subspace composable Composable ของ Subspace ต้องอยู่ใน Subspace และแก้ไขโดยออบเจ็กต์ SubspaceModifier วาง Subspace ได้ทุกที่ภายในลําดับชั้น UI ของแอป และมีได้เฉพาะ Composable ของ Subspace เท่านั้น ออบเจ็กต์ SubspaceModifier ก็คล้ายกับออบเจ็กต์ Modifier มากเช่นกัน โดยจะควบคุมพารามิเตอร์ต่างๆ เช่น การปรับขนาดและการวางตำแหน่ง

Orbiter  สามารถแนบไปกับSpatialPanelและเคลื่อนที่ไปพร้อมกับเนื้อหาที่แนบอยู่ได้ โดยมักใช้เพื่อควบคุมเนื้อหาตามบริบทที่แนบมากับเนื้อหาดังกล่าว ซึ่งทำให้เนื้อหาเป็นจุดสนใจหลัก โดยวางไว้ที่ด้านใดด้านหนึ่งของเนื้อหาทั้ง 4 ด้านได้ในระยะที่กำหนดค่าได้

orbiter.png
ติด Orbiter ไว้ที่ด้านล่างของ SpatialPanel

องค์ประกอบ UI เชิงพื้นที่อื่นๆ มีอีกมากมาย แต่รายการเหล่านี้คือองค์ประกอบหลักที่เราใช้สร้างเลย์เอาต์เชิงพื้นที่สำหรับ Androidify

เริ่มต้นใช้งานการพัฒนา XR

มาเริ่มกันที่การตั้งค่าโปรเจ็กต์ เราได้เพิ่มทรัพยากร Dependency ของ Jetpack XR Compose ซึ่งคุณดูได้ในหน้าทรัพยากร Dependency ของ Jetpack XR

เราได้เพิ่มโค้ดสำหรับปุ่มที่จะเปลี่ยนผู้ใช้ไปใช้ Full Space โดยเริ่มจากการตรวจหาความสามารถในการดำเนินการดังกล่าว

@Composable
fun couldRequestFullSpace(): Boolean =
   LocalSpatialConfiguration.current.hasXrSpatialFeature && 
   !LocalSpatialCapabilities.current.isSpatialUiEnabled
}

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

@Composable

fun RequestFullSpaceIconButton() {
   if (!couldRequestFullSpace()) return
   val session = LocalSession.current ?: return

   IconButton(
       onClick = {
           session.scene.requestFullSpaceMode()
       },
   ) {
       Icon(
           imageVector =  
               vectorResource(R.drawable.expand_content_24px),
           contentDescription = 
               stringResource("To Full Space"),
       )
   }
}

ตอนนี้ การคลิกปุ่มนั้นจะแสดงเฉพาะเลย์เอาต์ขนาดกลางใน Full Space เราสามารถตรวจสอบความสามารถเชิงพื้นที่และพิจารณาว่าแสดง UI เชิงพื้นที่ได้หรือไม่ ในกรณีนี้ เราจะแสดงเลย์เอาต์เชิงพื้นที่ใหม่แทน

@Composable

fun HomeScreenContents(layoutType: HomeScreenLayoutType) {
   val layoutType = when {
      LocalSpatialCapabilities.current.isSpatialUiEnabled -> 
          HomeScreenLayoutType.Spatial
      isAtLeastMedium() -> HomeScreenLayoutType.Medium
      else -> HomeScreenLayoutType.Compact
   }

   when (layoutType) {
      HomeScreenLayoutType.Compact ->
          HomeScreenCompactPager(...)

      HomeScreenLayoutType.Medium ->
          HomeScreenMediumContents(...)

      HomeScreenLayoutType.Spatial ->
          HomeScreenContentsSpatial(...)
   }
}

การใช้การออกแบบสำหรับหน้าจอหลัก

มาดูการออกแบบเชิงพื้นที่สำหรับหน้าจอหลักใน Full Space เพื่อทำความเข้าใจวิธีใช้งานกัน

customize_3.png

เราพบองค์ประกอบ SpatialPanel 2 รายการที่นี่ ได้แก่ แผงที่การ์ดวิดีโออยู่ทางด้านขวา และแผงที่มี UI หลัก และสุดท้ายก็มี Orbiter ติดอยู่ด้านบน มาเริ่มกันที่แผงวิดีโอเพลเยอร์

@Composable
fun HomeScreenContentsSpatial(...) {
   Subspace {
      SpatialPanel(SubspaceModifier
                   .fillMaxWidth(0.2f)
                   .fillMaxHeight(0.8f)
                   .aspectRatio(0.77f)
                   .rotate(0f, 0f, 5f),
      ) {
          VideoPlayer(videoLink)
      }
   }
}

เราเพียงนำคอมโพเนนต์ VideoPlayer แบบ 2 มิติจากเลย์เอาต์ปกติมาใช้ซ้ำใน SpatialPanel โดยไม่ต้องทำการเปลี่ยนแปลงเพิ่มเติม ซึ่งจะมีลักษณะดังนี้

bluetiel.png

แผงเนื้อหาหลักก็มีเรื่องราวคล้ายกัน นั่นคือเรานำเนื้อหาแผงขนาดกลางมาใช้ซ้ำใน SpatialPanel

SpatialPanel(SubspaceModifier.fillMaxSize(),
             resizePolicy = ResizePolicy(
                 shouldMaintainAspectRatio = true
             ),
             dragPolicy = MovePolicy()
) {
    Box {
        FillBackground(R.drawable.squiggle_full)
        HomeScreenSpatialMainContent(...)
    }
}

เรากำหนด ResizePolicy ให้กับแผงนี้ ซึ่งจะทำให้แผงมีแฮนเดิลบางอย่างใกล้กับขอบที่ช่วยให้ผู้ใช้ปรับขนาดแผงได้ นอกจากนี้ยังมี MovePolicy ซึ่งช่วยให้ผู้ใช้ลากไปมาได้

customize_4.png

การวางไว้ใน Subspace เดียวกันจะทำให้ทั้ง 2 ส่วนแยกจากกัน เราจึงทำให้แผง VideoPlayer เป็นส่วนย่อยของแผงเนื้อหาหลัก ซึ่งจะทำให้แผง VideoPlayer เคลื่อนที่เมื่อลากแผงเนื้อหาหลักผ่านความสัมพันธ์ระดับบนสุดและระดับย่อย

@Composable
fun HomeScreenContentsSpatial(...) {
   Subspace {
       SpatialPanel(SubspaceModifier..., resizePolicy, dragPolicy) {
           Box {
               FillBackground(R.drawable.squiggle_full)
               HomeScreenSpatialMainContent(...)
           }
           Subspace {
              SpatialPanel(SubspaceModifier...) {
                  VideoPlayer(videoLink)
              }
           }
       }
   }
}

และนี่คือวิธีที่เราสร้างหน้าจอแรก

ไปที่หน้าจออื่นๆ

นอกจากนี้ ผมจะพูดถึงหน้าจออื่นๆ บางส่วนโดยย่อ พร้อมเน้นย้ำข้อควรพิจารณาที่เฉพาะเจาะจงสำหรับแต่ละหน้าจอ

fullspace.png
หน้าจอการสร้างใน Full Space

ในที่นี้ เราใช้ Composable ของ SpatialRow และ SpatialColumn เพื่อสร้างเลย์เอาต์ที่เหมาะกับพื้นที่การรับชมที่แนะนำ โดยใช้คอมโพเนนต์จากเลย์เอาต์ขนาดกลางอีกครั้ง

fullspace_2.png

หน้าจอผลลัพธ์ใน Full Space: บอทที่สร้างขึ้นด้วยพรอมต์: หมวกเบสบอลสีแดง แว่นกันแดดทรงเอวิเอเตอร์ เสื้อยืดสีฟ้าอ่อน กางเกงขาสั้นลายตารางหมากรุกสีแดงและขาว รองเท้าแตะสีเขียว และถือไม้เทนนิส


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

การเผยแพร่ไปยัง Google Play Store

เมื่อแอปพร้อมสำหรับ XR ด้วยเลย์เอาต์เชิงพื้นที่แล้ว เราจึงเผยแพร่แอปใน Play Store การเปลี่ยนแปลงสุดท้ายที่สำคัญที่เราทำกับไฟล์ AndroidManifest.xml ของแอปมีดังนี้

<!-- Androidify can use XR features if they're available; they're not required. -->
<uses-feature android:name="android.software.xr.api.spatial" 
              android:required="false" />

ซึ่งจะช่วยให้ Play Store ทราบว่าแอปนี้มีฟีเจอร์ที่แตกต่างกันของ XR และแสดงป้ายที่ช่วยให้ผู้ใช้ทราบว่าแอปนี้สร้างขึ้นโดยคำนึงถึง XR

androidify2.png
Androidify ตามที่แสดงใน Google Play Store บน Android XR


เมื่ออัปโหลดรุ่น เราไม่จำเป็นต้องทำตามขั้นตอนพิเศษใดๆ เพื่อเผยแพร่สำหรับ XR โดยระบบจะเผยแพร่แอปเดียวกันตามปกติไปยังผู้ใช้ในแทร็กบนอุปกรณ์เคลื่อนที่เช่นเดียวกับผู้ใช้ในอุปกรณ์ XR อย่างไรก็ตาม คุณเลือกที่จะเพิ่มภาพหน้าจอเฉพาะ XR ของแอป หรือแม้แต่อัปโหลดตัวอย่างแอปแบบสมจริงโดยใช้ชิ้นงานวิดีโอเชิงพื้นที่ได้ ในอุปกรณ์ Android XR ทาง Play Store จะแสดงตัวอย่างนี้เป็นตัวอย่าง 3 มิติที่สมจริงโดยอัตโนมัติ ซึ่งช่วยให้ผู้ใช้ได้สัมผัสความลึกและขนาดของเนื้อหาก่อนที่จะติดตั้งแอป

เริ่มสร้างประสบการณ์ของคุณเองได้เลยวันนี้

Androidify เป็นตัวอย่างที่ยอดเยี่ยมของวิธีทำให้แอป Jetpack Compose 2 มิติที่มีอยู่แสดงผลแบบรอบทิศทาง วันนี้เราได้แสดงกระบวนการทั้งหมดในการพัฒนา UI เชิงพื้นที่สำหรับ Androidify ตั้งแต่การออกแบบไปจนถึงโค้ดและการเผยแพร่ เราได้ปรับเปลี่ยนการออกแบบที่มีอยู่ให้ทำงานร่วมกับกระบวนทัศน์เชิงพื้นที่ ใช้ SpatialPanel และ Orbiter Composables เพื่อสร้างเลย์เอาต์เชิงพื้นที่ที่จะแสดงเมื่อผู้ใช้เข้าสู่ Full Space และในที่สุดก็ได้เปิดตัวแอปเวอร์ชันใหม่ใน Play Store

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

เขียนโดย

อ่านต่อ