Android

Firebase, Bài 2.2: Giới thiệu về Realtime Database.

Sau khi đã tích hợp Firebase Realtime Database vào dự án ứng dụng của bạn, thì bây giờ là lúc rất thích hợp để trải nghiệm sức mạnh của “Ngọn lửa”. Lần này, chúng ta sẽ làm một ứng dụng mang tính “social local mobile crowd-source” thể hiện thời tiết tại Thành phố Hồ Chí Minh, dựa trên các Value Events. Bài viết dựa trên bài hướng dẫn của anh David East, một kĩ sư cao cấp trụ cột của Firebase tại Google.

FirebaseRealtimeDatabase

Trước khi bắt tay vào thực hiện thì bạn cần phải tích hợp FirebaseFirebase Realtime Database vào dự án ứng dụng của bạn. Nếu bạn chưa tích hợp thì vui lòng mở các bài trước rồi quay lại đây để đọc và thực hiện tiếp. Còn nếu bạn đã thực hiện các công việc trước đó rồi thì bây giờ chúng ta sẽ triển thôi. Khác với các bài viết trước với các hướng dẫn được chia theo nền tảng, các hướng dẫn trong bài này sẽ đi theo trình tự viết code theo ý tưởng và hướng dẫn đồng loạt trên cả Android, iOS và Web.

Ý tưởng chung là bạn sẽ viết một ứng dụng chứa 2 Buttons, bao gồm 1 Button “Mưa” (Rainy)1 Button “Nắng” (Sunny), và 1 Text để thể hiện Thời tiết hiện tại, tức là hoặc “Mưa” hoặc “Nắng” theo nội dung của 2 Buttons kia. Đối với Android thì đó sẽ là 2 Buttons và 1 TextView và đừng quên yêu cầu quyền INTERNET, iOS là 2 UIButtons và 1 UILabel và đừng quên cấu hình FIRApp.configure() trong application:didFinishLaunchingWithOptions, còn Web thì chỉ đơn giản là 2 Buttons và 1 Thẻ <p> hoặc <h2> hay <pre> là tùy bạn vì thẻ nào cũng như nhau cả, miễn là nó hiển thị đúng nội dung là được. Lưu ý là bạn nên bật Firebase Console lên để thấy được hoạt động cập nhật cũng như dễ bề quản lí dữ liệu. Nếu có thể thì bạn nên bật nhiều thiết bị cùng lúc để thấy rõ hơn sự “realtime” của Firebase Realtime Database.

Tôi quy ước, 2 Buttons “Mưa” và “Nắng” sẽ được đặt tên là mRainy và mSunny, TextView chỉ thời tiết sẽ có tên là mCondition đối với Android. Đối với iOS, UILabel chỉ thời tiết sẽ là conditionLabel và 2 hàm sự kiện cho 2 Buttons sẽ là rainyDidTouch và sunnyDidTouch, còn đối với Web, tôi sẽ dùng các biến var rainy, sunny và condition. Rồi, xong phần quy ước chung rồi, ta sẽ tiến hành kết nối giữa phần logic và interface. Đối với Android, ta sẽ khai báo 3 field members đã nói và gọi hàm findViewById(int id) rất đỗi quen thuộc. Đối với iOS thì thao tác kéo thả như thường lệ và gán tên hàm như trên quy ước là điều bạn sẽ phải làm. Đối với Web, document.getElementById(String id) “thần thánh” là điều hiển nhiên mà bạn cần thực hiện.

Tốt rồi, bạn đã thực hiện ánh xạ từ interface qua logic, và giờ là lúc triển khai phần logic. Sau khi đã khởi tạo các instance về Firebase/FirebaseDatabase như trong bài trước (myRef hoặc ref), đã trỏ tới đúng vị trí cần thiết, thì ta sẽ tiến hành lắng nghe và cập nhật dữ liệu. Ý tưởng chung là khi bạn nhấn một trong hai Buttons “Mưa” hoặc “Nắng” thì ứng dụng sẽ gửi dữ liệu lên Firebase Database, Firebase Database sẽ nhận thấy có thay đổi và tiến hành cập nhật dữ liệu trên đó, xong xuôi thì Firebase Database sẽ trả kết quả mới về (các) thiết bị cùng lắng nghe CSDL đó để chúng tiến hành cập nhật phần Text hiển thị Thời tiết.

Đây là code của Android. Lưu ý là myRef được định nghĩa như trong bài trước. Bạn có thể đặt chúng trong onCreate hay onStart là tùy bạn, cá nhân tôi thích để trong onStart hơn.

Còn đây là code của iOS. Lưu ý là ref được định nghĩa như trong bài trước, và tốt hơn hết là bạn cho ref.observe(…) trong viewDidAppear thay cho viewDidLoad.

Với Web thì bạn sẽ sử dụng code dưới đây. Và như trên, thì ref cũng được định nghĩa như trong bài trước.

Xong xuôi, bạn hãy cho chạy thử đi. Rất hi vọng bạn đã nắm vững được Firebase Database Value Events. Trong bài tiếp theo, tôi sẽ giới thiệu về các Child Events. Hẹn gặp lại các bạn sau.

2 thoughts on “Firebase, Bài 2.2: Giới thiệu về Realtime Database.”

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.