การพัฒนาโค้ดซ้ำ

ในฐานะนักพัฒนาแอปบนอุปกรณ์เคลื่อนที่ คุณมักจะพัฒนา UI ของแอปทีละขั้นตอน แทนที่จะพัฒนาทุกอย่างพร้อมกัน Android Studio ใช้แนวทางนี้กับ Jetpack Compose โดยมีเครื่องมือที่ไม่ต้องสร้างแบบเต็มเพื่อตรวจสอบ แก้ไขค่า และยืนยันผลลัพธ์สุดท้าย

การทำซ้ำ UI ที่มี AI ช่วย

คุณใช้ AI Agent ใน Android Studio เพื่อปรับแต่งและเปลี่ยน UI ของ Compose ซ้ำๆ ได้โดยตรงจากตัวอย่างการออกแบบ คลิกขวาที่ตัวอย่างการเขียน แล้วเลือกการทำงานของ AI อย่างใดอย่างหนึ่งต่อไปนี้

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

• เปลี่ยน UI: ใช้พรอมต์ภาษาธรรมชาติ (เช่น "เปลี่ยนสีปุ่มเป็นสีน้ำเงิน") เพื่ออธิบายการแก้ไขที่เฉพาะเจาะจงที่คุณต้องการทำกับ UI

การแก้ไขสด

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

การแก้ไขสดมี 3 โหมด ดังนี้

• ด้วยตนเอง: ระบบจะใช้การเปลี่ยนแปลงโค้ดเมื่อมีการพุชด้วยตนเองโดยใช้ Control+' (Command+' ใน macOS)
• บันทึกด้วยตนเอง: ระบบจะใช้การเปลี่ยนแปลงโค้ดเมื่อบันทึกด้วยตนเองโดยใช้ Control+S (Command+S ใน macOS)
• อัตโนมัติ: การเปลี่ยนแปลงจะมีผลในอุปกรณ์หรือโปรแกรมจำลองเมื่อคุณอัปเดตฟังก์ชันที่ประกอบกันได้

การแก้ไขสดมุ่งเน้นไปที่การเปลี่ยนแปลงโค้ดที่เกี่ยวข้องกับ UI และ UX การแก้ไขสดไม่รองรับการเปลี่ยนแปลง เช่น การอัปเดตลายเซ็นของเมธอด การเพิ่มเมธอดใหม่ หรือการเปลี่ยนแปลงลำดับชั้นของคลาส ดูข้อมูลเพิ่มเติมได้ที่รายการข้อจำกัดของ Live Edit

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

เวิร์กโฟลว์แนวทางปฏิบัติแนะนำมีดังนี้

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

เริ่มต้นใช้งานการแก้ไขสด

หากต้องการเริ่มต้นใช้งาน ให้ทำตามขั้นตอนต่อไปนี้เพื่อสร้าง Compose Activity ที่ว่างเปล่า เปิดใช้ การแก้ไขสดสำหรับโปรเจ็กต์ และทำการเปลี่ยนแปลงด้วยการแก้ไขสด

สร้างโปรเจ็กต์ใหม่

1. ก่อนเริ่มต้น ให้ตรวจสอบว่าคุณได้ติดตั้ง Android Studio Giraffe ขึ้นไปแล้ว และระดับ API ของอุปกรณ์จริงหรือโปรแกรมจำลองต้องเป็นอย่างน้อย 30

2. เปิด Android Studio แล้วเลือก New Project ในกล่องโต้ตอบ Welcome to Android Studio หากมีโปรเจ็กต์เปิดอยู่แล้ว คุณสามารถสร้างโปรเจ็กต์ใหม่ได้โดยไปที่ไฟล์ > ใหม่ > โปรเจ็กต์ใหม่

3. เลือกเทมเพลตกิจกรรมการเขียนที่ว่างเปล่าสำหรับโทรศัพท์และแท็บเล็ต แล้วคลิกถัดไป

   

4. กรอกข้อมูลที่จำเป็นในกล่องโต้ตอบโปรเจ็กต์ใหม่ ได้แก่ ชื่อ ชื่อแพ็กเกจ ตำแหน่งบันทึก SDK ขั้นต่ำ และภาษาการกำหนดค่าบิลด์

   

5. คลิกเสร็จสิ้น

เปิดใช้การแก้ไขสด

1. ไปที่การตั้งค่าเพื่อเปิดใช้การแก้ไขสด

   • ใน Windows หรือ Linux ให้ไปที่ไฟล์ > การตั้งค่า > เอดิเตอร์ > การแก้ไขสด
   • ใน macOS ให้ไปที่ Android Studio > การตั้งค่า > เอดิเตอร์ > การแก้ไขสด

2. เลือกตัวเลือกแก้ไขสดและโหมดที่ต้องการเรียกใช้จากการตั้งค่า

   ในโหมดแมนนวล ระบบจะพุชการเปลี่ยนแปลงโค้ดทุกครั้งที่คุณกด Control+' (Command+' ใน macOS) ในโหมดด้วยตนเอง เมื่อบันทึก ระบบจะใช้การเปลี่ยนแปลงโค้ดทุกครั้งที่คุณบันทึกด้วยตนเองโดยใช้ Control+S (Command+S ใน macOS) ในโหมดอัตโนมัติ ระบบจะใช้การเปลี่ยนแปลงโค้ดในอุปกรณ์หรือ โปรแกรมจำลองเมื่อคุณทำการเปลี่ยนแปลง

   

3. ในโปรแกรมแก้ไข ให้เปิดไฟล์ MainActivity ซึ่งเป็นจุดแรกเข้าของ แอป

4. คลิกเรียกใช้ เพื่อทำให้แอปใช้งานได้

5. หลังจากเปิดการแก้ไขสดแล้ว เครื่องหมายถูกสีเขียวล่าสุดจะปรากฏที่ ด้านขวาบนของหน้าต่างเครื่องมืออุปกรณ์ที่ทำงานอยู่

   

ทำการเปลี่ยนแปลงและตรวจสอบ

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

เช่น แก้ไขGreetingเมธอดที่มีอยู่ใน MainActivity เป็นดังนี้

@Composable
fun Greeting(name: String) {
    Text(
        text = "Hello $name!",
        Modifier
            .padding(80.dp) // Outer padding; outside background
            .background(color = Color.Cyan) // Solid element background color
            .padding(16.dp) // Inner padding; inside background, around text)
    )
}
IterativeDevelopmentSnippets.kt

การเปลี่ยนแปลงจะปรากฏในอุปกรณ์ทดสอบทันที ดังที่แสดงในรูปที่ 6

แก้ปัญหาการแก้ไขสด

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

ข้อจำกัดของการแก้ไขสด

รายการข้อจำกัดในปัจจุบันมีดังนี้

• [ใช้ได้กับ Android Studio Giraffe ขึ้นไปเท่านั้น] การแก้ไขสดต้องใช้ Compose Runtime 1.3.0 ขึ้นไป หากโปรเจ็กต์ใช้ Compose เวอร์ชันที่ต่ำกว่า ระบบจะปิดใช้การแก้ไขสด

• [ใช้กับ Android Studio Giraffe ขึ้นไปเท่านั้น] การแก้ไขสดต้องใช้ AGP 8.1.0-alpha05 ขึ้นไป หากโปรเจ็กต์ใช้ AGP เวอร์ชันที่ต่ำกว่า ระบบจะปิดใช้การแก้ไขแบบสด

• การแก้ไขสดต้องใช้อุปกรณ์จริงหรือโปรแกรมจำลองที่ใช้ระดับ API 30 ขึ้นไป

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

• การแก้ไขสดจะรีเซ็ตสถานะของแอปในครั้งแรกที่คุณเปลี่ยนฟังก์ชัน Compose ใน ไฟล์ ซึ่งจะเกิดขึ้นหลังจากเปลี่ยนโค้ดครั้งแรกเท่านั้น โดยการเปลี่ยนแปลงโค้ดครั้งต่อๆ ไปที่คุณทำกับฟังก์ชัน Compose ในไฟล์นั้นจะไม่รีเซ็ตสถานะแอป

• ชั้นเรียนที่แก้ไขแบบสดอาจมีโทษด้านประสิทธิภาพบางอย่าง เรียกใช้แอปและใช้บิลด์ที่เผยแพร่ที่สะอาดหากคุณประเมินประสิทธิภาพ

• คุณต้องรันทั้งหมดเพื่อให้โปรแกรมแก้ไขข้อบกพร่องทำงานในคลาสที่คุณแก้ไขด้วยการแก้ไขสดได้

• แอปที่กำลังทำงานอาจขัดข้องเมื่อคุณแก้ไขด้วยการแก้ไขสด หากเกิดกรณีนี้ขึ้น คุณสามารถติดตั้งแอปอีกครั้งได้โดยใช้ปุ่มเรียกใช้

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

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

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

• การแก้ไขสดรองรับเฉพาะกระบวนการที่แก้ไขข้อบกพร่องได้

• การแก้ไขสดไม่รองรับโปรเจ็กต์ที่ใช้ค่าที่กำหนดเองสำหรับ moduleName ภายใต้ kotlinOptions ในการกำหนดค่าบิลด์

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

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

• ใช้การเปลี่ยนแปลง/ใช้การเปลี่ยนแปลงโค้ดใช้ร่วมกับการแก้ไขสดไม่ได้ และต้องรีสตาร์ทแอปที่กำลังทำงานอยู่

• ขณะนี้การแก้ไขสดไม่รองรับโปรเจ็กต์ Android Automotive

คำถามที่พบบ่อยเกี่ยวกับการแก้ไขสด

• ปัจจุบันการแก้ไขสดมีสถานะเป็นอย่างไร

  การแก้ไขสดพร้อมใช้งานใน Android Studio Giraffe หากต้องการเปิดใช้ ให้ไปที่ไฟล์ > การตั้งค่า > เอดิเตอร์ > การแก้ไขสด (Android Studio > การตั้งค่า > เอดิเตอร์ > การแก้ไขสดใน macOS)

• ฉันควรใช้การแก้ไขสดเมื่อใด

  ใช้การแก้ไขแบบสดเมื่อต้องการดูผลลัพธ์ของการอัปเดตองค์ประกอบ UX (เช่น การอัปเดตตัวแก้ไขและภาพเคลื่อนไหว) ต่อประสบการณ์การใช้งานแอปโดยรวมอย่างรวดเร็ว

• ฉันควรหลีกเลี่ยงการใช้การแก้ไขสดเมื่อใด

  การแก้ไขสดมุ่งเน้นไปที่การเปลี่ยนแปลงโค้ดที่เกี่ยวข้องกับ UI และ UX โดยไม่รองรับการเปลี่ยนแปลง เช่น การอัปเดตลายเซ็นของเมธอด การเพิ่มเมธอดใหม่ หรือการเปลี่ยนแปลงลำดับชั้นของคลาส ดูข้อมูลเพิ่มเติมได้ที่ข้อจำกัดของ Live Edit

• ฉันควรใช้ตัวอย่าง Compose เมื่อใด

  ใช้ตัวอย่างการเขียนเมื่อคุณกำลังพัฒนา Composable แต่ละรายการ การแสดงตัวอย่าง จะแสดงภาพองค์ประกอบ Compose และรีเฟรชโดยอัตโนมัติเพื่อแสดง ผลของการเปลี่ยนแปลงโค้ด นอกจากนี้ ตัวอย่างยังรองรับการดูองค์ประกอบ UI ภายใต้ การกำหนดค่าและสถานะต่างๆ เช่น ธีมมืด ภาษา และ การปรับขนาดแบบอักษร

การพัฒนาโค้ดแบบวนซ้ำด้วย Compose

การแก้ไขสดและการโหลดซ้ำด่วนสำหรับ Compose Multiplatform เป็นฟีเจอร์ที่ช่วยประหยัดเวลาและเพิ่มประสิทธิภาพการทำงานขณะพัฒนาด้วย Compose อย่างไรก็ตาม เครื่องมือเหล่านี้ตอบสนองความต้องการของการพัฒนาประเภทต่างๆ ดังนี้

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

• Compose Hot Reload ตอบโจทย์ความต้องการเดียวกัน แต่รองรับแอปพลิเคชันเดสก์ท็อปที่สร้างด้วย Compose Multiplatform ฟีเจอร์นี้ช่วยให้คุณ ทำการเปลี่ยนแปลงโค้ด UI ในแอปพลิเคชัน Compose Multiplatform และ ดูผลลัพธ์แบบเรียลไทม์ได้โดยการโหลดโค้ดซ้ำอย่างชาญฉลาดทุกครั้งที่มีการเปลี่ยนแปลง

แม้ว่าฟีเจอร์ทั้ง 2 จะใช้เทคโนโลยีหลายอย่างร่วมกันภายในเครื่องมือ Compose และรองรับกรณีการใช้งานที่คล้ายกันหลายอย่าง แต่ก็ไม่ได้มีความสามารถเหมือนกัน เนื่องจากใช้กับการพัฒนา Compose ประเภทต่างๆ

หากคุณกำลังพัฒนาแอป Android คุณควรใช้การแก้ไขสดเพื่อเร่งกระบวนการพัฒนา หากคุณกำลังพัฒนาแอปพลิเคชันเดสก์ท็อปโดยใช้ Compose Multiplatform คุณควรใช้ Compose Hot Reload

การแก้ไขสดของค่าคงที่ (เลิกใช้งานแล้ว)

Android Studio สามารถอัปเดตตัวอักษรคงที่บางตัวที่ใช้ใน Composable ภายในตัวอย่าง โปรแกรมจำลอง และอุปกรณ์จริงได้แบบเรียลไทม์ ประเภทที่รองรับมีดังนี้

• Int
• String
• Color
• Dp
• Boolean

คุณดูค่าคงที่สัญพจน์ที่ทริกเกอร์การอัปเดตแบบเรียลไทม์ได้โดยไม่ต้องมีขั้นตอนการคอมไพล์โดยการเปิดใช้การตกแต่งสัญพจน์ผ่านตัวบ่งชี้ UI ของการแก้ไขสดของสัญพจน์

ใช้การเปลี่ยนแปลง

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

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