Android
Picasso
Buscar..
Introducción
Picasso es una librería de imágenes para Android. Es creado y mantenido por Square . Simplifica el proceso de visualización de imágenes desde ubicaciones externas. La biblioteca maneja cada etapa del proceso, desde la solicitud HTTP inicial hasta el almacenamiento en caché de la imagen. En muchos casos, solo se requieren unas pocas líneas de código para implementar esta biblioteca ordenada.
Observaciones
Picasso es una potente biblioteca de descarga y almacenamiento de imágenes para Android.
Sigue este ejemplo para agregar la biblioteca a tu proyecto.
Sitios web:
Añadiendo la biblioteca de Picasso a tu proyecto de Android
De la documentación oficial :
Gradle
dependencies {
compile "com.squareup.picasso:picasso:2.5.2"
}
Maven
<dependency>
<groupId>com.squareup.picasso</groupId>
<artifactId>picasso</artifactId>
<version>2.5.2</version>
</dependency>
Marcador de posición y manejo de errores
Picasso admite tanto marcadores de posición de descarga como de error como características opcionales. También proporciona devoluciones de llamada para el manejo del resultado de la descarga.
Picasso.with(context)
.load("YOUR IMAGE URL HERE")
.placeholder(Your Drawable Resource) //this is optional the image to display while the url image is downloading
.error(Your Drawable Resource) //this is also optional if some error has occurred in downloading the image this image would be displayed
.into(imageView, new Callback(){
@Override
public void onSuccess() {}
@Override
public void onError() {}
});
Se reintentará una solicitud tres veces antes de que se muestre el marcador de posición de error.
Redimensionamiento y rotación
Picasso.with(context)
.load("YOUR IMAGE URL HERE")
.placeholder(DRAWABLE RESOURCE) // optional
.error(DRAWABLE RESOURCE) // optional
.resize(width, height) // optional
.rotate(degree) // optional
.into(imageView);
Avatares circulares con Picasso.
Aquí hay un ejemplo de la clase Picasso Circle Transform basada en el original , con la adición de un borde fino, y también incluye la funcionalidad de un separador opcional para apilar:
import android.graphics.Bitmap;
import android.graphics.BitmapShader;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Paint.Style;
import com.squareup.picasso.Transformation;
public class CircleTransform implements Transformation {
boolean mCircleSeparator = false;
public CircleTransform(){
}
public CircleTransform(boolean circleSeparator){
mCircleSeparator = circleSeparator;
}
@Override
public Bitmap transform(Bitmap source) {
int size = Math.min(source.getWidth(), source.getHeight());
int x = (source.getWidth() - size) / 2;
int y = (source.getHeight() - size) / 2;
Bitmap squaredBitmap = Bitmap.createBitmap(source, x, y, size, size);
if (squaredBitmap != source) {
source.recycle();
}
Bitmap bitmap = Bitmap.createBitmap(size, size, source.getConfig());
Canvas canvas = new Canvas(bitmap);
BitmapShader shader = new BitmapShader(squaredBitmap, BitmapShader.TileMode.CLAMP, BitmapShader.TileMode.CLAMP);
Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG | Paint.DITHER_FLAG | Paint.FILTER_BITMAP_FLAG);
paint.setShader(shader);
float r = size/2f;
canvas.drawCircle(r, r, r-1, paint);
// Make the thin border:
Paint paintBorder = new Paint();
paintBorder.setStyle(Style.STROKE);
paintBorder.setColor(Color.argb(84,0,0,0));
paintBorder.setAntiAlias(true);
paintBorder.setStrokeWidth(1);
canvas.drawCircle(r, r, r-1, paintBorder);
// Optional separator for stacking:
if (mCircleSeparator) {
Paint paintBorderSeparator = new Paint();
paintBorderSeparator.setStyle(Style.STROKE);
paintBorderSeparator.setColor(Color.parseColor("#ffffff"));
paintBorderSeparator.setAntiAlias(true);
paintBorderSeparator.setStrokeWidth(4);
canvas.drawCircle(r, r, r+1, paintBorderSeparator);
}
squaredBitmap.recycle();
return bitmap;
}
@Override
public String key() {
return "circle";
}
}
Aquí es cómo usarlo cuando se carga una imagen (suponiendo que this
es un contexto de actividad, y la url
es una cadena con la URL de la imagen a cargar):
ImageView ivAvatar = (ImageView) itemView.findViewById(R.id.avatar);
Picasso.with(this).load(url)
.fit()
.transform(new CircleTransform())
.into(ivAvatar);
Resultado:
Para su uso con el separador, dar true
que el constructor de la imagen superior:
ImageView ivAvatar = (ImageView) itemView.findViewById(R.id.avatar);
Picasso.with(this).load(url)
.fit()
.transform(new CircleTransform(true))
.into(ivAvatar);
Resultado (dos ImageViews en un FrameLayout):
Deshabilitar el caché en Picasso
Picasso.with(context)
.load(uri)
.networkPolicy(NetworkPolicy.NO_CACHE)
.memoryPolicy(MemoryPolicy.NO_CACHE)
.placeholder(R.drawable.placeholder)
.into(imageView);
Cargando imagen desde almacenamiento externo
String filename = "image.png";
String imagePath = getExternalFilesDir() + "/" + filename;
Picasso.with(context)
.load(new File(imagePath))
.into(imageView);
Descargando imagen como Bitmap usando Picasso
Si desea descargar la imagen como Bitmap
utilizando Picasso
siguiente código le ayudará:
Picasso.with(mContext)
.load(ImageUrl)
.into(new Target() {
@Override
public void onBitmapLoaded(Bitmap bitmap, Picasso.LoadedFrom from) {
// Todo: Do something with your bitmap here
}
@Override
public void onBitmapFailed(Drawable errorDrawable) {
}
@Override
public void onPrepareLoad(Drawable placeHolderDrawable) {
}
});
Cancelando solicitudes de imagen usando Picasso
En ciertos casos, debemos cancelar una solicitud de descarga de imágenes en Picasso antes de que se complete la descarga.
Esto podría suceder por varios motivos, por ejemplo, si la vista principal cambia a otra vista antes de que se complete la descarga de la imagen.
En este caso, puede cancelar la solicitud de descarga de imágenes usando el método cancelRequest()
:
ImageView imageView;
//......
Picasso.with(imageView.getContext()).cancelRequest(imageView);
Usando Picasso como ImageGetter para Html.fromHtml
Usando Picasso como ImageGetter para Html.fromHtml
public class PicassoImageGetter implements Html.ImageGetter {
private TextView textView;
private Picasso picasso;
public PicassoImageGetter(@NonNull Picasso picasso, @NonNull TextView textView) {
this.picasso = picasso;
this.textView = textView;
}
@Override
public Drawable getDrawable(String source) {
Log.d(PicassoImageGetter.class.getName(), "Start loading url " + source);
BitmapDrawablePlaceHolder drawable = new BitmapDrawablePlaceHolder();
picasso
.load(source)
.error(R.drawable.connection_error)
.into(drawable);
return drawable;
}
private class BitmapDrawablePlaceHolder extends BitmapDrawable implements Target {
protected Drawable drawable;
@Override
public void draw(final Canvas canvas) {
if (drawable != null) {
checkBounds();
drawable.draw(canvas);
}
}
public void setDrawable(@Nullable Drawable drawable) {
if (drawable != null) {
this.drawable = drawable;
checkBounds();
}
}
private void checkBounds() {
float defaultProportion = (float) drawable.getIntrinsicWidth() / (float) drawable.getIntrinsicHeight();
int width = Math.min(textView.getWidth(), drawable.getIntrinsicWidth());
int height = (int) ((float) width / defaultProportion);
if (getBounds().right != textView.getWidth() || getBounds().bottom != height) {
setBounds(0, 0, textView.getWidth(), height); //set to full width
int halfOfPlaceHolderWidth = (int) ((float) getBounds().right / 2f);
int halfOfImageWidth = (int) ((float) width / 2f);
drawable.setBounds(
halfOfPlaceHolderWidth - halfOfImageWidth, //centering an image
0,
halfOfPlaceHolderWidth + halfOfImageWidth,
height);
textView.setText(textView.getText()); //refresh text
}
}
//------------------------------------------------------------------//
@Override
public void onBitmapLoaded(Bitmap bitmap, Picasso.LoadedFrom from) {
setDrawable(new BitmapDrawable(Application.getContext().getResources(), bitmap));
}
@Override
public void onBitmapFailed(Drawable errorDrawable) {
setDrawable(errorDrawable);
}
@Override
public void onPrepareLoad(Drawable placeHolderDrawable) {
setDrawable(placeHolderDrawable);
}
//------------------------------------------------------------------//
}
}
El uso es simple:
Html.fromHtml(textToParse, new PicassoImageGetter(picasso, textViewTarget), null);
Pruebe primero la memoria caché del disco sin conexión, luego conéctese y busque la imagen
Primero agregue el OkHttp al archivo de compilación gradle del módulo de la aplicación
compile 'com.squareup.picasso:picasso:2.5.2'
compile 'com.squareup.okhttp:okhttp:2.4.0'
compile 'com.jakewharton.picasso:picasso2-okhttp3-downloader:1.0.2'
Luego haz una clase extendiendo la aplicación.
import android.app.Application;
import com.squareup.picasso.OkHttpDownloader;
import com.squareup.picasso.Picasso;
public class Global extends Application {
@Override
public void onCreate() {
super.onCreate();
Picasso.Builder builder = new Picasso.Builder(this);
builder.downloader(new OkHttpDownloader(this,Integer.MAX_VALUE));
Picasso built = builder.build();
built.setIndicatorsEnabled(true);
built.setLoggingEnabled(true);
Picasso.setSingletonInstance(built);
}
}
Agréguelo al archivo Manifiesto de la siguiente manera:
<application
android:name=".Global"
.. >
</application>
Uso normal
Picasso.with(getActivity())
.load(imageUrl)
.networkPolicy(NetworkPolicy.OFFLINE)
.into(imageView, new Callback() {
@Override
public void onSuccess() {
//Offline Cache hit
}
@Override
public void onError() {
//Try again online if cache failed
Picasso.with(getActivity())
.load(imageUrl)
.error(R.drawable.header)
.into(imageView, new Callback() {
@Override
public void onSuccess() {
//Online download
}
@Override
public void onError() {
Log.v("Picasso","Could not fetch image");
}
});
}
});
Enlace a la respuesta original