2014-09-30 5 views
78

Вопрос был задан, и было обещано, что для самой версии Picasso я использую: Как отправить круговое растровое изображение в ImageView с помощью Picasso? Я новый Пикассо и единственное, что я использовал этоandroid: создать круговое изображение с picasso

Picasso.with(context).load(url).resize(w, h).into(imageview); 

Я уже нашел https://gist.github.com/julianshen/5829333, но я не знаю, как совместить его с линией выше в не неловко.

+0

Ссылку вы дали достаточно, чтобы ответить на свой вопрос. И вам нужно было применить только Picasso.with (activity) .load (mayorShipImageLink) .transform (новый CircleTransform()). В (ImageView); – lagos

ответ

220

Исследование немного раньше, так как есть ответы. В любом случае, следуйте This Link и внимательно прочитайте его, чтобы узнать, как его использовать.

попробовать это:

import com.squareup.picasso.Transformation; 

public class CircleTransform 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/2f; 
     canvas.drawCircle(r, r, r, paint); 

     squaredBitmap.recycle(); 
     return bitmap; 
    } 

    @Override 
    public String key() { 
     return "circle"; 
    } 
} 

затем просто применить это нравится:

Picasso.with(activity).load(mayorShipImageLink).transform(new CircleTransform()).into(ImageView); 
+4

Ответы на ссылки очень разочарованы здесь, потому что ссылки могут стать мертвыми в будущем. Я предлагаю вам отредактировать свой ответ с помощью цитат из источников, которые вы цитируете. –

+2

@ Code-ученик сделал то, что вы сказали, и да, вы совершенно правы –

+0

@ Anirudh-Шарма убедитесь, чтобы добавить этот импорт: импорта android.graphics.Bitmap; import android.graphics.BitmapShader; import android.graphics.Canvas; импорт android.graphics.Paint; импорт com.squareup.picasso.Transformation; – AG1

7

Используйте эту библиотеку, чтобы создать круговую ImageView. To make a circular ImageView, add this CircularImageView library to your project и добавить CircularImageView в макете XML

<com.pkmmte.view.CircularImageView 
     android:layout_width="250dp" 
     android:layout_height="250dp" 
     android:src="@drawable/image" 
     app:border_color="#EEEEEE" 
     app:border_width="4dp" 
     app:shadow="true" />` 

Затем используйте Picasso загрузить требуемое изображение в этом ImageView. Picasso делает все кэширование, вам не нужно беспокоиться об этом

10

Я пробовал все решения выше, но ни один из них не дает мне преобразование круга без обрезки изображения. Это решение будет работать только для изображений с одинаковой шириной и высотой .. это мое решение на выше

первого ------

Picasso.with(getActivity()) 
      .load(url) 
      .error(R.drawable.image2) 
      .placeholder(R.drawable.ic_drawer) 
      .resize(200, 200) 
      .transform(new ImageTrans_CircleTransform()) 
      .into(imageView1); 

затем сделать этот --------

import android.graphics.Bitmap; 
import android.graphics.BitmapShader; 
import android.graphics.Canvas; 
import android.graphics.Color; 
import android.graphics.Paint; 
import android.graphics.Shader.TileMode; 

import com.squareup.picasso.Transformation; 
public class ImageTrans_CircleTransform implements Transformation { 
@Override 
    public Bitmap transform(Bitmap source) { 
if (source == null || source.isRecycled()) { 
       return null; 
      } 

      final int width = source.getWidth() + borderwidth; 
      final int height = source.getHeight() + borderwidth; 

      Bitmap canvasBitmap = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888); 
      BitmapShader shader = new BitmapShader(source, TileMode.CLAMP, TileMode.CLAMP); 
      Paint paint = new Paint(); 
      paint.setAntiAlias(true); 
      paint.setShader(shader); 

      Canvas canvas = new Canvas(canvasBitmap); 
      float radius = width > height ? ((float) height)/2f : ((float) width)/2f; 
      canvas.drawCircle(width/2, height/2, radius, paint); 

      //border code 
      paint.setShader(null); 
      paint.setStyle(Paint.Style.STROKE); 
      paint.setColor(bordercolor); 
      paint.setStrokeWidth(borderwidth); 
      canvas.drawCircle(width/2, height/2, radius - borderwidth/2, paint); 
      //-------------------------------------- 

      if (canvasBitmap != source) { 
       source.recycle(); 
      } 

      return canvasBitmap; 
} 
@Override 
    public String key() { 
     return "circle"; 
    } 
} 
14

Другим вариантом я нашел этого ребята л ibrary. Он работает автономно или совместно с Пикассо. Я выбрал путь Пикассо, как показано ниже:

https://github.com/vinc3m1/RoundedImageView

Transformation transformation = new RoundedTransformationBuilder() 
      .borderColor(Color.BLACK) 
      .borderWidthDp(3) 
      .cornerRadiusDp(30) 
      .oval(false) 
      .build(); 

Picasso.with(context) 
    .load(url) 
    .fit() 
    .transform(transformation) 
    .into(imageView); 

работал для меня!

+0

Спасибо, что спасли мой день! – RobertoAllende

+0

Настолько прост в использовании, и похоже, что библиотека не одна из тех, что были оставлены много лет назад. Отличная находка! –

+0

Это должен быть принятый ответ! +1 – KinGPinG

2

Включите XML Drawable типа списка с Layer-кодом ниже

<layer-list xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item android:id="@+id/shape_status"> 
     <shape android:shape="oval"> 
      <solid android:color="@android:color/black"/> 
     </shape> 
    </item> 
<item android:drawable="@drawable/ic_status_content"/></layer-list> 

затем использовать XML для вашего ImageView в android.src

<ImageView 
      android:id="@+id/iconStatus" 
      android:layout_width="55dp" 
      android:layout_height="55dp" 
      android:layout_gravity="right" 
      android:src="@drawable/ic_circle_status" 
      android:layout_alignParentTop="true" 
      android:layout_alignParentEnd="true"/> 
32

здесь нечто, что, предоставленную поддержка-v4 библиотека! Посмотрите на RoundedBitmapDrawable. Нет необходимости свернуть свой собственный:

Picasso.with(context).load(url) 
         .resize(w, h) 
         .into(myImageView, new Callback() { 
          @Override 
          public void onSuccess() { 
           Bitmap imageBitmap = ((BitmapDrawable) myImageView.getDrawable()).getBitmap(); 
           RoundedBitmapDrawable imageDrawable = RoundedBitmapDrawableFactory.create(getResources(), imageBitmap); 
           imageDrawable.setCircular(true); 
           imageDrawable.setCornerRadius(Math.max(imageBitmap.getWidth(), imageBitmap.getHeight())/2.0f); 
           myImageView.setImageDrawable(imageDrawable); 
          } 
          @Override 
          public void onError() { 
           myImageView.setImageResource(R.drawable.default_image); 
          } 
         }); 

Примечание: Пикассо также имеет .transform (customTransformation) вызов, который вы могли бы теоретически использовать, однако, у меня были проблемы с этим. Это выше. Удачи!

+0

Это должен быть принятый ответ – gmazzo

+1

Это лучшее решение, которое я нашел до сих пор. –

+0

Это идеально подходит для квадратного изображения. Используйте Math.min в угловом радиусе для любого изображения. imageDrawable.setCornerRadius (Math.min (imageBitmap.getWidth(), imageBitmap.getHeight())/2.0f); – Xplosive

Смежные вопросы