Screen Shot 2558-08-31 at 5.31.23 PM
ช่วงหลังมานี้ Android มันมี library ต่าง ๆ ออกมาเยอะเหลือเกิน
หนึ่งในนั้นคือ Data Binding
ดังนั้น เรามาดูกันหน่อยว่า มันมีประโยชน์อะไร ?
และใช้งานอย่างไรกัน ?

Data Binding Library คืออะไร

คือการ binding data model เข้ากับ User Interface (UI) เลย
งงไปกันใหญ่เลย !!

พูดง่าย ๆ คือ

  • ทำการผูก หรือ binding ข้อมูลเข้ากับ UI หรือ presentation layer ได้เลย เช่น TextView และ EditText เป็นต้น
  • เมื่อข้อมูลมีการเปลี่ยนแปลงแล้ว จะทำการ update ข้อมูลของ UI ให้เองแบบอัตโนมัติเลย ง่ายไหมล่ะ

แล้วปกติเราทำอย่างไร เมื่อข้อมูลเปลี่ยนแปลง ?

เมื่อข้อมูลมีเปลี่ยนแปลง สิ่งที่ต้องทำคือ
การ update ค่าบน UI ไงล่ะ ทำดังนี้

  1. ในส่วนของข้อมูลนั้น ๆ ก็ต้องมีการดักจับเหตุการณ์ต่าง ๆ ไว้ เช่นการใช้งาน Listener เป็นต้น
  2. เมื่อมีการเปลี่ยนแปลง ทำการแจ้งไปยังส่วนของ UI ว่าข้อมูลเปลี่ยนแปลงแล้ว
  3. จากนั้นในส่วนของ UI ก็จะ update ข้อมูลตัวเอง

โดย code ในส่วนของ UI หรือ Activity ก็ต้องใช้พวก findViewById( id )
เช่น

ซึ่งจาก code จะเห็นว่าเราต้องทำแบบนี้ทุกครั้ง ทุกหน้าเลย
มันน่าเบื่อมาก รวมทั้งการดักจับการเปลี่ยนแปลงตามเหตุการณ์ต่าง ๆ อีก
ดังนั้นมาใช้ Data Binding กันเถอะ !!

ขั้นตอนการใช้งาน Data Binding Library เป็นอย่างไร ?

สิ่งที่คุณต้องมี ประกอบไปด้วย

  • Android plugin for Gradle 1.3.0-beta4 ขึ้นไป ส่วนผมใช้ 1.4.0 beta 1
  • Android Studio 1.3 ขึ้นไป ส่วนผมใช้ 1.4 beta

1. เพิ่ม library หรือ dependency ของ Data binding ในไฟล์ build.gradle ของ project

2.ไฟล์ build.grade ของ application/module ก็ใช้งาน plugin databinding ซะ

3. เมื่อทุกอย่างเรียบร้อย ได้เวลาเริ่มใช้งาน Data binding แล้ว

โดยมีขั้นตอนการใช้งานแบบง่าย ๆ 4 ขั้นตอน ดังนี้

ขั้นตอนที่ 1 เตรียม Data model
ตัวอย่างที่ใช้งาน Data model คือ User
ทำการเก็บข้อมูล firstname และ lastname
มี code ดังนี้

ขั้นตอนที่ 2 เตรียม Layout สำหรับแสดงข้อมูลผู้ใช้งาน
ทำการเพิ่มการ binding ข้อมูลเข้ากับ UI ในไฟล์ layout เลย
โดยสิ่งที่น่าสนใจ คือ

  • ทั้งไฟล์ layout จะครอบด้วย tag ชื่อว่า layout มันเหมือนใน AngularJS หรือเปล่านะ ?
  • กำหนดชนิดของ Data model และ ชื่อตัวแปร ที่จะนำมาผูกเข้ากับ UI
  • ในการผูกข้อมูลเข้ากับ UI มีรูปแบบคือ @{name.property}

ดังนี้

ขั้นตอนที่ 3 ทำการ Make project ซะ (ห้ามลืมโดยเด็ดขาด !!)
ให้ไปที่เมนู Build -> Make Project
แล้วจะทำการสร้างไฟล์ชื่อว่า ActivityMainBinding.java ขึ้นมา
สำหรับ MainActivity นะครับ

แสดงดังรูป

Screen Shot 2558-08-31 at 5.03.27 PM

ขั้นตอนที่ 4 ทำการ Binding ระหว่าง UI เข้ากับข้อมูลซะเลย (Model + View)

เมื่อทุกอย่างเรียบร้อย ก็ run สิ รออะไร …
ผลการทำงานเป็นดังรูป

รูปที่ 1 แสดงค่า default
device-2015-08-31-172428

รูปที่ 2 เมื่อทำการกดปุ่ม Update data
จะทำการแก้ไข User เท่านั้นแหละ ข้อมูลที่ UI ก็เปลี่ยนตาม
device-2015-08-31-172453

ง่ายไหมล่ะ ?
ถ้าใครเคยใช้ง่าย library พวก Injection framework มาก่อน น่าจะเข้าใจง่ายขึ้น เช่น

  • Butterknife
  • RecycleView
  • AnnotatedAdapter

แต่มาในตอนนี้ทางทีมพัฒนา Android ได้นำความสามารถเหล่านั้นมาใส่ให้แล้ว
จะช้าอยู่ทำไมล่ะ ลองเลยครับ …

ส่วน code ตัวอย่างอยู่ที่ Github::Up1:Demo Data Binding

สามารถอ่านเพิ่มเติมได้ที่นี่ Guide for Android Data Binding ซึ่งมีรายละเอียดเยอะมากมาย

ปล.
ตอนนี้ Data binding มัน version RC-01 แล้วนะ ( ยังไม่ stable ก็ระวังกันหน่อยนะครับ )
รวมทั้ง Android Studio 1.4 beta มันยังไม่ stable เช่นกัน

เช่น การ refresh project หลังจากทำการ make หรือ build เป็นต้น
ต้องทำการปิด และ เปิด ขึ้นมาใหม่

แต่สิ่งที่ทำได้ดีของ Android Studio 1.4 คือ ความเร็วในการทำงานนั่นเอง
ซึ่งเป็นผลมาจาก Gradle 1.4.0 beta นั่นเอง

ยังไม่พอนะ
มีการพูดคุยเรื่อง โครงสร้างของระบบงานด้วยว่า
อาจจะต้องเปลี่ยนจาก MVP ที่มี Presenter
ไปเป็น MVVM ที่มี ViewModel มาแทน !!
ซึ่งเป็นหัวข้อที่น่าสนใจมาก …