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.

26
demandé sur Akshay 2015-06-08 11:40:06

6 réponses

J'utilise cette transformation: https://gist.github.com/julianshen/5829333

Picasso.with(activity).load(url).transform(new CircleTransform()).into(imageView);
35
répondu dasar 2015-06-08 10:58:06

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);
19
répondu STB Land 2015-11-25 08:20:58

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";
  }
}
19
répondu stevyhacker 2016-02-06 13:23:44

, j'ai utilisé RoundedCornersTransformationclasse de picasso-transformationsbibliothè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.

7
répondu DISHA 2017-03-31 05:43:24

Comme dit ici. Vous pouvez utiliser MaskTransformationclasse 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

4
répondu NickUnuchek 2017-06-19 12:26:35

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!

2
répondu RominaV 2017-05-23 12:03:08