ดาวน์โหลดและติดตั้ง Android Studio เพื่อรับประสบการณ์การพัฒนาที่ดีที่สุดด้วย Compose ซึ่งรวมถึงฟีเจอร์ตัวแก้ไขอัจฉริยะมากมาย เช่น เทมเพลตโปรเจ็กต์ใหม่และความสามารถในการแสดงตัวอย่าง UI และภาพเคลื่อนไหวของ Compose ได้ทันที
ทำตามวิธีการต่อไปนี้เพื่อสร้างโปรเจ็กต์แอป Compose ใหม่ ตั้งค่า Compose สำหรับโปรเจ็กต์แอปที่มีอยู่ หรือนำเข้าแอปตัวอย่างที่เขียนใน Compose
Android CLI
ดาวน์โหลด Android CLIAndroid CLI สำหรับโปรเจ็กต์แอป Compose ใหม่
เช่น ใช้คำสั่ง
android create เมื่อต้องการสร้างโปรเจ็กต์แอป Compose ใหม่android create empty-activity --name=MyAppสร้างแอปใหม่ที่รองรับ Compose
หากต้องการเริ่มโปรเจ็กต์ใหม่ที่รวมการรองรับ Compose โดยค่าเริ่มต้น Android Studio จะมีเทมเพลตโปรเจ็กต์ต่างๆ เพื่อช่วยให้คุณเริ่มต้นใช้งานได้ หากต้องการสร้างโปรเจ็กต์ใหม่ที่มีการตั้งค่า Compose อย่างถูกต้อง ให้ทำดังนี้
- หากอยู่ในหน้าต่าง Welcome to Android Studio ให้คลิก Start a new Android Studio project หากมีโปรเจ็กต์ Android Studio เปิดอยู่แล้ว ให้เลือก File > New > New Project จากแถบเมนู
- ในหน้าต่างเลือกเทมเพลตโปรเจ็กต์ ให้เลือกกิจกรรมว่างเปล่า แล้วคลิกถัดไป
- ในหน้าต่าง Configure your project ให้ทำดังนี้
- ตั้งค่าชื่อ ชื่อแพ็กเกจ และตำแหน่งที่บันทึกตามปกติ โปรดทราบว่าในเมนูแบบเลื่อนลงภาษา Kotlin เป็นตัวเลือกเดียวที่ใช้ได้เนื่องจาก Jetpack Compose ใช้ได้กับคลาสที่เขียนด้วย Kotlin เท่านั้น
- ในเมนูแบบเลื่อนลงระดับ API ขั้นต่ำ ให้เลือกระดับ API 21 ขึ้นไป
- คลิกเสร็จสิ้น
ตอนนี้คุณพร้อมที่จะเริ่มพัฒนาแอปโดยใช้ Jetpack Compose แล้ว หากต้องการเริ่มต้นใช้งานและดูข้อมูลเกี่ยวกับสิ่งที่คุณทำได้ด้วยชุดเครื่องมือนี้ ให้ลองดูบทแนะนำ Jetpack Compose
ตั้งค่าทรัพยากร Dependency ของ Compose และคอมไพเลอร์
ดูตั้งค่าทรัพยากร Dependency ของ Compose และคอมไพเลอร์
ลองใช้แอปตัวอย่างของ Jetpack Compose
วิธีที่เร็วที่สุดในการทดสอบความสามารถของ Jetpack Compose คือการลองใช้แอปตัวอย่าง Jetpack Compose ที่โฮสต์ใน GitHub หากต้องการนำเข้าโปรเจ็กต์แอปตัวอย่างจาก Android Studio ให้ทำดังนี้
- หากอยู่ในหน้าต่าง Welcome to Android Studio ให้เลือก นำเข้าตัวอย่างโค้ด Android หากมีโปรเจ็กต์ Android Studio เปิดอยู่แล้ว ให้เลือก File > New > Import Sample จากแถบเมนู
- ในแถบค้นหาใกล้กับด้านบนของวิซาร์ดเรียกดูตัวอย่าง ให้พิมพ์ "compose"
- เลือกแอปตัวอย่าง Jetpack Compose รายการใดรายการหนึ่งจากผลการค้นหา แล้วคลิกถัดไป
- เปลี่ยนชื่อแอปพลิเคชันและตำแหน่งโปรเจ็กต์ หรือคงค่าเริ่มต้นไว้
- คลิกเสร็จสิ้น
Android Studio จะดาวน์โหลดแอปตัวอย่างไปยังเส้นทางที่คุณระบุและเปิดโปรเจ็กต์ จากนั้นคุณสามารถตรวจสอบ MainActivity.kt ในแต่ละตัวอย่างเพื่อดู Jetpack Compose API เช่น ภาพเคลื่อนไหวแบบครอสเฟด, คอมโพเนนต์ที่กำหนดเอง, การใช้ตัวพิมพ์ และการแสดงสีอ่อนและสีเข้มในตัวอย่างใน IDE
หากต้องการใช้ Jetpack Compose สำหรับ Wear OS โปรดดูตั้งค่า Jetpack Compose ใน Wear OS
แนะนำสำหรับคุณ
- หมายเหตุ: ข้อความลิงก์จะแสดงเมื่อ JavaScript ปิดอยู่
- ภาพรวมการนำทาง
- การทดสอบเลย์เอาต์ Compose
- รีแอ็กต่อโฟกัส