ใน Flutter คุณสามารถแปลง a Canvas
เป็นรูปภาพโดยใช้ toImage()
เมธอดจาก ui.Image
คลาส คลาส นี้ Canvas
อนุญาตให้คุณวาดกราฟิกและรูปร่างบนวิดเจ็ตที่กำหนดเองหรือระหว่างขั้นตอนการระบายสีของวิดเจ็ CustomPainter
ต เมื่อคุณวาดทุกอย่างบน canvas, คุณสามารถแปลงเป็นภาพโดยใช้ toImage()
เมธอด
ต่อไปนี้เป็นคำแนะนำทีละขั้นตอนเกี่ยวกับวิธีแปลง a Canvas
เป็นรูปภาพใน Flutter:
นำเข้าแพ็คเกจที่จำเป็น
สร้างวิดเจ็ตแบบกำหนดเองหรือ CustomPainter
ตำแหน่งที่คุณจะวาดบน canvas
สร้างฟังก์ชันเพื่อแปลง the canvas เป็นรูปภาพ
เรียกใช้ captureCanvasToImage()
ฟังก์ชันและจัดการกับรูปภาพ
ในตัวอย่างนี้ เราสร้างวิดเจ็ตแบบกำหนดเองชื่อ ซึ่ง MyCanvasWidget
วาดวงกลมสีแดงที่กึ่งกลางของ canvas ฟังก์ชัน captureCanvasToImage()
สร้าง Canvas
, วาดโดยใช้วิดเจ็ตแบบกำหนดเองหรือ CustomPainter
, จากนั้นแปลงเป็น ui.Image
.
โปรดทราบว่า canvas ควรตั้งค่าขนาดทั้งในวิดเจ็ตแบบกำหนดเอง( MyCanvasWidget
) และ toImage()
เมธอด เพื่อให้แน่ใจว่าภาพวาดและรูปภาพมีขนาดที่ถูกต้อง ในตัวอย่างนี้ เรากำหนด canvas ขนาดเป็น 200x200 แต่คุณสามารถปรับให้เป็นขนาดที่ต้องการได้
อย่าลืมจัดการกับข้อผิดพลาดและรอการดำเนินการแบบอะซิงโครนัสอย่างถูกต้องเมื่อทำงานกับฟังก์ชัน Futures และ async นอกจากนี้ ตรวจสอบให้แน่ใจว่าได้โทรหา _convertCanvasToImage()
เมื่อเหมาะสมเพื่อจับภาพ canvas และรับภาพ