Gemini ใน Android Studio มีความพร้อมเป็นพิเศษที่จะช่วยให้คุณสร้างวิสัยทัศน์ด้าน UI ของแอป Android ให้เป็นจริงได้โดยใช้ Jetpack Compose และทำตามแนวทางปฏิบัติแนะนำของ Android หน้านี้อธิบายขั้นตอนทั่วไปในการสร้าง UI ของแอปด้วย Gemini ดูข้อมูลเพิ่มเติมเกี่ยวกับการแนบรูปภาพและไอเดียอื่นๆ เกี่ยวกับวิธี ใช้ฟีเจอร์นี้ได้ที่แนบรูปภาพไปกับคำค้นหา
หากต้องการสร้าง UI ด้วย Gemini ให้ทำตามขั้นตอนทั่วไปต่อไปนี้
สร้างภาพจำลอง UI ของแอปที่คุณต้องการ โครงร่างหรือการออกแบบพื้นฐาน จะดีที่สุด คุณสามารถส่งออก PNG จากเครื่องมือออกแบบหรือแม้แต่ใช้รูปภาพที่วาดด้วยมือ ก็ได้
รูปที่ 1: Wireframe ที่วาดด้วยมือของอินเทอร์เฟซผู้ใช้แอป แนบรูปภาพไปกับคำค้นหาโดยคลิกปุ่มแนบไฟล์รูปภาพ
ในช่องแชท ให้ขอให้ Gemini สร้างโค้ด UI เช่น "สร้างโค้ด Jetpack Compose สำหรับรูปภาพที่ระบุ" เมื่อคุณส่งคำค้นหาและรูปภาพ Gemini จะแนะนำโค้ดเพื่อสร้าง UI ที่เสนอ โดยปกติแล้ว Gemini จะ ให้โค้ดสำหรับ ตัวอย่าง Compose ด้วย คุณจึง เห็นภาพ UI ได้อย่างรวดเร็วเมื่อนำเข้าลงในโปรเจ็กต์ หากไม่เป็นเช่นนั้น ให้ขอให้ สร้างตัวอย่าง Compose
รูปที่ 2: Gemini สร้างโค้ด Jetpack Compose จากรูปภาพที่แนบมา เมื่อนำเข้าโค้ดและเห็นตัวอย่าง Compose ในแผงแสดงตัวอย่างแล้ว คุณจะทำซ้ำ UI ได้โดยคลิกที่ตัวอย่างโดยตรงและขอให้ Gemini เปลี่ยนรูปแบบ
รูปที่ 3: การใช้ Gemini เพื่อเปลี่ยนองค์ประกอบ UI โดยตรงจากตัวอย่าง Compose