그렇다면 글라이드로 모서리가 둥근 이미지를 표시하는 방법을 아는 사람이 있습니까? 글라이드로 이미지를로드하고 있지만 둥근 매개 변수를이 라이브러리에 전달하는 방법을 모르겠습니다.
다음 예제와 같이 이미지를 표시해야합니다.
답변
글라이드 V4 :
Glide.with(context)
.load(url)
.circleCrop()
.into(imageView);
글라이드 V3 :
RoundedBitmapDrawable
글라이드로 원형 이미지에 사용할 수 있습니다 . 사용자 정의 ImageView가 필요하지 않습니다.
Glide.with(context).load(url).asBitmap().centerCrop().into(new BitmapImageViewTarget(imageView) {
@Override
protected void setResource(Bitmap resource) {
RoundedBitmapDrawable circularBitmapDrawable =
RoundedBitmapDrawableFactory.create(context.getResources(), resource);
circularBitmapDrawable.setCircular(true);
imageView.setImageDrawable(circularBitmapDrawable);
}
});
답변
이 글을 확인하십시오 . glide vs picasso …
편집 : 연결된 게시물이 라이브러리의 중요한 차이점을 불러 일으키지 않습니다. 글라이드는 재활용을 자동으로 수행합니다. 자세한 내용은 TWiStErRob의 의견 을 참조하십시오 .
Glide.with(this).load(URL).transform(new CircleTransform(context)).into(imageView);
public static class CircleTransform extends BitmapTransformation {
public CircleTransform(Context context) {
super(context);
}
@Override protected Bitmap transform(BitmapPool pool, Bitmap toTransform, int outWidth, int outHeight) {
return circleCrop(pool, toTransform);
}
private static Bitmap circleCrop(BitmapPool pool, Bitmap source) {
if (source == null) return null;
int size = Math.min(source.getWidth(), source.getHeight());
int x = (source.getWidth() - size) / 2;
int y = (source.getHeight() - size) / 2;
// TODO this could be acquired from the pool too
Bitmap squared = Bitmap.createBitmap(source, x, y, size, size);
Bitmap result = pool.get(size, size, Bitmap.Config.ARGB_8888);
if (result == null) {
result = Bitmap.createBitmap(size, size, Bitmap.Config.ARGB_8888);
}
Canvas canvas = new Canvas(result);
Paint paint = new Paint();
paint.setShader(new BitmapShader(squared, BitmapShader.TileMode.CLAMP, BitmapShader.TileMode.CLAMP));
paint.setAntiAlias(true);
float r = size / 2f;
canvas.drawCircle(r, r, r, paint);
return result;
}
@Override public String getId() {
return getClass().getName();
}
}
답변
가장 쉬운 방법 (Glide 4.xx 필요)
Glide.with(context).load(uri).apply(RequestOptions().circleCrop()).into(imageView)
답변
이 방법으로 시도
암호
Glide.with(this)
.load(R.drawable.thumbnail)
.bitmapTransform(new CropCircleTransformation(this))
.into(mProfile);
XML
<ImageView
android:id="@+id/img_profile"
android:layout_width="76dp"
android:layout_height="76dp"
android:background="@drawable/all_circle_white_bg"
android:padding="1dp"/>
all_circle_white_bg.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="oval">
<solid android:color="@android:color/white"/>
</shape>
</item>
</selector>
- 이 변환 라이브러리를 사용합니다. -> https://github.com/wasabeef/glide-transformations
- 원 스트로크 너비는 ImageView의 패딩입니다.
답변
매우 간단합니다. Glide 라이브러리는 발리 Google 라이브러리의 훌륭한 라이브러리 및 에세이 기반입니다.
둥근 이미지보기에이 라이브러리 사용
https://github.com/hdodenhof/CircleImageView
지금
// 간단한보기 :
@Override
public void onCreate(Bundle savedInstanceState) {
...
CircleImageView civProfilePic = (CircleImageView)findViewById(R.id.ivProfile);
Glide.load("http://goo.gl/h8qOq7").into(civProfilePic);
}
// 목록 :
@Override
public View getView(int position, View recycled, ViewGroup container) {
final ImageView myImageView;
if (recycled == null) {
myImageView = (CircleImageView) inflater.inflate(R.layout.my_image_view,
container, false);
} else {
myImageView = (CircleImageView) recycled;
}
String url = myUrls.get(position);
Glide.load(url)
.centerCrop()
.placeholder(R.drawable.loading_spinner)
.animate(R.anim.fade_in)
.into(myImageView);
return myImageView;
}
그리고 XML로
<de.hdodenhof.circleimageview.CircleImageView
android:id="@+id/ivProfile
android:layout_width="160dp"
android:layout_height="160dp"
android:layout_centerInParent="true"
android:src="@drawable/hugh"
app:border_width="2dp"
app:border_color="@color/dark" />
답변
다른 솔루션은 저에게 효과적이지 않았습니다. 나는 그들 모두 중요한 결점을 발견했다.
- 글라이드 변환을 사용하는 솔루션은 자리 표시 자와 함께 작동하지 않습니다
- 둥근 이미지 뷰를 사용하는 솔루션은 애니메이션에서 작동하지 않습니다 (예 : 크로스 페이드).
- 자식을 클립하는 부모의 일반적인 방법을 사용하는 솔루션 (예 : 여기 에서 허용되는 답변 )은 글라이드에서 잘 작동하지 않습니다.
이것으로 혼란스럽게 한 후 둥근 모서리와 원 에 대한 Fresco 라이브러리 페이지를 발견했으며 기본적으로 동일한 제한 사항을 나열하고 진술로 결론을 내린다 는 것이 정말 흥미 롭습니다 .
안드로이드의 모서리를 둥글게하는 좋은 해결책은 없으며 위에서 언급 한 트레이드 오프 중에서 선택해야합니다.
현재로서는 아직 실제 솔루션이 없습니다. 위의 링크를 기반으로 한 대체 솔루션이 있습니다. 이 방법의 단점은 배경이 단색이라고 가정한다는 것입니다 (모서리는 실제로 투명하지 않습니다). 다음과 같이 사용하십시오.
<RoundedCornerLayout ...>
<ImageView ...>
</RoundedCornerLayout>
요지는 여기에 있고 전체 코드는 여기에 있습니다 :
public class RoundedCornerLayout extends RelativeLayout {
private Bitmap maskBitmap;
private Paint paint;
private float cornerRadius;
public RoundedCornerLayout(Context context) {
super(context);
init(context, null, 0);
}
public RoundedCornerLayout(Context context, AttributeSet attrs) {
super(context, attrs);
init(context, attrs, 0);
}
public RoundedCornerLayout(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
init(context, attrs, defStyle);
}
private void init(Context context, AttributeSet attrs, int defStyle) {
paint = new Paint(Paint.ANTI_ALIAS_FLAG);
setWillNotDraw(false);
}
@Override
public void draw(Canvas canvas) {
super.draw(canvas);
if (maskBitmap == null) {
// This corner radius assumes the image width == height and you want it to be circular
// Otherwise, customize the radius as needed
cornerRadius = canvas.getWidth() / 2;
maskBitmap = createMask(canvas.getWidth(), canvas.getHeight());
}
canvas.drawBitmap(maskBitmap, 0f, 0f, paint);
}
private Bitmap createMask(int width, int height) {
Bitmap mask = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(mask);
Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
paint.setColor(Color.WHITE); // TODO set your background color as needed
canvas.drawRect(0, 0, width, height, paint);
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));
canvas.drawRoundRect(new RectF(0, 0, width, height), cornerRadius, cornerRadius, paint);
return mask;
}
}
답변
이제 글라이드 V4에서는 CircleCrop ()을 직접 사용할 수 있습니다
Glide.with(fragment)
.load(url)
.circleCrop()
.into(imageView);
내장 타입
- CenterCrop
- FitCenter
- 자르기