สร้างแอปอ่านการ์ตูน
- 2. โดยเริ่มต้นให้ตั้งชื่อโปรเจคตามที่คุณต้องการครับ โดยผมตั้งว่า Comics และผมตั้งให้รองรับAPI เวอร์ชั่นต่่าที่สุดคือ Level 17 เมื่อติดตั้งเสร็จแล้วก็กด next และเลือก empty activity เป็นอันว่า สร้างโปรเจคเสร็จเรียบร้อยครับ
- 3. โดยสิ่งแรกที่ผมจะท่าคือตั้ง targetsdk เป็นเวอร์ชั่น 22 พอดียังไม่อยาก เขียนตัว permission แบบใหม่อ่าครับ ^^
- 4. ต่อมาเราก็ต้องท่าการก่าหนด ตัวViewPager ลงใน activity_main.xml โดยผมจะลบตัว padding และก็ตัว TextView ออกไปนะครับ
- 5. จะเห็นว่าตัว layout ของเราว่างเปล่าแบบนี้ เราจะท่าการครอบตัว ViewPager ลงไปและก็ก่าหนดให้มีขนาดกว้างเต็มหน้าจอเลยครับ
- 6. ต่อมาเราจะมาเพิ่ม Libraly ที่ชื่อ volley กันนะครับโดยการท่างานและ การใช้งานผมจะเขียนอธิบายทีหลังนะครับ เมื่อเพิ่มเรียบร้อยแล้วก็กด Sync Now ได้เลย (รอโหลดซักครู่)
- 7. ต่อมาเราต้องสร้าง layout ใหม่ โดยตั่งชื่อว่า image_content.xml โดยภายใน เราจะท่าการเพิ่มตัว NetworkImageView เพื่อใช้ในการ cache รูปภาพนั่นเอง(ความจริงใช่ imageview ก็ได้นะ)
- 8. ความสามารถหนึ่งของ volley ก็คือการ cache ภาพนั่นเอง
- 9. Cache คืออะไร Cache คือหน่วยความจ่าอย่างนึง มีความเร็วในการเข้าถึงและการ ถ่ายโอนข้อมูลที่สูง ซึ่งมีหน้าที่ในการเก็บข้อมูลที่เราต้องการจะใช้งาน บ่อยๆ เพื่อเวลาที่ CPU ต้องการใช้ข้อมูลนั้นๆ จะได้ค้นหาได้เร็ว โดยที่ ไม่จ่าเป็นที่จะต้องไปค้นหาจากข้อมูลทั้งหมด ซึ่งท่าให้เราสามารถเข้าถึงข้อมูลของเราได้รวดเร็วยิ่งขึ้น
- 10. Cache มี 2 แบบคือ 1.disk cache คือการเก็บข้อมูลไว้ในหน่วยความจ่าหลักของเราก่อน เมื่อ CPU ต้องการจะหาข้อมูล ก็จะหาใน dish cache ก่อนแล้วค่อยเข้าไปค้นหา ใน Harddisk 2.Memory cache จะดึงข้อมูลมาเก็บไว้ใน memory ซึ่งจะถึงขอ้มูลได้ รวดเร็วกว่า แต่มีความจ่าที่เล็กกว่า
- 11. เพราะฉะนั้นถ้า คอมพิวเตอร์เครื่องใดที่มี cache ความเร็วสูงก็จะเข้าถึงข้อมูลได้ ง่าย แต่อย่างไรก็ตามยิ่งขนาดใหญ่ก็เก็บข้อมูลได้เยอะ แต่การเข้าถึงจะช้ากว่า cache ที่มีขนาดเล็ก ระบบ Cache นอกจาก ใน computer แล้ว ระบบ Cache ยังเอามาใช้งานบน เว็บ ด้วย CMSส่วนใหญ่จะมีระบบ Cache เพื่อลดภาระการท่างานของฐานข้อมูล ลง ข้อมูลอ้างอิง http://x86club.fix.gs/index. php vaitaro.exteen.com
- 12. เราสร้าง viewpager เรียบร้อยแล้วใช่ไหมครับ สิ่งที่เราจะท่าก็คือน่ารูปภาพมาเรียงต่อกันแบบนี้ รูป1 รูป2 รูป3รูป3
- 13. เพราะฉะนั้นเราต้องมี adapter โดยเราจะสร้างclass MyAdapter และท่าการ Override method ดังนี้
- 14. ต่อมาเราจะรับค่า Context จาก Activity ที่เรียกใช้งาน Adapter กลับไปก่าหนด background เป็นสีแดงเมื่อ view ถูกเพิ่มจะได้รู้ class MyAdapter
- 15. ใช้ส่าหรับก่าหนด view ที่น่ามาแสดงใน adapter จ่านวนที่น่ามาแสดง ชนิดของview ท่าลายitem แต่ละอัน ต่อมาท่าการก่าหนด adapter เพื่อเรียกใช้งาน
- 16. โค้ดต็มๆ
- 17. ต่อมาเราจะมาท่าการเรียกใช้ Adapter ในclass MainActivity.java
- 18. หลังจากก่าหนด Adapter เรียบร้อยแล้วให้ลองกด Run ดูครับว่าได้ ผลลัพธ์ แบบนี้หรือป่าว ถ้าได้แสดงว่าคุณได้ไปต่อ ถ้าไม่ให้ลองกลับไป ดูโค้ดอีกทีนะครับ ว่าผิดตรงไหน
- 19. ต่อมาเราจะมาสร้าง class ส่าหรับการ cache รูป โดยก่อนอื่นเราจะสร้างแพ็กเกจ แยกกันก่อนนะครับ และก็ท่าการสร้าง class BitmapCache และท่าการ implements method โดยกด alt + enter(คลิกที่เส้นสีแดงก่อนนะครับ)
- 21. ลบออกด้วยนะ
- 23. ก่อนอื่นเราจะต้องทราบว่าแรมของผู้ใช้มีขนาดเท่าไหร่ เราจึงรับค่าแรม มาเก็บไว้ในตัวแปร maxMemory และน่ามา หาร8 ยกตัวอย่างแรม 1 G ก็จะได้ความจ่าcache 128 m
- 24. ต่อมาก็เป็น method ที่รับค่า URL ของรูปภาพ
- 25. เมื่อได้ตัว cache เรียบร้อยแล้วเราก็จะมาเขียน class โหลดข้อมูล โดยใช้ Volley โดยเราจะตั้งชื่อมันว่า AppController
- 28. เมื่อเราเขียนคลาสส่าหรับจัดการการดาวโหลดข้อมูลเรียบร้อยแล้วเราก็ มาก่าหนด permission ในการเข้าถึง Internet กันต่อเลย
- 29. โดย permission ตัวแรกที่เราจะขอก็คือการเข้าถึง internet ส่วนตัวที่ สองก็คือการเช็คสถานะการเชื่อมต่อ
- 30. ต่อมาก็มาเพิ่ม Appcontroller ในการท่างานส่วน subclass
- 35. และก็ท่าการโหลดข้อมูล โดยผมจะเขียน Log เพื่อแสดงผลการท่างาน ถ้าหากโหลดข้อมูลได้ก็จะแสดง Log response พร้อมข้อมูล ถ้า Error ก็จะแสดง Log Error พร้อม ข้อมูลerror
- 36. ถ้า Run แล้วได้ข้อมูลประมาณนี้แสดงว่าถูกต้องนะครับ แต่ถ้ามีerror ก็ลองดูนะครับว่ามัน error อะไรแล้วลองไป search google ดูนะครับ
- 37. เมื่อเราได้ข้อมูลมาแล้วเราก็ต้องท่าการแปลงข้อมูล และก็แยกข้อมูลแต่ ละอัน และก็ส่งไปให้class Adapter เพื่อน่าurl ไปset ก็เป็นอันเสร็จ สิ้นการท่างานครับ
- 38. โดยก่อนอื่นเรามาเพิ่ม ProgressBar เพื่อแสดงการโหลดข้อมูลก่อน ดีกว่า โดยเราจะสร้าง FramLayout และก็เอาเจ้า ProgressBar ไป ทับเจ้า ViewPager ซะก่อน
- 41. ต่อมาเราก็มาท่าการแยกข้อมูลนะครับแต่ข้อมูลของเรามีแค่ url อย่าง เดียวเราเลยไม่ต้องเขียนclass model โดยเราจะเอา url เก็บไว้ในตัว แปร Arraylis เลยนะครับ
- 42. ต่อมาเราก็มาท่าการแยกข้อมูลนะครับแต่ข้อมูลของเรามีแค่ url อย่าง เดียวเราเลยไม่ต้องเขียนclass model โดยเราจะเอา url เก็บไว้ในตัว แปร Arraylist เลยนะครับ
- 43. ต่อมาเราก็ท่าการโหลดข้อมูล และส่งข้อมูลไปให้ Adapter เละท่าการ ซ่อน ProgressBar