android

Question

我正在使用 volley 库从服务器中提取正方形的图像 URL。我想以圆形显示它。

在 volley 库中，我在 NetworkImageView 中设置图像，如：

profilepic.setImageUrl(imgURL, imageLoader);

Answer 1

您也可以为此使用简单的图像视图

  ImageLoader imageLoader = AppController.getInstance().getImageLoader();
 // If you are using normal ImageView
 imageLoader.get(Const.URL_IMAGE, new ImageListener() {

@Override
public void onErrorResponse(VolleyError error) {
    Log.e(TAG, "Image Load Error: " + error.getMessage());
}

@Override
public void onResponse(ImageContainer response, boolean arg1) {
    if (response.getBitmap() != null) {
        // load image into imageview
        imageView.setImageBitmap(response.getBitmap());
    }
  }
});

现在您可以使用 github

上可用的任何库来环绕图像视图

我最常使用的库之一

https://github.com/Pkmmte/CircularImageView

Answer 2

尽量利用这个

public class CircularNetworkImageView extends NetworkImageView {
private int borderWidth;
private int canvasSize;
private Bitmap image;
private Paint paint;
private Paint paintBorder;

public CircularNetworkImageView(final Context context) {
    this(context, null);
}

public CircularNetworkImageView(Context context, AttributeSet attrs) {
    this(context, attrs, R.attr.circularImageViewStyle);
}

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

    // init paint
    paint = new Paint();
    paint.setAntiAlias(true);

    paintBorder = new Paint();
    paintBorder.setAntiAlias(true);

    // load the styled attributes and set their properties
    TypedArray attributes = context.obtainStyledAttributes(attrs, R.styleable.CircularImageView, defStyle, 0);

    if(attributes.getBoolean(R.styleable.CircularImageView_border, true)) {
        int defaultBorderSize = (int) (4 * getContext().getResources().getDisplayMetrics().density + 0.5f);
        setBorderWidth(attributes.getDimensionPixelOffset(R.styleable.CircularImageView_border_width, defaultBorderSize));
        setBorderColor(attributes.getColor(R.styleable.CircularImageView_border_color, Color.WHITE));
    }

    if(attributes.getBoolean(R.styleable.CircularImageView_shadow, false))
        addShadow();
    attributes.recycle();
}

public void setBorderWidth(int borderWidth) {
    this.borderWidth = borderWidth;
    this.requestLayout();
    this.invalidate();
}

public void setBorderColor(int borderColor) {
    if (paintBorder != null)
        paintBorder.setColor(borderColor);
    this.invalidate();
}

public void addShadow() {
    setLayerType(LAYER_TYPE_SOFTWARE, paintBorder);
    paintBorder.setShadowLayer(4.0f, 0.0f, 2.0f, Color.BLACK);
}

@SuppressLint("DrawAllocation")
@Override
public void onDraw(Canvas canvas) {
    // load the bitmap
    image = drawableToBitmap(getDrawable());

    // init shader
    if (image != null) {

        canvasSize = canvas.getWidth();
        if(canvas.getHeight()<canvasSize)
            canvasSize = canvas.getHeight();

        BitmapShader shader = new BitmapShader(Bitmap.createScaledBitmap(image, canvasSize, canvasSize, false), Shader.TileMode.CLAMP, Shader.TileMode.CLAMP);
        paint.setShader(shader);

        // circleCenter is the x or y of the view's center
        // radius is the radius in pixels of the cirle to be drawn
        // paint contains the shader that will texture the shape
        int circleCenter = (canvasSize - (borderWidth * 2)) / 2;
        canvas.drawCircle(circleCenter + borderWidth, circleCenter + borderWidth, ((canvasSize - (borderWidth * 2)) / 2) + borderWidth - 4.0f, paintBorder);
        canvas.drawCircle(circleCenter + borderWidth, circleCenter + borderWidth, ((canvasSize - (borderWidth * 2)) / 2) - 4.0f, paint);
    }
}

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
    int width = measureWidth(widthMeasureSpec);
    int height = measureHeight(heightMeasureSpec);
    setMeasuredDimension(width, height);
}

private int measureWidth(int measureSpec) {
    int result = 0;
    int specMode = MeasureSpec.getMode(measureSpec);
    int specSize = MeasureSpec.getSize(measureSpec);

    if (specMode == MeasureSpec.EXACTLY) {
        // The parent has determined an exact size for the child.
        result = specSize;
    } else if (specMode == MeasureSpec.AT_MOST) {
        // The child can be as large as it wants up to the specified size.
        result = specSize;
    } else {
        // The parent has not imposed any constraint on the child.
        result = canvasSize;
    }

    return result;
}

private int measureHeight(int measureSpecHeight) {
    int result = 0;
    int specMode = MeasureSpec.getMode(measureSpecHeight);
    int specSize = MeasureSpec.getSize(measureSpecHeight);

    if (specMode == MeasureSpec.EXACTLY) {
        // We were told how big to be
        result = specSize;
    } else if (specMode == MeasureSpec.AT_MOST) {
        // The child can be as large as it wants up to the specified size.
        result = specSize;
    } else {
        // Measure the text (beware: ascent is a negative number)
        result = canvasSize;
    }

    return (result + 2);
}

public Bitmap drawableToBitmap(Drawable drawable) {
    if (drawable == null) {
        return null;
    } else if (drawable instanceof BitmapDrawable) {
        return ((BitmapDrawable) drawable).getBitmap();
    }

    Bitmap bitmap = Bitmap.createBitmap(drawable.getIntrinsicWidth(),
            drawable.getIntrinsicHeight(), Bitmap.Config.ARGB_8888);
    Canvas canvas = new Canvas(bitmap);
    drawable.setBounds(0, 0, canvas.getWidth(), canvas.getHeight());
    drawable.draw(canvas);

    return bitmap;
}
}

你对此有凌空依赖。

Answer 3

我一直使用这个 class，简单易用：

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.PorterDuffXfermode;
import android.graphics.Rect;
import android.graphics.RectF;
import android.graphics.Bitmap.Config;
import android.graphics.PorterDuff.Mode;
import android.graphics.drawable.BitmapDrawable;
import android.util.AttributeSet;

import com.android.volley.toolbox.NetworkImageView;

public class CircularNetworkImageView extends NetworkImageView {
    Context mContext;

    public CircularNetworkImageView(Context context) {
        super(context);
        mContext = context;
    }

    public CircularNetworkImageView(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
        mContext = context;
    }

    public CircularNetworkImageView(Context context, AttributeSet attrs,
                                    int defStyle) {
        super(context, attrs, defStyle);
        mContext = context;
    }

    @Override
    public void setImageBitmap(Bitmap bm) {
        if(bm==null) return;
        setImageDrawable(new BitmapDrawable(mContext.getResources(),
                getCircularBitmap(bm)));
    }

    /**
     * Creates a circular bitmap and uses whichever dimension is smaller to determine the width
     * <br/>Also constrains the circle to the leftmost part of the image
     *
     * @param bitmap
     * @return bitmap
     */
    public Bitmap getCircularBitmap(Bitmap bitmap) {
        Bitmap output = Bitmap.createBitmap(bitmap.getWidth(),
                bitmap.getHeight(), Config.ARGB_8888);
        Canvas canvas = new Canvas(output);
        int width = bitmap.getWidth();
        if(bitmap.getWidth()>bitmap.getHeight())
            width = bitmap.getHeight();
        final int color = 0xff424242;
        final Paint paint = new Paint();
        final Rect rect = new Rect(0, 0, width, width);
        final RectF rectF = new RectF(rect);
        final float roundPx = width / 2;

        paint.setAntiAlias(true);
        canvas.drawARGB(0, 0, 0, 0);
        paint.setColor(color);
        canvas.drawRoundRect(rectF, roundPx, roundPx, paint);

        paint.setXfermode(new PorterDuffXfermode(Mode.SRC_IN));
        canvas.drawBitmap(bitmap, rect, rect, paint);

        return output;
    }

}

android - 圆形 NetwrokImageView

android - rounded NetwrokImageView

android-volley

networkimageview