Print
Details: Category: บทความ Flutter | Published: 09 December 2019 | Hits: 2445

โจทย์ เป็นอย่างนี่ครับ เรามี ข้อมูล มากๆๆๆ แบบตัวอย่าง 

https://jsonplaceholder.typicode.com/photos

 

Screen Shot 2562 11 24 at 071504

มาสเตอร์ มี Data ประมาญ 5000 record ครับ ต้องการ เอาออกมาทำ ListView บน Flutter ทั้งหมด แต่รอให้โหลดเสร็จทั้ง 5000 แล้วค่อยแสดง คงไม่ดีแน่ๆ แล้วจะทำอย่างไร ?

Screen Shot 2562 11 24 at 064919

มาสเตอร์​จะไห้ ListView ของมาสเตอร์ โหลดมาที่ละ 6 และถ้า มาสเตอร์ เลือนไปท้ายสุด ให้โหลดเพิ่มทีละ 2 ครับ

 Screen Shot 2562 11 24 at 064924

 กำหนด amountListView ที่จะแสดงครั้งแรก และ กำหนด scrollController ให้ position มีค่า maxScrollExtent (หมายถึง Scroll มาที่ ท้าย) จะเพิ่มค่าของ amountListView

Screen Shot 2562 11 24 at 065015

ส่วนของการอ่านข้อมูล ที่ เป็น Thread จาก Json ยังเหมือนเดิม

Screen Shot 2562 11 24 at 065039

ส่วนของการสร้าง ListView ครับ มีการกำหนด ที่ build ด้วยว่า ถ้า ยังไม่โหลดอะไร ? (ดูจากขนาดของ Array เป็น ศูนย์ไหม ? ให้ แสดง Circular Progress Indicator ด้วย)

Screen Shot 2562 11 24 at 064924

ลองทำดูครับ ไม่ยาก นี่เป็นหัวข้อส่วนหนึ่ง ที่ น้องๆ ที่มาเรียน คอร์ส เขียนแอพ Android และ iOS ด้วย Flutter เลือกหัวข้อเรียนกันเอง ได้ สอนตัวต่อตัวด้วย สนใจ คอร์สแบบนี่ ยินดีต้อนรับ นะครับ 

ดูเพิ่มเติมที่

https://www.androidthai.in.th/private-project-android-flutter-course.html