Picasso Image Loader With GridView For Android.

—>  AndroidManifest.xml

 

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.example.universalimageloaderdemo"
android:versionCode="1"
android:versionName="1.0" >

<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />

<uses-sdk
android:minSdkVersion="8"
android:targetSdkVersion="22" />

<application

android:allowBackup="false"
android:icon="@drawable/ic_launcher"
android:label="@string/app_name"
android:theme="@style/AppTheme" >
<activity
android:name=".MainActivity"
android:label="@string/app_name" >
<intent-filter>
<action android:name="android.intent.action.MAIN" />

<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>

</manifest>

 

styles.xml

<resources>

<!--
Base application theme, dependent on API level. This theme is replaced
by AppBaseTheme from res/values-vXX/styles.xml on newer devices.
-->
<style name="AppBaseTheme" parent="Theme.AppCompat.Light">
<!--
Theme customizations available in newer API levels can go in
res/values-vXX/styles.xml, while customizations related to
backward-compatibility can go here.
-->

</style>

<!-- Application theme. -->
<style name="AppTheme" parent="AppBaseTheme">
<!-- All customizations that are NOT specific to a particular API-level can go here. -->

</style>
<style name="ProgressBarStyle" parent="@android:style/Widget.ProgressBar.Horizontal"/>
</resources>

IN Layout Folder

activity_main.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<GridView
android:id="@+id/grid"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:horizontalSpacing="4dip"
android:numColumns="3"
android:stretchMode="columnWidth"
android:verticalSpacing="4dip"
android:padding="4dip" />

</RelativeLayout>

item_grid_image.xml

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

<ImageView
android:id="@+id/image"
android:layout_width="match_parent"
android:layout_height="120dip"
android:adjustViewBounds="true"
android:scaleType="centerCrop" />

<ProgressBar
android:id="@+id/progress"
style="@style/ProgressBarStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:indeterminate="false"
android:max="100" />

</FrameLayout>

Constants.java

package com.example.universalimageloaderdemo;


public final class Constants {

public static final String[] IMAGES = new String[] {
// Heavy images
"http://mobworld.co.in/BestWallpaper/3D/image1.jpg",
"http://mobworld.co.in/BestWallpaper/3D/image2.jpg",
"http://mobworld.co.in/BestWallpaper/3D/image3.jpg",
"http://mobworld.co.in/BestWallpaper/3D/image4.jpg",
"http://mobworld.co.in/BestWallpaper/3D/image5.jpg",
"http://mobworld.co.in/BestWallpaper/3D/image6.jpg",
"http://mobworld.co.in/BestWallpaper/3D/image7.jpg",
"http://mobworld.co.in/BestWallpaper/3D/image8.jpg",
"http://mobworld.co.in/BestWallpaper/3D/image9.jpg",
"http://mobworld.co.in/BestWallpaper/3D/image10.jpg",


};

 

}

MainActivity.java

package com.example.universalimageloaderdemo;

import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.GridView;
import android.widget.ImageView;
import android.widget.ProgressBar;

import com.squareup.picasso.Callback;
import com.squareup.picasso.Picasso;


public class MainActivity extends Activity {

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

grid = (GridView)findViewById(R.id.grid);
grid.setAdapter(new ImageAdapter(this));
}

private static class ImageAdapter extends BaseAdapter {

private static final String[] IMAGE_URLS = Constants.IMAGES;

private LayoutInflater inflater;

Context c;

ImageAdapter(Context context) {
inflater = LayoutInflater.from(context);
c = context;

}

@Override
public int getCount() {
return IMAGE_URLS.length;
}

@Override
public Object getItem(int position) {
return null;
}

@Override
public long getItemId(int position) {
return position;
}

@Override
public View getView(int position, View convertView, ViewGroup parent) {
final ViewHolder holder;
View view = convertView;
if (view == null) {
view = inflater.inflate(R.layout.item_grid_image, parent, false);
holder = new ViewHolder();
assert view != null;

holder.imageView = (ImageView) view.findViewById(R.id.image);

holder.progressBar = (ProgressBar) view.findViewById(R.id.progress);

view.setTag(holder);
} else {
holder = (ViewHolder) view.getTag();
}
Picasso.with(c)
.load(IMAGE_URLS[position])
.placeholder(R.drawable.ic_stub)
.error(R.drawable.ic_launcher)
.fit()
.into(holder.imageView, new Callback() {

@Override
public void onSuccess() {
holder.imageView.setVisibility(View.VISIBLE);
holder.progressBar.setVisibility(View.INVISIBLE);
}

@Override
public void onError() {
holder.progressBar.setVisibility(View.VISIBLE);
holder.imageView.setVisibility(View.INVISIBLE);
}
});

return view;
}
}

static class ViewHolder {
ImageView imageView;
ProgressBar progressBar;
}
}