แนบรูปภาพไปกับการค้นหา

แนบรูปภาพไปกับคำค้นหาเพื่อให้ Gemini ใน Android Studio เข้าใจสถาปัตยกรรมของแอปได้ดียิ่งขึ้น และเร่งกระบวนการพัฒนา UI

หากต้องการแนบรูปภาพกับพรอมต์ ให้คลิกแนบไฟล์รูปภาพ ไอคอนแนบไฟล์รูปภาพ แล้วอัปโหลดรูปภาพ

ตัวอย่างวิธีที่ Gemini ช่วยคุณจัดการรูปภาพได้มีดังนี้

  • หากคุณมีภาพจำลองของ UI ที่ต้องการ Gemini สามารถให้โค้ดที่สร้าง UI นั้นได้ เช่น หากคุณส่งภาพหน้าจอของแอป Now in Android ให้ Gemini ดู Gemini จะให้โค้ด Compose เพื่อ สร้างแอปดังกล่าวได้ ตัวอย่างนี้แสดงภาพหน้าจอของฟีดแอป (ซ้าย) และโค้ด Jetpack Compose ที่ Gemini สร้างขึ้น (ขวา) สำหรับ UI นั้น ดูข้อมูลเพิ่มเติมได้ที่สร้าง UI ด้วยไฟล์แนบรูปภาพ

    แอป "Now in Android" แสดงฟีดบทความพร้อมชื่อ หัวข้อ และไอคอนบุ๊กมาร์ก คำตอบที่เป็นโค้ดของ Gemini แสดงโค้ด Jetpack Compose ที่สร้าง UI ใหม่จากภาพหน้าจอ "มีอะไรใหม่ใน Android"
    Gemini สร้างโค้ด Jetpack Compose จากภาพหน้าจอ UI ของแอป Now in Android
  • หากต้องการทราบวิธีสร้างแอป Gemini สามารถอธิบายวิธีการทำงานของ UI ในแง่ของส่วนประกอบต่างๆ ได้ ตัวอย่างเช่น คุณขอให้ Gemini อธิบาย Composable และการไหลของข้อมูลเบื้องหลังภาพหน้าจอ Now in Android อีกภาพหนึ่งได้ รูปภาพทางซ้ายแสดงหน้าจอรายละเอียดที่มีรายการข่าว และรูปภาพทางขวาแสดงคำอธิบายของ Gemini เกี่ยวกับโครงสร้าง Compose และการไหลของข้อมูลสำหรับหน้าจอนั้น

    รายละเอียดบทความข่าวเดียวในแอป "Now in Android" ซึ่งแสดงชื่อ ผู้เขียน และคำอธิบาย คำอธิบายของ Gemini เกี่ยวกับ Composable และโฟลว์ข้อมูลของ Jetpack Compose สำหรับหน้าจอรายละเอียดบทความข่าว
    Gemini อธิบายองค์ประกอบ UI และการไหลของข้อมูลของหน้าจอแอปที่เฉพาะเจาะจง
  • หากคุณมีไดอะแกรมสถาปัตยกรรมของแอป Gemini จะแนะนำโค้ดเพื่อสร้างแอปตามไดอะแกรมได้ ซึ่งจะทำหน้าที่เป็นผู้ช่วยในการพัฒนาแบบฟูลสแตก นอกจากนี้ Gemini ยังช่วยบันทึกไดอะแกรมและอธิบายโครงสร้างของแอปได้ด้วย ซึ่งจะเป็นประโยชน์เมื่อเขียนเอกสารการออกแบบเพื่อให้เพื่อนร่วมทีมตรวจสอบ ตัวอย่างเช่น รูปภาพต่อไปนี้แสดงแผนภาพสถาปัตยกรรมแบบย่อ ซึ่งแสดงถึงการไหลของข้อมูลระหว่างคอมโพเนนต์ต่างๆ ของแอป เช่น UI, ViewModel, Repository และ Data Source

    แผนภาพสถาปัตยกรรมแอปแบบย่อที่แสดงคอมโพเนนต์ UI, ViewModel, Repository และ Data Source พร้อมลูกศรที่ระบุการไหลของข้อมูล
    Gemini สามารถสร้างโค้ดและเอกสารจากไดอะแกรมสถาปัตยกรรมของแอปได้
  • หากพบข้อบกพร่องใน UI ให้จับภาพหน้าจอแล้วขอให้ Gemini ระดมสมองเพื่อหา วิธีแก้ คุณช่วยชี้ให้เห็นสิ่งที่ผิดพลาดได้โดยวงกลมบริเวณที่มี ข้อผิดพลาด ตัวอย่างต่อไปนี้แสดงภาพหน้าจอของแอปบนอุปกรณ์เคลื่อนที่ที่มีวงกลมสีแดงไฮไลต์องค์ประกอบ UI ที่ไม่สอดคล้องกัน

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