Faire ImageView avec coin rond en utilisant picasso
Je sais qu'il y a beaucoup de lien disponible pour faire ImageView
coin rond.
Mais j'utilise la bibliothèque Picasso
pour le chargement de L'Image..
Je renvoie le lien pour obtenir le résultat.
Mais le problème est que je L'utilise dans ListView
et pour le LIstView's
premier élément {[0] } Il fonctionne parfaitement bien mais pour le reste une fois que la transformation ne fonctionne pas.
6 réponses
J'utilise cette transformation: https://gist.github.com/julianshen/5829333
Picasso.with(activity).load(url).transform(new CircleTransform()).into(imageView);
Vous pouvez utiliser RoundedCornersTransformation classe de picasso-transformations bibliothèque.
Exemple :
final int radius = 5;
final int margin = 5;
final Transformation transformation = new RoundedCornersTransformation(radius, margin);
Picasso.with(activity).load(url).transform(transformation).into(imageView);
Vous pouvez utiliser cette classe pour faire des angles arrondis rectangle image view avec Picasso, l'utiliser comme ceci
Picasso.with(activity).load(url).transform(new RoundedCornersTransform(this)).into(imageView);
Voici la classe RoundedCornersTransform.
package com.demo.picasso;
import android.graphics.Bitmap;
import android.graphics.BitmapShader;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.RectF;
import com.squareup.picasso.Transformation;
public class RoundedCornersTransform implements Transformation {
@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);
Paint paint = new Paint();
BitmapShader shader = new BitmapShader(squaredBitmap, BitmapShader.TileMode.CLAMP, BitmapShader.TileMode.CLAMP);
paint.setShader(shader);
paint.setAntiAlias(true);
float r = size / 8f;
canvas.drawRoundRect(new RectF(0, 0, source.getWidth(), source.getHeight()), r, r, paint);
squaredBitmap.recycle();
return bitmap;
}
@Override
public String key() {
return "rounded_corners";
}
}
, j'ai utilisé RoundedCornersTransformation
classe de picasso-transformations
bibliothèque. J'avais un adaptateur personnalisé avec un motif de support de vue dans mon listview. J'ai ajouté ci-dessous la dépendance dans mon build.gradle
:
dependencies {
compile 'jp.wasabeef:picasso-transformations:2.1.0'
}
Et dans mon customArrayAdapter.java
,j'ai ajouté:
Picasso.with(getContext()).load(path).transform(new RoundedCornersTransformation(10,10)).resize(175,300).into(viewHolder.ivImage);
Cela permettrait à la fois de redimensionner et de donner des coins arrondis à vos images.
Comme dit ici. Vous pouvez utiliser MaskTransformation
classe de picasso-transformations bibliothèque.
Exemple :
final Transformation transformation = new MaskTransformation(getContext(), R.drawable.rounded_convers_transformation);
Picasso.with(activity).load(url).transform(transformation).into(imageView);
Res / drawable / rounded_convers_transformation.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners android:radius="5dp"/>
<solid android:color="@color/black"/>
</shape>
UPDATE: mais notez que vous devriez également .resize(w,h)
l'image, car si l'image est grande, le tour ne sera pas déterminable
Suite à la réponse de @stevyhacker et celle-ci, je suis venu avec ceci:
import android.graphics.Bitmap;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.graphics.PorterDuff;
import android.graphics.PorterDuffXfermode;
import android.graphics.Rect;
import android.graphics.RectF;
import com.squareup.picasso.Transformation;
public class RoundedCornersTransform implements Transformation {
private static Bitmap createRoundedRectBitmap(Bitmap bitmap,
float topLeftCorner, float topRightCorner,
float bottomRightCorner, float bottomLeftCorner) {
Bitmap output = Bitmap.createBitmap(bitmap.getWidth(), bitmap.getHeight(),
Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(output);
final int color = Color.WHITE;
final Paint paint = new Paint();
final Rect rect = new Rect(0, 0, bitmap.getWidth(), bitmap.getHeight());
final RectF rectF = new RectF(rect);
Path path = new Path();
float[] radii = new float[]{
topLeftCorner, bottomLeftCorner,
topRightCorner, topRightCorner,
bottomRightCorner, bottomRightCorner,
bottomLeftCorner, bottomLeftCorner
};
paint.setAntiAlias(true);
canvas.drawARGB(0, 0, 0, 0);
paint.setColor(color);
path.addRoundRect(rectF, radii, Path.Direction.CW);
canvas.drawPath(path, paint);
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
canvas.drawBitmap(bitmap, rect, rect, paint);
return output;
}
@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();
}
float r = size / 4f;
Bitmap roundedBitmap = createRoundedRectBitmap(squaredBitmap, r, r, r, r);
squaredBitmap.recycle();
return roundedBitmap;
}
@Override
public String key() {
return "rounded_corners";
}
}
Utilisez-le comme ceci:
Picasso.with(context).load(url).transform(new RoundedCornersTransform()).into(imageView);
A probablement besoin d'améliorations, alors faites attention!