How to load limited items from Firebase into ListView

If your Firebase database contains lots of items and you wish to load only limited items from it, so that it loads faster, then you can make use of Firebase Query.

To load limited items from Firebase database, follow the steps given below.

1. Add a ListView listview1 and a TextView textview1 in VIEW area.


2. Create a CustomView custom.xml. This should contain as many TextViews as data to be displayed at each position (let them be textview1, textview2, textview3).

3. Select custom.xml as the CustomView of listview1.

4. Add a FirebaseDB component specific to the firebase path you have in your database.
I have added FirebaseDB component Chat: chat where chat is the path in firebase database, and Chat is a DatabaseReference to created in the app to the Firebase path chat.


5. Add a new number variable limit.

6. Add a String list str and a Map list map1.

7. In onCreate event:
a. Set the number variable limit to 6 (or to the number of items you want to load from Firebase).

b. Then use an add source directly block and use following code:
query = Chat.limitToLast((int)limit);
query.addValueEventListener(valueEventListener1);

Note that here Chat is my FirebaseDB component name. Change it to your FirebaseDB component.

This code will query for the last (limit) items in FirebaseDB Chat. Here the number variable limit has been set to 6 so it will query for last 6 items.

c. At the END of onCreate, close onCreate, declare query and define valueEventListener1 by using following code in add source directly block:

}
com.google.firebase.database.Query query;

ValueEventListener valueEventListener1 = new ValueEventListener() {
@Override public void onDataChange(DataSnapshot _param1) {
try {
str.clear();
map1.clear();
GenericTypeIndicator < HashMap< String, Object>> _ind = new GenericTypeIndicator<HashMap< String, Object>>() {};

for (DataSnapshot _data : _param1.getChildren()) {
str.add(_data.getKey());
HashMap <String, Object> _map= _data.getValue(_ind);
map1.add(_map); }

Note that here str is name of the String list and map1 is name of the Map list I added earlier.

This code takes a snapshot of the results of Firebase Query, and adds all keys in the snapshot to String list, and adds values at each key to the Map list.

e. After this add the blocks:
ListView setListCustomViewData
and
ListView refreshData.



f. After this use another add source directly block and put following code:
} catch (Exception e) { showMessage(e.toString()); } }
@Override public void onCancelled(DatabaseError databaseError) { } }; {

8. Add event textview1 onClick. Here set the number variable limit to limit + 6. Then use add source directly block to put following code:
query = Chat.limitToLast((int)limit);
query.addValueEventListener(valueEventListener1);


9. And event listview1 onBindCustomView. Here set the text of the three TextViews in custom.xml using data from the Map list map1.

10. That's all. Save and run the project. It will display 6 items in beginning and every time textview1 is clicked, it will display 6 more items.

Video illustration:

Comments

  1. Nice blog........ thanks for this...... App In Minute provides you the platform that you seek for creating your online store. With App In Minute’s help, you can develop your Android Application & Website for free and display your products or services to the world. App in minute can create a free business portfolio app or a gallery app with App In Minute Tool. For more information visit on https://www.appinminute.com/

    ReplyDelete
  2. So, in the latest version of Sketchware, "add source directly" was removed and now I am a little stuck trying to figure out a work around. I'm not an experienced programmer so forgive the naivety. What would you suggest?

    ReplyDelete
  3. And how can i filter listview data to display only certain records based on my edittext.getText

    ReplyDelete
  4. Please make A tutorial about create a new blood Donation app

    ReplyDelete
  5. I want to retrieve all children from a special child of child

    ReplyDelete
  6. Hi sir I am a fan of your useful tutorial in youtube and blogs can i ask a question how to get the last data in listview that are using firebase i want to transfer the last data of the listview to textview , thank you sir i will wait for your response have a great day.

    ReplyDelete

Post a Comment

Popular posts from this blog

A Flash Light App in Sketchware

Create Music Player app in Sketchware

In Sketchware: How to create a calculator for any simple formula?

Simple car racing android game in Sketchware

Firebase auth in Sketchware for Login Activity