Jetpack Compose Academy · บทเรียน

สิ่งที่ Compose มาแทนที่: ลาก่อน XML

เหตุใดส่วนติดต่อผู้ใช้แบบประกาศจึงดีกว่าการสร้างมุมมองแบบคำสั่ง

บทเรียน 1 จาก 413 ขั้นตอน

สิ่งที่ Compose มาแทนที่: ลาก่อน XML เป็นบทเรียน Jetpack Compose Academy ฟรีบน CoddyKit นี่คือบทเรียนที่ 1 จากทั้งหมด 4 บทเรียน คุณสามารถอ่านบทเรียนทั้งหมดด้านล่างฟรี — จากนั้นลองปฏิบัติด้วยตัวคุณเองในเบราว์เซอร์พร้อมตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7 บทเรียนนี้เป็นส่วนหนึ่งของเส้นทางการเรียน Jetpack Compose Academy และความก้าวหน้าของคุณจะซิงค์ข้ามเว็บและแอป CoddyKit คอร์ส Jetpack Compose Academy มีบทเรียนทั้งหมด 4 บทเรียน

ทำความรู้จัก Jetpack Compose

Jetpack Compose คือชุดเครื่องมือสมัยใหม่ของ Android สำหรับสร้างส่วนติดต่อผู้ใช้ด้วย Kotlin ล้วน ๆ ไม่ต้องใช้ไฟล์เค้าโครง XML อีกต่อไป คุณอธิบายหน้าจอด้วยฟังก์ชันง่าย ๆ ได้เลย 🎉

วิธีแบบเดิม: เค้าโครง XML

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

<LinearLayout android:orientation="vertical">
    <TextView android:text="Hello" />
</LinearLayout>

สองไฟล์ หนึ่งหน้าจอ

ส่วนที่ยุ่งยากคือการแยกส่วน: เค้าโครงอยู่ใน XML ส่วนการทำงานอยู่ใน Kotlin คุณต้องคอยทำให้ทั้งสองส่วนสอดคล้องกันด้วยตนเอง และ findViewById เป็นตัวเชื่อมทั้งสองเข้าด้วยกัน

แบบคำสั่งกับแบบประกาศ

มุมมองแบบเดิมเป็นแบบคำสั่ง: คุณค้นหาวิดเจ็ตแล้วเปลี่ยนแปลงทีละขั้น เช่น textView.text = name คุณต้องบอกส่วนติดต่อผู้ใช้อย่างละเอียดว่าจะเปลี่ยนแปลงอย่างไร

อธิบายแทนการเปลี่ยนแปลงโดยตรง

Compose เป็นแบบประกาศ: คุณอธิบายว่าหน้าจอควรมีหน้าตาอย่างไรสำหรับข้อมูลปัจจุบัน แล้วเฟรมเวิร์กจะคำนวณการเปลี่ยนแปลงให้เอง

Text("Hello, " + name)

ส่วนติดต่อผู้ใช้เป็นฟังก์ชันของสถานะ

แนวคิดหลักคือ ส่วนติดต่อผู้ใช้เป็นฟังก์ชันของสถานะ เมื่อส่งข้อมูลให้ Compose ระบบจะวาดหน้าจอให้ เมื่อข้อมูลเปลี่ยน ระบบจะวาดเฉพาะส่วนที่แตกต่างใหม่

บอกลา findViewById

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

โค้ดน้อยลง ใช้ภาษาเดียว

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

การจัดองค์ประกอบใหม่ทำให้ส่วนติดต่อผู้ใช้เป็นปัจจุบัน

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

Compose คืออนาคตของ Google

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

พลังเท่าเดิม ความยุ่งยากน้อยลง

คุณไม่ได้สูญเสียอะไรไป Compose ยังคงมี Material Design แอนิเมชัน และรายการต่าง ๆ ให้ใช้ เพียงตัดความยุ่งยากจาก XML ที่เคยทำให้ทุกอย่างช้าลงออกไป

ตรวจสอบความเข้าใจอย่างรวดเร็ว

มาทบทวนการเปลี่ยนแปลงครั้งใหญ่จากรูปแบบส่วนติดต่อผู้ใช้ Android แบบเดิมกัน

สรุป: ทำไมต้อง Compose

คุณได้เห็นแล้วว่าเหตุใด Compose จึงเหนือกว่า: ใช้ Kotlin ล้วน ส่วนติดต่อผู้ใช้แบบประกาศ ไม่ต้องใช้ XML และไม่ต้องใช้ findViewById เพียงอธิบายหน้าจอตามข้อมูลของคุณ แล้วปล่อยให้การจัดองค์ประกอบใหม่ดูแลให้หน้าจอเป็นปัจจุบัน

เริ่มต้นได้ฟรี

เรียนรู้ Kotlin ด้วย AI tutor — ฟรี

เขียนและเรียกใช้โค้ดจริงในเบราว์เซอร์ของคุณ รับความช่วยเหลือทันทีจาก AI tutor 24/7 และเรียนรู้ต่อจากที่คุณหยุดบนเว็บหรือในแอป

คอร์ส
30
บทเรียน
120

คำถามที่พบบ่อย

บทเรียน “สิ่งที่ Compose มาแทนที่: ลาก่อน XML” ฟรีหรือไม่

ใช่ — ข้อความเต็มของ “สิ่งที่ Compose มาแทนที่: ลาก่อน XML” ฟรีให้อ่านที่นี่บนเว็บ เพื่อปฏิบัติแบบโต้ตอบ (ตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7) และปลดล็อคส่วนที่เหลือของคอร์ส Jetpack Compose Academy ให้อัปเกรดเป็น CoddyKit PRO คอร์ส Jetpack Compose Academy มีบทเรียนทั้งหมด 4 บทเรียน

คุณจะเรียนรู้อะไรในบทเรียน “สิ่งที่ Compose มาแทนที่: ลาก่อน XML”

เหตุใดส่วนติดต่อผู้ใช้แบบประกาศจึงดีกว่าการสร้างมุมมองแบบคำสั่ง คุณปฏิบัติ Jetpack Compose Academy ด้วยโค้ดที่ใช้งานได้จริงที่คุณเรียกใช้โดยตรงในเบราว์เซอร์ และติวเตอร์ AI ตลอด 24/7 ตอบคำถามของคุณขณะที่คุณไปผ่านบทเรียน

คุณต้องมีประสบการณ์ก่อนที่จะเริ่มเรียน Jetpack Compose Academy หรือไม่

ไม่จำเป็นต้องมีประสบการณ์มาก่อน Jetpack Compose Academy บน CoddyKit ออกแบบมาสำหรับผู้เริ่มต้นไปจนถึงผู้เรียนขั้นสูง คุณสามารถเริ่มต้นที่นี่หรือเริ่มจากตัวแรกและเรียนด้วยความเร็วของคุณเอง นี่คือบทเรียนที่ 1 จากทั้งหมด 4 บทเรียน

บทเรียน “สิ่งที่ Compose มาแทนที่: ลาก่อน XML” ใช้เวลานานแค่ไหน

บทเรียน CoddyKit ส่วนใหญ่ใช้เวลาประมาณ 5–10 นาที แต่ละบทเรียนจึงสั้นและเป็นแบบโต้ตอบ คุณสามารถก้าวหน้าอย่างต่อเนื่องและกลับมาเรียนต่อจากตรงที่เพิ่งหยุดบนเว็บและแอปได้เลย

ฉันเขียนและรันโค้ดในบทเรียน Jetpack Compose Academy นี้ได้ไหม

ได้ บทเรียน Jetpack Compose Academy ทุกบทมีตัวแก้ไขโค้ดในตัว คุณจึงเขียนและรันโค้ดจริงได้เลยในเบราว์เซอร์ และได้รับข้อเสนอแนะจาก AI ในทันที — ไม่ต้องติดตั้งในเครื่องของคุณ

บทเรียนทั้งหมดในหลักสูตรนี้

  1. สิ่งที่ Compose มาแทนที่: ลาก่อน XML
  2. ตั้งค่า Android Studio สำหรับ Compose
  3. กายวิภาคของฟังก์ชัน @Composable
  4. เรียกใช้แอปแรกบนโปรแกรมจำลอง
← กลับไปที่ Jetpack Compose Academy