RoundedImageView的使用

来源：互联网发布：淘宝卖家开通花呗条件编辑：程序博客网时间：2024/06/17 12:09

Android 将图片快速转换成圆角的方法

使用开源项目 RoundedImageView

github上面的开源项目官方地址为: https://github.com/vinc3m1/RoundedImageView

效果如下:

下面快速的集成进来

步骤分为3个

1: 去github上下载工程

https://github.com/vinc3m1/RoundedImageView

2: 导入工程

3 在布局中使用它

[java] view plain copy

print?

<com.makeramen.rounded.RoundedImageView
android:id=”@+id/imageView1”
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_alignParentTop=”true”
android:layout_alignParentBottom=”true”
android:layout_alignParentRight=”true”
android:layout_alignParentLeft=”true”
android:padding=”10dip”
android:src=”@drawable/photo1”
android:scaleType=”center”
makeramen:corner_radius=”30dip”
makeramen:border_width=”2dip”
makeramen:border_color=”#333333” />

    <com.makeramen.rounded.RoundedImageView        android:id="@+id/imageView1"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_alignParentTop="true"        android:layout_alignParentBottom="true"        android:layout_alignParentRight="true"        android:layout_alignParentLeft="true"        android:padding="10dip"        android:src="@drawable/photo1"        android:scaleType="center"        makeramen:corner_radius="30dip"        makeramen:border_width="2dip"        makeramen:border_color="#333333" />

属性的意义:

makeramen:border_width=”2dip” 表示图片的边框宽度为2个dp

makeramen: corner_radius表示为图片转圆角的弧度

修改 makeramen:corner_radius=”100dip”

当 corner_radius 设置为100dp 的时候会呈现为圆形 .

( 注: com.makeramen.rounded.RoundedImageView 控件的宽和高需要相等 )

修改了example中的 rounded_item.xml

[html] view plain copy

print?

<?xml version=“1.0” encoding=“utf-8”?>
<!–
Copyright (C) 2013 Make Ramen, LLC
–>
<RelativeLayout
xmlns:android=“http://schemas.android.com/apk/res/android”
xmlns:makeramen=“http://schemas.android.com/apk/res/com.makeramen.rounded.example”
android:layout_width=“match_parent”
android:layout_height=“200dip”>
<com.makeramen.rounded.RoundedImageView
android:id=“@+id/imageView1”
android:layout_width=“200dp”
android:layout_height=“200dp”
android:padding=“10dip”
android:src=“@drawable/photo1”
android:scaleType=“center”
makeramen:corner_radius=“100dp”
makeramen:border_width=“2dip”
makeramen:border_color=“#333333” />
<TextView
android:id=“@+id/textView3”
android:layout_width=“wrap_content”
android:layout_height=“wrap_content”
android:layout_marginBottom=“36dp”
android:layout_marginLeft=“36dp”
android:layout_alignBottom=“@+id/imageView1”
android:layout_alignLeft=“@+id/imageView1”
android:background=“#7f000000”
android:paddingLeft=“8dp”
android:paddingRight=“8dp”
android:textAppearance=“?android:attr/textAppearanceSmallInverse” />
<TextView
android:id=“@+id/textView2”
android:layout_width=“wrap_content”
android:layout_height=“wrap_content”
android:layout_above=“@+id/textView3”
android:layout_alignLeft=“@+id/textView3”
android:layout_marginBottom=“4dp”
android:background=“#7f000000”
android:paddingLeft=“8dp”
android:paddingRight=“8dp”
android:textAppearance=“?android:attr/textAppearanceMediumInverse” />
<TextView
android:id=“@+id/textView1”
android:layout_width=“wrap_content”
android:layout_height=“wrap_content”
android:layout_above=“@+id/textView2”
android:layout_alignLeft=“@+id/textView2”
android:layout_marginBottom=“4dp”
android:background=“#7f000000”
android:paddingLeft=“8dp”
android:paddingRight=“8dp”
android:textAppearance=“?android:attr/textAppearanceLargeInverse” />
</RelativeLayout>

<?xml version="1.0" encoding="utf-8"?><!--     Copyright (C) 2013 Make Ramen, LLC--><RelativeLayout    xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:makeramen="http://schemas.android.com/apk/res/com.makeramen.rounded.example"    android:layout_width="match_parent"    android:layout_height="200dip">    <com.makeramen.rounded.RoundedImageView        android:id="@+id/imageView1"        android:layout_width="200dp"        android:layout_height="200dp"        android:padding="10dip"        android:src="@drawable/photo1"        android:scaleType="center"        makeramen:corner_radius="100dp"        makeramen:border_width="2dip"        makeramen:border_color="#333333" />    <TextView        android:id="@+id/textView3"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_marginBottom="36dp"        android:layout_marginLeft="36dp"        android:layout_alignBottom="@+id/imageView1"        android:layout_alignLeft="@+id/imageView1"        android:background="#7f000000"        android:paddingLeft="8dp"        android:paddingRight="8dp"        android:textAppearance="?android:attr/textAppearanceSmallInverse" />    <TextView        android:id="@+id/textView2"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_above="@+id/textView3"        android:layout_alignLeft="@+id/textView3"        android:layout_marginBottom="4dp"        android:background="#7f000000"        android:paddingLeft="8dp"        android:paddingRight="8dp"        android:textAppearance="?android:attr/textAppearanceMediumInverse" />    <TextView        android:id="@+id/textView1"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_above="@+id/textView2"        android:layout_alignLeft="@+id/textView2"        android:layout_marginBottom="4dp"        android:background="#7f000000"        android:paddingLeft="8dp"        android:paddingRight="8dp"        android:textAppearance="?android:attr/textAppearanceLargeInverse" /></RelativeLayout>

如下图:

用代码创建 :

[java] view plain copy

print?

RoundedImageView iv = new RoundedImageView(context);
iv.setScaleType(ScaleType.CENTER_CROP);
iv.setCornerRadius(10);
iv.setBorderWidth(2);
iv.setBorderColor(Color.DKGRAY);
iv.setRoundedBackground(true);
iv.setImageDrawable(drawable);
iv.setBackground(backgroundDrawable);
iv.setOval(true);

RoundedImageView iv = new RoundedImageView(context);iv.setScaleType(ScaleType.CENTER_CROP);iv.setCornerRadius(10);iv.setBorderWidth(2);iv.setBorderColor(Color.DKGRAY);iv.setRoundedBackground(true);iv.setImageDrawable(drawable);iv.setBackground(backgroundDrawable);iv.setOval(true);

贴上部分源码:

[java] view plain copy

print?

package com.makeramen;
import android.content.Context;
import android.content.res.ColorStateList;
import android.content.res.Resources;
import android.content.res.TypedArray;
import android.graphics.Bitmap;
import android.graphics.drawable.Drawable;
import android.graphics.drawable.LayerDrawable;
import android.net.Uri;
import android.util.AttributeSet;
import android.util.Log;
import android.widget.ImageView;
@SuppressWarnings(“UnusedDeclaration”)
public class RoundedImageView extends ImageView {
public static final String TAG = “RoundedImageView”;
public static final float DEFAULT_RADIUS = 0f;
public static final float DEFAULT_BORDER_WIDTH = 0f;
private static final ScaleType[] SCALE_TYPES = {
ScaleType.MATRIX,
ScaleType.FIT_XY,
ScaleType.FIT_START,
ScaleType.FIT_CENTER,
ScaleType.FIT_END,
ScaleType.CENTER,
ScaleType.CENTER_CROP,
ScaleType.CENTER_INSIDE
};
private float cornerRadius = DEFAULT_RADIUS;
private float borderWidth = DEFAULT_BORDER_WIDTH;
private ColorStateList borderColor =
ColorStateList.valueOf(RoundedDrawable.DEFAULT_BORDER_COLOR);
private boolean isOval = false;
private boolean mutateBackground = false;
private int mResource;
private Drawable mDrawable;
private Drawable mBackgroundDrawable;
private ScaleType mScaleType;
public RoundedImageView(Context context) {
super(context);
}
public RoundedImageView(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public RoundedImageView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.RoundedImageView, defStyle, 0);
int index = a.getInt(R.styleable.RoundedImageView_android_scaleType, -1);
if (index >= 0) {
setScaleType(SCALE_TYPES[index]);
} else {
// default scaletype to FIT_CENTER
setScaleType(ScaleType.FIT_CENTER);
}
cornerRadius = a.getDimensionPixelSize(R.styleable.RoundedImageView_corner_radius, -1);
borderWidth = a.getDimensionPixelSize(R.styleable.RoundedImageView_border_width, -1);
// don’t allow negative values for radius and border
if (cornerRadius < 0) {
cornerRadius = DEFAULT_RADIUS;
}
if (borderWidth < 0) {
borderWidth = DEFAULT_BORDER_WIDTH;
}
borderColor = a.getColorStateList(R.styleable.RoundedImageView_border_color);
if (borderColor == null) {
borderColor = ColorStateList.valueOf(RoundedDrawable.DEFAULT_BORDER_COLOR);
}
mutateBackground = a.getBoolean(R.styleable.RoundedImageView_mutate_background, false);
isOval = a.getBoolean(R.styleable.RoundedImageView_oval, false);
updateDrawableAttrs();
updateBackgroundDrawableAttrs(true);
a.recycle();
}
@Override
protected void drawableStateChanged() {
super.drawableStateChanged();
invalidate();
}
/**
* Return the current scale type in use by this ImageView.
*
* @attr ref android.R.styleable#ImageView_scaleType
* @see android.widget.ImageView.ScaleType
*/
@Override
public ScaleType getScaleType() {
return mScaleType;
}
/**
* Controls how the image should be resized or moved to match the size
* of this ImageView.
*
* @param scaleType The desired scaling mode.
* @attr ref android.R.styleable#ImageView_scaleType
*/
@Override
public void setScaleType(ScaleType scaleType) {
assert scaleType != null;
if (mScaleType != scaleType) {
mScaleType = scaleType;
switch (scaleType) {
case CENTER:
case CENTER_CROP:
case CENTER_INSIDE:
case FIT_CENTER:
case FIT_START:
case FIT_END:
case FIT_XY:
super.setScaleType(ScaleType.FIT_XY);
break;
default:
super.setScaleType(scaleType);
break;
}
updateDrawableAttrs();
updateBackgroundDrawableAttrs(false);
invalidate();
}
}
@Override
public void setImageDrawable(Drawable drawable) {
mResource = 0;
mDrawable = RoundedDrawable.fromDrawable(drawable);
updateDrawableAttrs();
super.setImageDrawable(mDrawable);
}
@Override
public void setImageBitmap(Bitmap bm) {
mResource = 0;
mDrawable = RoundedDrawable.fromBitmap(bm);
updateDrawableAttrs();
super.setImageDrawable(mDrawable);
}
@Override
public void setImageResource(int resId) {
if (mResource != resId) {
mResource = resId;
mDrawable = resolveResource();
updateDrawableAttrs();
super.setImageDrawable(mDrawable);
}
}
@Override public void setImageURI(Uri uri) {
super.setImageURI(uri);
setImageDrawable(getDrawable());
}
private Drawable resolveResource() {
Resources rsrc = getResources();
if (rsrc == null) { return null; }
Drawable d = null;
if (mResource != 0) {
try {
d = rsrc.getDrawable(mResource);
} catch (Exception e) {
Log.w(TAG, ”Unable to find resource: ” + mResource, e);
// Don’t try again.
mResource = 0;
}
}
return RoundedDrawable.fromDrawable(d);
}
@Override
public void setBackground(Drawable background) {
setBackgroundDrawable(background);
}
private void updateDrawableAttrs() {
updateAttrs(mDrawable);
}
private void updateBackgroundDrawableAttrs(boolean convert) {
if (mutateBackground) {
if (convert) {
mBackgroundDrawable = RoundedDrawable.fromDrawable(mBackgroundDrawable);
}
updateAttrs(mBackgroundDrawable);
}
}
private void updateAttrs(Drawable drawable) {
if (drawable == null) { return; }
if (drawable instanceof RoundedDrawable) {
((RoundedDrawable) drawable)
.setScaleType(mScaleType)
.setCornerRadius(cornerRadius)
.setBorderWidth(borderWidth)
.setBorderColor(borderColor)
.setOval(isOval);
} else if (drawable instanceof LayerDrawable) {
// loop through layers to and set drawable attrs
LayerDrawable ld = ((LayerDrawable) drawable);
for (int i = 0, layers = ld.getNumberOfLayers(); i < layers; i++) {
updateAttrs(ld.getDrawable(i));
}
}
}
@Override
@Deprecated
public void setBackgroundDrawable(Drawable background) {
mBackgroundDrawable = background;
updateBackgroundDrawableAttrs(true);
super.setBackgroundDrawable(mBackgroundDrawable);
}
public float getCornerRadius() {
return cornerRadius;
}
public void setCornerRadius(int resId) {
setCornerRadius(getResources().getDimension(resId));
}
public void setCornerRadius(float radius) {
if (cornerRadius == radius) { return; }
cornerRadius = radius;
updateDrawableAttrs();
updateBackgroundDrawableAttrs(false);
}
public float getBorderWidth() {
return borderWidth;
}
public void setBorderWidth(int resId) {
setBorderWidth(getResources().getDimension(resId));
}
public void setBorderWidth(float width) {
if (borderWidth == width) { return; }
borderWidth = width;
updateDrawableAttrs();
updateBackgroundDrawableAttrs(false);
invalidate();
}
public int getBorderColor() {
return borderColor.getDefaultColor();
}
public void setBorderColor(int color) {
setBorderColor(ColorStateList.valueOf(color));
}
public ColorStateList getBorderColors() {
return borderColor;
}
public void setBorderColor(ColorStateList colors) {
if (borderColor.equals(colors)) { return; }
borderColor =
(colors != null) ? colors : ColorStateList.valueOf(RoundedDrawable.DEFAULT_BORDER_COLOR);
updateDrawableAttrs();
updateBackgroundDrawableAttrs(false);
if (borderWidth > 0) {
invalidate();
}
}
public boolean isOval() {
return isOval;
}
public void setOval(boolean oval) {
isOval = oval;
updateDrawableAttrs();
updateBackgroundDrawableAttrs(false);
invalidate();
}
public boolean isMutateBackground() {
return mutateBackground;
}
public void setMutateBackground(boolean mutate) {
if (mutateBackground == mutate) { return; }
mutateBackground = mutate;
updateBackgroundDrawableAttrs(true);
invalidate();
}
}

package com.makeramen;import android.content.Context;import android.content.res.ColorStateList;import android.content.res.Resources;import android.content.res.TypedArray;import android.graphics.Bitmap;import android.graphics.drawable.Drawable;import android.graphics.drawable.LayerDrawable;import android.net.Uri;import android.util.AttributeSet;import android.util.Log;import android.widget.ImageView;@SuppressWarnings("UnusedDeclaration")public class RoundedImageView extends ImageView {  public static final String TAG = "RoundedImageView";  public static final float DEFAULT_RADIUS = 0f;  public static final float DEFAULT_BORDER_WIDTH = 0f;  private static final ScaleType[] SCALE_TYPES = {      ScaleType.MATRIX,      ScaleType.FIT_XY,      ScaleType.FIT_START,      ScaleType.FIT_CENTER,      ScaleType.FIT_END,      ScaleType.CENTER,      ScaleType.CENTER_CROP,      ScaleType.CENTER_INSIDE  };  private float cornerRadius = DEFAULT_RADIUS;  private float borderWidth = DEFAULT_BORDER_WIDTH;  private ColorStateList borderColor =      ColorStateList.valueOf(RoundedDrawable.DEFAULT_BORDER_COLOR);  private boolean isOval = false;  private boolean mutateBackground = false;  private int mResource;  private Drawable mDrawable;  private Drawable mBackgroundDrawable;  private ScaleType mScaleType;  public RoundedImageView(Context context) {    super(context);  }  public RoundedImageView(Context context, AttributeSet attrs) {    this(context, attrs, 0);  }  public RoundedImageView(Context context, AttributeSet attrs, int defStyle) {    super(context, attrs, defStyle);    TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.RoundedImageView, defStyle, 0);    int index = a.getInt(R.styleable.RoundedImageView_android_scaleType, -1);    if (index >= 0) {      setScaleType(SCALE_TYPES[index]);    } else {      // default scaletype to FIT_CENTER      setScaleType(ScaleType.FIT_CENTER);    }    cornerRadius = a.getDimensionPixelSize(R.styleable.RoundedImageView_corner_radius, -1);    borderWidth = a.getDimensionPixelSize(R.styleable.RoundedImageView_border_width, -1);    // don't allow negative values for radius and border    if (cornerRadius < 0) {      cornerRadius = DEFAULT_RADIUS;    }    if (borderWidth < 0) {      borderWidth = DEFAULT_BORDER_WIDTH;    }    borderColor = a.getColorStateList(R.styleable.RoundedImageView_border_color);    if (borderColor == null) {      borderColor = ColorStateList.valueOf(RoundedDrawable.DEFAULT_BORDER_COLOR);    }    mutateBackground = a.getBoolean(R.styleable.RoundedImageView_mutate_background, false);    isOval = a.getBoolean(R.styleable.RoundedImageView_oval, false);    updateDrawableAttrs();    updateBackgroundDrawableAttrs(true);    a.recycle();  }  @Override  protected void drawableStateChanged() {    super.drawableStateChanged();    invalidate();  }  /**   * Return the current scale type in use by this ImageView.   *   * @attr ref android.R.styleable#ImageView_scaleType   * @see android.widget.ImageView.ScaleType   */  @Override  public ScaleType getScaleType() {    return mScaleType;  }  /**   * Controls how the image should be resized or moved to match the size   * of this ImageView.   *   * @param scaleType The desired scaling mode.   * @attr ref android.R.styleable#ImageView_scaleType   */  @Override  public void setScaleType(ScaleType scaleType) {    assert scaleType != null;    if (mScaleType != scaleType) {      mScaleType = scaleType;      switch (scaleType) {        case CENTER:        case CENTER_CROP:        case CENTER_INSIDE:        case FIT_CENTER:        case FIT_START:        case FIT_END:        case FIT_XY:          super.setScaleType(ScaleType.FIT_XY);          break;        default:          super.setScaleType(scaleType);          break;      }      updateDrawableAttrs();      updateBackgroundDrawableAttrs(false);      invalidate();    }  }  @Override  public void setImageDrawable(Drawable drawable) {    mResource = 0;    mDrawable = RoundedDrawable.fromDrawable(drawable);    updateDrawableAttrs();    super.setImageDrawable(mDrawable);  }  @Override  public void setImageBitmap(Bitmap bm) {    mResource = 0;    mDrawable = RoundedDrawable.fromBitmap(bm);    updateDrawableAttrs();    super.setImageDrawable(mDrawable);  }  @Override  public void setImageResource(int resId) {    if (mResource != resId) {      mResource = resId;      mDrawable = resolveResource();      updateDrawableAttrs();      super.setImageDrawable(mDrawable);    }  }  @Override public void setImageURI(Uri uri) {    super.setImageURI(uri);    setImageDrawable(getDrawable());  }  private Drawable resolveResource() {    Resources rsrc = getResources();    if (rsrc == null) { return null; }    Drawable d = null;    if (mResource != 0) {      try {        d = rsrc.getDrawable(mResource);      } catch (Exception e) {        Log.w(TAG, "Unable to find resource: " + mResource, e);        // Don't try again.        mResource = 0;      }    }    return RoundedDrawable.fromDrawable(d);  }  @Override  public void setBackground(Drawable background) {    setBackgroundDrawable(background);  }  private void updateDrawableAttrs() {    updateAttrs(mDrawable);  }  private void updateBackgroundDrawableAttrs(boolean convert) {    if (mutateBackground) {      if (convert) {        mBackgroundDrawable = RoundedDrawable.fromDrawable(mBackgroundDrawable);      }      updateAttrs(mBackgroundDrawable);    }  }  private void updateAttrs(Drawable drawable) {    if (drawable == null) { return; }    if (drawable instanceof RoundedDrawable) {      ((RoundedDrawable) drawable)          .setScaleType(mScaleType)          .setCornerRadius(cornerRadius)          .setBorderWidth(borderWidth)          .setBorderColor(borderColor)          .setOval(isOval);    } else if (drawable instanceof LayerDrawable) {      // loop through layers to and set drawable attrs      LayerDrawable ld = ((LayerDrawable) drawable);      for (int i = 0, layers = ld.getNumberOfLayers(); i < layers; i++) {        updateAttrs(ld.getDrawable(i));      }    }  }  @Override  @Deprecated  public void setBackgroundDrawable(Drawable background) {    mBackgroundDrawable = background;    updateBackgroundDrawableAttrs(true);    super.setBackgroundDrawable(mBackgroundDrawable);  }  public float getCornerRadius() {    return cornerRadius;  }  public void setCornerRadius(int resId) {    setCornerRadius(getResources().getDimension(resId));  }  public void setCornerRadius(float radius) {    if (cornerRadius == radius) { return; }    cornerRadius = radius;    updateDrawableAttrs();    updateBackgroundDrawableAttrs(false);  }  public float getBorderWidth() {    return borderWidth;  }  public void setBorderWidth(int resId) {    setBorderWidth(getResources().getDimension(resId));  }  public void setBorderWidth(float width) {    if (borderWidth == width) { return; }    borderWidth = width;    updateDrawableAttrs();    updateBackgroundDrawableAttrs(false);    invalidate();  }  public int getBorderColor() {    return borderColor.getDefaultColor();  }  public void setBorderColor(int color) {    setBorderColor(ColorStateList.valueOf(color));  }  public ColorStateList getBorderColors() {    return borderColor;  }  public void setBorderColor(ColorStateList colors) {    if (borderColor.equals(colors)) { return; }    borderColor =        (colors != null) ? colors : ColorStateList.valueOf(RoundedDrawable.DEFAULT_BORDER_COLOR);    updateDrawableAttrs();    updateBackgroundDrawableAttrs(false);    if (borderWidth > 0) {      invalidate();    }  }  public boolean isOval() {    return isOval;  }  public void setOval(boolean oval) {    isOval = oval;    updateDrawableAttrs();    updateBackgroundDrawableAttrs(false);    invalidate();  }  public boolean isMutateBackground() {    return mutateBackground;  }  public void setMutateBackground(boolean mutate) {    if (mutateBackground == mutate) { return; }    mutateBackground = mutate;    updateBackgroundDrawableAttrs(true);    invalidate();  }}

小记: 太方便了真心感谢开源者

每日精进一点点谢谢

0 0

RoundedImageView的使用

1: 去github上下载 工程

2: 导入工程

3 在布局中使用它

1: 去github上下载工程