Tuesday 14 March 2017

Firebase Real time database with ListView

Tags

hai friends in this tutorial we will learn how to work with firebase listview ,this is used to display the data of Firebase Realtime Database by rows manner,
so before you work with this example you must know the following things 
  • what is the firebase 
  • why we need to use firebase
  • what is tha advanatges of firebase
if you don't know about the above things Firebase setup video


Lets start our work

  • creating a new android project
  1. I just created a new android project(i.e ListviewTest)
  2. In this project we will retrieve the data from Firebase Realtime Database and displays into listview 
  3. so now we have to setup our android app to firebase project(if you don't know about please see the below video )


  • add the following dependency in our project under project structure build.gradle(Module: app) file in module section
 compile 'com.google.firebase:firebase-database:9.8.0'  

uses of above dependency

  • firebase database dependency used to uses the database feature of firebase 

create User Interface for our Application

  • make our activity_main.xml file to below  

activity_main.xml

 <?xml version="1.0" encoding="utf-8"?>  
 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
   xmlns:tools="http://schemas.android.com/tools"  
   android:id="@+id/activity_main2"  
   android:layout_width="match_parent"  
   android:layout_height="match_parent"  
   android:paddingBottom="@dimen/activity_vertical_margin"  
   android:paddingLeft="@dimen/activity_horizontal_margin"  
   android:paddingRight="@dimen/activity_horizontal_margin"  
   android:paddingTop="@dimen/activity_vertical_margin"  
   tools:context="com.example.mahesh.firebasesample.Main2Activity">  
   <ListView  
     android:layout_width="match_parent"  
     android:layout_height="match_parent"  
     android:id="@+id/listview"  
     android:layout_alignParentBottom="true"  
     android:layout_alignParentLeft="true"  
     android:layout_alignParentStart="true"  
     android:layout_marginBottom="11dp" />  
 </RelativeLayout>  
  • finally we get user interface like this
ativity_main.xml
  • make the MainActivity.java file like this

MainActivity.java

 package com.example.mahesh.firebasesample;  
 import android.support.v7.app.AppCompatActivity;  
 import android.os.Bundle;  
 import android.widget.ArrayAdapter;  
 import android.widget.ListView;  
 import android.widget.Toast;  
 import com.google.firebase.database.ChildEventListener;  
 import com.google.firebase.database.DataSnapshot;  
 import com.google.firebase.database.DatabaseError;  
 import com.google.firebase.database.DatabaseReference;  
 import com.google.firebase.database.FirebaseDatabase;  
 import com.google.firebase.database.ValueEventListener;  
 import java.util.ArrayList;  
 import java.util.Map;  
 public class Main2Activity extends AppCompatActivity {  
   DatabaseReference dref;  
   ListView listview;  
   ArrayList<String> list=new ArrayList<>();  
   @Override  
   protected void onCreate(Bundle savedInstanceState) {  
     super.onCreate(savedInstanceState);  
     setContentView(R.layout.activity_main);  
     listview=(ListView)findViewById(R.id.listview);  
     final ArrayAdapter<String> adapter=new ArrayAdapter<String>(this,android.R.layout.simple_dropdown_item_1line,list);  
     listview.setAdapter(adapter);  
     dref=FirebaseDatabase.getInstance().getReference();  
     dref.addChildEventListener(new ChildEventListener() {  
       @Override  
       public void onChildAdded(DataSnapshot dataSnapshot, String s) {  
         list.add(dataSnapshot.getValue(String.class));  
         adapter.notifyDataSetChanged();  
       }  
       @Override  
       public void onChildChanged(DataSnapshot dataSnapshot, String s) {  
       }  
       @Override  
       public void onChildRemoved(DataSnapshot dataSnapshot) {  
         list.remove(dataSnapshot.getValue(String.class));  
         adapter.notifyDataSetChanged();  
       }  
       @Override  
       public void onChildMoved(DataSnapshot dataSnapshot, String s) {  
       }  
       @Override  
       public void onCancelled(DatabaseError databaseError) {  
       }  
     });  
   }  
 }  

Thanks for seeing our blog if you have any doubts please comment below i will come with better solution

15 comments

very thank you,have connect my phone to my wifi and i got the output...

i really dont know how to connect the below three things
a searchview retrieving data from firebase should display the data in a listview in a new window...if i gets the tutorial as video helps me a lot

hi
how to achieve this,searchview retrieving data from firebase and display it in listview.Have seen examples of retrieving data if i searches from searchview and retrieving data from firebase displays in list but not all these three into one.can you give example like this.

I used your code and some errors occurs:
04-18 14:49:10.737 27655-27655/cai.com.fireteste D/AndroidRuntime: Shutting down VM
04-18 14:49:10.737 27655-27655/cai.com.fireteste E/AndroidRuntime: FATAL EXCEPTION: main
Process: cai.com.fireteste, PID: 27655
com.google.firebase.database.DatabaseException: Failed to convert value of type java.util.HashMap to String
at com.google.android.gms.internal.zzanp.zzcf(Unknown Source)
at com.google.android.gms.internal.zzanp.zzb(Unknown Source)
at com.google.android.gms.internal.zzanp.zza(Unknown Source)
at com.google.firebase.database.DataSnapshot.getValue(Unknown Source)
at cai.com.fireteste.Main2Activity$1.onChildAdded(Main2Activity.java:30)
at com.google.android.gms.internal.zzajg.zza(Unknown Source)
at com.google.android.gms.internal.zzalg.zzcxk(Unknown Source)
at com.google.android.gms.internal.zzalj$1.run(Unknown Source)
at android.os.Handler.handleCallback(Handler.java:751)
at android.os.Handler.dispatchMessage(Handler.java:95)
at android.os.Looper.loop(Looper.java:154)
at android.app.ActivityThread.main(ActivityThread.java:6119)
at java.lang.reflect.Method.invoke(Native Method)
at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:886)
at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:776)

Manikandan:Sorry for the late reply ,yeah we can do it,I will do in next post ok

Hi when can i expect the net post? Have asked something thing what i want.

i can run the apps but when i clicked button to view the database, it crashed when retrieving. is it maybe because of the listview? help me im doing my fyp :(

Gettng this error
FATAL EXCEPTION: main
Process: com.example.amit.sensordata2, PID: 6034
com.google.firebase.database.DatabaseException: Failed to convert value of type java.util.HashMap to String

sir can you please tell me how to create Custom Adapter and how to fetch data from Custom Adapter

Getting this error:
FATAL EXCEPTION: main
Process: com.wordpress.ronsjackwagonsitefornerds.soup, PID: 4357
com.google.firebase.database.DatabaseException: Failed to convert value of type java.util.ArrayList to String
at com.google.android.gms.internal.firebase_database.zzkt.zzb(Unknown Source)
at com.google.android.gms.internal.firebase_database.zzkt.zza(Unknown Source)
at com.google.firebase.database.DataSnapshot.getValue(Unknown Source)
at com.wordpress.ronsjackwagonsitefornerds.soup2.MainActivity$1.onChildAdded(MainActivity.java:55)
at com.google.android.gms.internal.firebase_database.zzbt.zza(Unknown Source)
at com.google.android.gms.internal.firebase_database.zzgx.zzdr(Unknown Source)
at com.google.android.gms.internal.firebase_database.zzhd.run(Unknown Source)
at android.os.Handler.handleCallback(Handler.java:739)
at android.os.Handler.dispatchMessage(Handler.java:95)
at android.os.Looper.loop(Looper.java:135)
at android.app.ActivityThread.main(ActivityThread.java:5254)
at java.lang.reflect.Method.invoke(Native Method)
at java.lang.reflect.Method.invoke(Method.java:372)
at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:903)
at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:698)

Mahesh sir,we are getting good outputs when will you post next?.your blog and channel simply Awesome :)

Thanks bro solved my 1 problem


Emoticon Emoticon