how to show progress bar(circle) in an activity having a listview before loading the listview with data

Ani picture Ani · Sep 24, 2012 · Viewed 382.4k times · Source

I have a ListView in my second activity.OnItemClick of it I called a webservice and trying to fetch data. And after that I am moving to third activity which also have a ListView having description of previous activities ListView item.

I want to display a progress dialog before populating this ListView.

I don't understand how to do it on ListView? Does anybody know how to do it?

My Code-

ThirdActivity.java

   package com.google.iprotect;

import java.io.IOException;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.Map;

import org.json.JSONArray;
import org.json.JSONException;
import org.json.JSONObject;
import org.xmlpull.v1.XmlPullParserException;

import com.google.iprotect.layout.TitleBarLayout;

import android.app.Activity;
import android.app.ListActivity;
import android.app.ProgressDialog;
import android.content.Intent;
import android.content.res.ColorStateList;
import android.content.res.XmlResourceParser;
import android.os.AsyncTask;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.AdapterView;
import android.widget.LinearLayout;
import android.widget.ListView;
import android.widget.ProgressBar;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.TextView;

public class ThirdActivity extends ListActivity implements OnItemClickListener{

    JSONArray jArray1,jArray2;
    String one,two,three,tablename;
    String color,r;
    JSONObject responseJSON;
    TitleBarLayout titlebarLayout;
    final ArrayList<Tables> arraylist = new ArrayList<Tables>();
    TextView tableName;
    ColorStateList colorStateList1;
    String email1,password1;
    protected void onCreate(Bundle savedInstanceState) {
        // TODO Auto-generated method stub
        super.onCreate(savedInstanceState);
        setContentView(R.layout.thirdactivity);

        ListView lv=getListView();
        lv.setOnItemClickListener(this);


        tablename=getIntent().getExtras().getString("Table Name");
        email1 = getIntent().getExtras().getString("email");
        password1 =getIntent().getExtras().getString("password");

        titlebarLayout = new TitleBarLayout(ThirdActivity.this);
        titlebarLayout.setLeftButtonText("go Back");
        titlebarLayout.setRightButtonText("Logout");
        titlebarLayout.setTitle(tablename);
        titlebarLayout.setLeftButtonSize(70,40);
        titlebarLayout.setRightButtonSize(70,40);
        //titlebarLayout.setLeftButtonLeftDrawable(R.drawable.refresh);

        //titlebarLayout.setRightButtonLeftDrawable(R.drawable.buttonrefresh);
        //titlebarLayout.setLeftButtonBackgroundColor(Color.rgb(255,255,255));
        //titlebarLayout.setRightButtonBackgroundColor(Color.rgb(34,49,64));
        //titlebarLayout.setLeftButtonTextColor(Color.rgb(255,255,255));
        //titlebarLayout.setRightButtonTextColor(Color.rgb(255,255,0));     

        XmlResourceParser parser1 =getResources().getXml(R.color.colorstatelist);


        try {
            colorStateList1 = ColorStateList.createFromXml(getResources(), parser1);
            titlebarLayout.setRightButtonTextColor(colorStateList1);
        } catch (XmlPullParserException e) {    
            e.printStackTrace();
        } catch (IOException e) {

            e.printStackTrace();
        }

        OnClickListener listener = new OnClickListener() {

            public void onClick(View v) {
                // TODO Auto-generated method stub
                if (v.getId() == R.id.left_button) {
                    Intent intent = new Intent(ThirdActivity.this,SecondActivity.class);
                    intent.putExtra("email", email1);
                    intent.putExtra("password", password1);
                    startActivity(intent);
                    finish();

                } else if (v.getId() == R.id.right_button) {
                    Intent intent = new Intent(ThirdActivity.this,
                            MainActivity.class);
                    //intent.setFlags(Intent.FLAG_ACTIVITY_CLEAR_TOP);
                    intent.setFlags( Intent.FLAG_ACTIVITY_CLEAR_TASK | Intent.FLAG_ACTIVITY_NEW_TASK);
                    ThirdActivity.this.startActivity(intent);

                }
            }
        };
        titlebarLayout.setLeftButtonOnClickListener(listener);
        titlebarLayout.setRightButtonOnClickListener(listener);


        updateTableList();




    }

    private void updateTableList() {
        // TODO Auto-generated method stub
        //final ProgressDialog pd1=ProgressDialog.show(this, "Calling Webservice", "Waiting...", true, false);

        final ProgressBar pbHeaderProgress = (ProgressBar) findViewById(R.id.pbHeaderProgress);

        new AsyncTask<Void, Void, Void>() {


            protected void onPreExecute() {
                // TODO Auto-generated method stub
                super.onPreExecute();
                pbHeaderProgress.setVisibility(View.VISIBLE);
            }



            protected Void doInBackground(Void... params) {
                r = invokeWebService1(tablename);
                //pd1.dismiss();

                try {
                    responseJSON = new JSONObject(r);
                    //json reading
                    jArray1 = responseJSON.getJSONArray("FirstThree");//get JSONArray jArray1 from JSONObject with name FirstThree
                    jArray2 = responseJSON.getJSONArray("Color");//get JSONArray jArray2 from JSONOobject with name Color
                    JSONObject json_data1 = null;
                    JSONObject json_data2 = null;

                    for (int i = 0; i < jArray1.length(); i++) {
                        json_data1 = jArray1.getJSONObject(i);//get JSONObject json_data1 from JSONArray at index i;
                        one = json_data1.getString("One");//get value from JSONObject json_data1 with key "One"
                        two = json_data1.getString("Two");
                        three = json_data1.getString("Three");
                        json_data2 = jArray2.getJSONObject(i);
                        color = json_data2.getString("color");//get value from JSONObject json_data2 with key "color"

                        Tables tables = new Tables();
                        //set value to Tables Class
                        tables.column1 = one;
                        tables.column2 = two;
                        tables.column3 = three;
                        tables.tableName=tablename;
                        tables.color=color;
                        //add Tables object into ArrayList<Tables>
                        arraylist.add(tables);

                        Log.i("ONE", json_data1.getString("One"));
                        Log.i("TWO", json_data1.getString("Two"));
                        Log.i("THREE", json_data1.getString("Three"));
                        Log.i("color",""+ json_data2.getString("color"));
                    }

                } catch (JSONException e) {
                    // TODO Auto-generated catch block
                    e.printStackTrace();
                }
                return null;
            }

            protected void onPostExecute(Void result) {
                pbHeaderProgress.setVisibility(View.GONE);

                //Custom Adapter for ListView
                TableDetailAdapter adaptor = new TableDetailAdapter(ThirdActivity.this,
                        R.layout.table_data_list_item, arraylist);
                setListAdapter(adaptor);
            }
        }.execute();

    }

    protected String invokeWebService1(String tablename2) {
        // TODO Auto-generated method stub
        String response = "";
        try {
            WebService webService = new WebService(
            "http://sphinx-solution.com/iProtect/api.php?");

            // Pass the parameters if needed
            Map<String, String> params = new HashMap<String, String>();
            params.put("action", "getTableRecords");
            params.put("tablename", tablename2);
            params.put("email", email1);
            params.put("password", password1);

            // Get JSON response from server the "" are where the method name
            // would normally go if needed example
            response = webService.WebGet("auth", params);

        } catch (Exception e) {
            Log.d("Error: ", e.getMessage());
        }
        return response;
    }


    public void onItemClick(AdapterView<?> arg0, View arg1, int position, long arg3) {
        // TODO Auto-generated method stub

        Log.v("", "Click ListItem Number "+position);
        Intent intent = new Intent(ThirdActivity.this,FourthActivity.class);
        intent.putExtra("Json", responseJSON.toString());//sending json Object as a string to next activity
        intent.putExtra("Table Name", tablename);
        intent.putExtra("email", email1);
        intent.putExtra("password", password1);
        intent.putExtra("Item No", position);
        startActivity(intent);

    }

}

thirdactivity.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/linlaHeaderProgress"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".ThirdActivity" >

    <include
        android:id="@+id/titlebar"
        layout="@layout/titlebar_layout" />

    <ProgressBar
        android:id="@+id/pbHeaderProgress"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_weight="2" >
    </ProgressBar>

    <ListView
        android:id="@android:id/list"
        android:layout_width="match_parent"
        android:layout_height="260dp" 
        android:layout_weight="5.04">
    </ListView>

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="@dimen/titlebar_height"
        android:layout_alignParentBottom="true"
        android:background="@color/footer_bg_color"
        android:gravity="bottom"
        android:orientation="horizontal" >

        <include
            android:id="@+id/footer"
            android:layout_height="@dimen/titlebar_height"
            android:layout_gravity="bottom|center_horizontal"
            layout="@layout/footer_layout" />
    </LinearLayout>

</LinearLayout>

Answer

Siddharth Lele picture Siddharth Lele · Sep 24, 2012

There are several methods of showing a progress bar (circle) while loading an activity. In your case, one with a ListView in it.

IN ACTIONBAR

If you are using an ActionBar, you can call the ProgressBar like this (this could go in your onCreate()

requestWindowFeature(Window.FEATURE_INDETERMINATE_PROGRESS);  
setProgressBarIndeterminateVisibility(true);

And after you are done displaying the list, to hide it.

setProgressBarIndeterminateVisibility(false);

IN THE LAYOUT (The XML)

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:layout_weight="1"
    android:orientation="vertical" >

    <LinearLayout
        android:id="@+id/linlaHeaderProgress"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:gravity="center"
        android:orientation="vertical"
        android:visibility="gone" >

        <ProgressBar
            android:id="@+id/pbHeaderProgress"
            style="@style/Spinner"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" >
        </ProgressBar>
    </LinearLayout>

    <ListView
        android:id="@+id/list"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:cacheColorHint="@android:color/transparent"
        android:divider="#00000000"
        android:dividerHeight="0dp"
        android:fadingEdge="none"
        android:persistentDrawingCache="scrolling"
        android:smoothScrollbar="false" >
    </ListView>
</LinearLayout>

And in your activity (Java) I use an AsyncTask to fetch data for my lists. SO, in the AsyncTask's onPreExecute() I use something like this:

// CAST THE LINEARLAYOUT HOLDING THE MAIN PROGRESS (SPINNER)
LinearLayout linlaHeaderProgress = (LinearLayout) findViewById(R.id.linlaHeaderProgress);

@Override
protected void onPreExecute() {    
    // SHOW THE SPINNER WHILE LOADING FEEDS
    linlaHeaderProgress.setVisibility(View.VISIBLE);
}

and in the onPostExecute(), after setting the adapter to the ListView:

@Override
protected void onPostExecute(Void result) {     
    // SET THE ADAPTER TO THE LISTVIEW
    lv.setAdapter(adapter);

    // CHANGE THE LOADINGMORE STATUS TO PERMIT FETCHING MORE DATA
    loadingMore = false;

    // HIDE THE SPINNER AFTER LOADING FEEDS
    linlaHeaderProgress.setVisibility(View.GONE);
}

EDIT: This is how it looks in my app while loading one of several ListViews

enter image description here