2016-08-31 60 views
0

我正在使用https://github.com/hdodenhof/CircleImageView庫,但也嘗試了其他幾種,但沒有幫助。我需要使用畢加索從服務器加載圖像,如mPicasso.load(url).into(mCircularImageView)。不過,我總是得到這樣的:enter image description here縮放畢加索位圖以填充CircleImageView中的高度

但我要實現這一點:

enter image description here

嘗試致電resize(100,100)fit()transform(new CircleTransorm())

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"; 
    } 
} 

沒有任何幫助以上。

我的佈局:

<de.hdodenhof.circleimageview.CircleImageView 
     android:id="@+id/account_profile_picture" 
     style="@style/ProfilePicture" 
     android:layout_gravity="center_horizontal"/> 

風格:

<style name="ProfilePicture"> 
    <item name="android:layout_width">@dimen/profile_picture_size</item> 
    <item name="android:layout_height">@dimen/profile_picture_size</item> 
    <item name="android:src">@drawable/profile_picture_placeholder</item> 
    <item name="civ_border_width">1dp</item> 
    <item name="civ_border_color">#FF000000</item> 
</style> 

回答

0

fit()推遲呼叫,直到視圖被加載和測量,它並沒有達到你想要的結果。您需要,以達到預期的產量增加centerCrop()

mPicasso.load(url).fit().centerCrop().into(mCircularImageView) 
+0

不幸的是,這並沒有奏效。 – satorikomeiji

+0

然後確保您的佈局設置正確。你能用你的佈局xml更新你的原始問題嗎? – anthonymonori

0

就在這個屬性設爲您的circleimageview

android:scaleType="centerCrop" 

這應該這樣做。

謝謝

0

請使用此您可以創建動態的ImageView,我希望這會幫助你。

public class RoundedImageView extends ImageView { 

    public RoundedImageView(Context context) { 
     super(context); 
    } 

    public RoundedImageView(Context context, AttributeSet attrs) { 
     super(context, attrs); 
    } 

    public RoundedImageView(Context context, AttributeSet attrs, int defStyle) { 
     super(context, attrs, defStyle); 
    } 

    @Override 
    protected void onDraw(Canvas canvas) { 

     Drawable drawable = getDrawable(); 

     if (drawable == null) { 
      return; 
     } 

     if (getWidth() == 0 || getHeight() == 0) { 
      return; 
     } 
     Bitmap b = ((BitmapDrawable) drawable).getBitmap(); 
     Bitmap bitmap = b.copy(Bitmap.Config.ARGB_8888, true); 

     int w = getWidth(), h = getHeight(); 

     Bitmap roundBitmap = getCroppedBitmap(bitmap, w); 
     canvas.drawBitmap(roundBitmap, 0, 0, null); 

    } 

    public static Bitmap getCroppedBitmap(Bitmap bmp, int radius) { 
     Bitmap sbmp; 

     if (bmp.getWidth() != radius || bmp.getHeight() != radius) { 
      float smallest = Math.min(bmp.getWidth(), bmp.getHeight()); 
      float factor = smallest/radius; 
      sbmp = Bitmap.createScaledBitmap(bmp, (int)(bmp.getWidth()/factor), (int)(bmp.getHeight()/factor), false); 
     } else { 
      sbmp = bmp; 
     } 

     Bitmap output = Bitmap.createBitmap(radius, radius, Bitmap.Config.ARGB_8888); 
     Canvas canvas = new Canvas(output); 

     final int color = 0xffa19774; 
     final Paint paint = new Paint(); 
     final Rect rect = new Rect(0, 0, radius, radius); 

     paint.setAntiAlias(true); 
     paint.setFilterBitmap(true); 
     paint.setDither(true); 
     canvas.drawARGB(0, 0, 0, 0); 
     paint.setColor(Color.parseColor("#BAB399")); 
     canvas.drawCircle(radius/2 + 0.7f, 
       radius/2 + 0.7f, radius/2 + 0.1f, paint); 
     paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN)); 
     canvas.drawBitmap(sbmp, rect, rect, paint); 

     return output; 
    } 

} 
0

您不需要爲圓形圖像視圖添加任何庫。 Android的API已經提供

RoundedBitmapDrawable

用於此目的。我已經使用Glide庫做你想要的東西 -

Glide.with(context) 
        .load(imageUrl) 
        .asBitmap() 
        .placeholder(R.color.gray) 
        .diskCacheStrategy(DiskCacheStrategy.ALL) 
        .centerCrop() 
        .into(new BitmapImageViewTarget(imageView){ 
         @Override 
         public void onResourceReady(Bitmap resource, GlideAnimation<? super Bitmap> glideAnimation) { 
          RoundedBitmapDrawable circularBitmapDrawable = 
            RoundedBitmapDrawableFactory.create(context.getResources(), resource); 
          circularBitmapDrawable.setCircular(true); 
          imageView.setImageDrawable(circularBitmapDrawable); 
         } 

         @Override 
         public void onLoadFailed(Exception e, Drawable errorDrawable) { 
          imageView.setImageResource(R.drawable.profile); 
         } 
        }); 
0

我所看到的在你的代碼是你同時使用循環轉化和循環圖像視圖。對於製作圓圈,您只能使用一種方法,我建議使用圓形轉換也將您的圓圈圖像視圖更改爲簡單圖像視圖。

mPicasso.load(url).resize(300,300).centerCrop().transform (new CircleTransform()).into(mImageView); 

希望這會有所幫助。