Create "loading" animation easily

Question

I have an android listView with an image in each item. It takes a while till the image is loaded. How can I add a "loading" animation every time the image is loaded?

Should I use a .gif? Or create my own animation and stop it on onPostExecute()?

How can I do this if I use "picasso" because there all the async task is black box to the developer and I cannot stop any animation?

Answer here: http://stackoverflow.com/questions/20181491/use-picasso-to-get-a-callback-with-a-bitmap — Timuçin, Aug 09 '14 at 13:14

Paritosh · Accepted Answer · 2014-08-17T11:48:28.950

Use following code:

MainActivity.java

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_my);

    ArrayList<HashMap<String, String>> itemsList = new ArrayList<HashMap<String, String>>();

    ListView listView = (ListView) findViewById(R.id.listView);

    for (int i = 0; i < 5; i++) {

        // creating new HashMap
        HashMap<String, String> map = new HashMap<String, String>();

        // adding each child node to HashMap key =&gt; value
        map.put("key1", "value1");
        map.put("key2", "value2");

        // adding HashList to ArrayList
        itemsList.add(map);
    }

    ListAdapter listAdapter = new ListAdapter(this, itemsList);
    listView.setAdapter(listAdapter);
}

list_row.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

<ImageView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/imageView"
    android:layout_alignParentTop="true"
    android:layout_alignParentLeft="true"
    android:layout_alignParentStart="true"
    android:src="@drawable/ic_launcher" />

<ProgressBar
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/progressBar"
    android:layout_toEndOf="@+id/imageView"
    android:layout_alignParentTop="true"
    android:layout_alignParentLeft="true"
    android:layout_alignParentStart="true" />
</RelativeLayout>

ListAdapter.java

@Override
public View getView(int position, View convertView, ViewGroup parent) {
    View vi = convertView;
    if (convertView == null)
        vi = inflater.inflate(R.layout.list_row, null);

    ImageView imageView = (ImageView) vi.findViewById(R.id.imageView);
    final ProgressBar progressBar = (ProgressBar) vi.findViewById(R.id.progressBar);

    //This line shows progressBar again for recycled view
    progressBar.setVisibility(View.VISIBLE);

    Picasso.with(activity.getApplicationContext()).load(imagePath).resize(100, 100)
            .into(imageView, new Callback() {
                @Override
                public void onSuccess() {
                    progressBar.setVisibility(View.GONE);
                }

                @Override
                public void onError() {
                    //error
                }
            });

    return vi;
}

Don't forget to add import for Picasso Callback

import com.squareup.picasso.Callback;

i did it. but I want to re-init the progressBar also when the list is recycled. how can I do this? — Elad Benda2, Aug 10 '14 at 09:01
no, just progressBar. but interested to hear about that as well — Elad Benda2, Aug 10 '14 at 09:50
Updated code for view recycling. The line progressBar.setVisibility(View.VISIBLE); does the work. — Paritosh, Aug 17 '14 at 11:49

score 0 · Answer 2 · answered Aug 09 '14 at 13:24

0

You can use this library. It work and you can custom your wheels ! :) https://github.com/Todd-Davies/ProgressWheel

answered Aug 09 '14 at 13:24

Maxouille

2,729
2
19
42

but if i want to use picasso? how will i create progress wheel then? – Elad Benda2 Aug 09 '14 at 13:25
You can add a custom wheel and hide the content of picasso while download is not finished. But i don't know picasso. May be is it possible to custom easily. – Maxouille Aug 09 '14 at 13:31
how can I do this without picasso and without Todd Davies lib? – Elad Benda2 Aug 09 '14 at 14:00

score 0 · Answer 3 · answered Aug 10 '14 at 07:21

I have added this in my xml

       <ProgressBar
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:indeterminate="true" 
        android:layout_centerInParent="true"/>

I can stop it on PostExecute() but I'm not sure how to make Picasso stop it itself.

Create "loading" animation easily

3 Answers3

Linked