Android
Picasso
Zoeken…
Invoering
Picasso is een beeldbibliotheek voor Android. Het is gemaakt en wordt onderhouden door Square . Het vereenvoudigt het weergeven van afbeeldingen van externe locaties. De bibliotheek verwerkt elke fase van het proces, van het initiële HTTP-verzoek tot het cachen van de afbeelding. In veel gevallen zijn slechts een paar regels code nodig om deze nette bibliotheek te implementeren.
Opmerkingen
Picasso is een krachtige bibliotheek voor het downloaden en opslaan van afbeeldingen voor Android.
Volg dit voorbeeld aan de bibliotheek toe te voegen aan uw project.
websites:
Picasso-bibliotheek toevoegen aan uw Android-project
Uit de officiële documentatie :
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>
Tijdelijke aanduiding en foutafhandeling
Picasso ondersteunt plaats- en downloadplaatsaanduidingen als optionele functies. Het biedt ook callbacks voor het verwerken van het downloadresultaat.
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() {}
});
Een verzoek wordt drie keer opnieuw geprobeerd voordat de tijdelijke aanduiding voor de fout wordt weergegeven.
Formaat wijzigen en roteren
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);
Circulaire Avatars met Picasso
Hier is een voorbeeld van een Picasso Circle Transform-klasse op basis van het origineel , met de toevoeging van een dunne rand, en bevat ook functionaliteit voor een optioneel scheidingsteken voor stapelen:
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";
}
}
Hier is hoe het te gebruiken bij het laden van een afbeelding (ervan uitgaande dat this
een activiteitscontext is en url
een tekenreeks is met de URL van de afbeelding die moet worden geladen):
ImageView ivAvatar = (ImageView) itemView.findViewById(R.id.avatar);
Picasso.with(this).load(url)
.fit()
.transform(new CircleTransform())
.into(ivAvatar);
Resultaat:
Geef voor gebruik met het scheidingsteken true
aan de constructor voor de bovenste afbeelding:
ImageView ivAvatar = (ImageView) itemView.findViewById(R.id.avatar);
Picasso.with(this).load(url)
.fit()
.transform(new CircleTransform(true))
.into(ivAvatar);
Resultaat (twee ImageViews in een FrameLayout):
Cache uitschakelen in Picasso
Picasso.with(context)
.load(uri)
.networkPolicy(NetworkPolicy.NO_CACHE)
.memoryPolicy(MemoryPolicy.NO_CACHE)
.placeholder(R.drawable.placeholder)
.into(imageView);
Afbeelding laden van externe opslag
String filename = "image.png";
String imagePath = getExternalFilesDir() + "/" + filename;
Picasso.with(context)
.load(new File(imagePath))
.into(imageView);
Afbeelding downloaden als bitmap met Picasso
Als u de afbeelding als Bitmap
wilt downloaden met Picasso
, helpt de volgende code u:
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) {
}
});
Afbeeldingsverzoeken annuleren met Picasso
In bepaalde gevallen moeten we een downloadverzoek voor afbeeldingen in Picasso annuleren voordat de download is voltooid.
Dit kan om verschillende redenen gebeuren, bijvoorbeeld als de bovenliggende weergave is overgeschakeld naar een andere weergave voordat de download van de afbeelding kon worden voltooid.
In dit geval kunt u het downloadverzoek voor de afbeelding annuleren met de methode cancelRequest()
:
ImageView imageView;
//......
Picasso.with(imageView.getContext()).cancelRequest(imageView);
Picasso gebruiken als ImageGetter voor Html.fromHtml
Picasso gebruiken als ImageGetter voor 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);
}
//------------------------------------------------------------------//
}
}
Het gebruik is eenvoudig:
Html.fromHtml(textToParse, new PicassoImageGetter(picasso, textViewTarget), null);
Probeer eerst offline schijfcache, ga dan online en haal de afbeelding op
voeg eerst de OkHttp toe aan het gradle-buildbestand van de app-module
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'
Maak vervolgens een klasse uitbreidende applicatie
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);
}
}
voeg het als volgt toe aan het Manifest-bestand:
<application
android:name=".Global"
.. >
</application>
Normaal gebruik
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");
}
});
}
});