android 中的圆形图像视图

Question

我想在我的应用程序中使用圆形 ImageView。我找到了一些代码，但这只是转角图像而不是圆圈。这是我的代码。还要检查图像。

   public class CircularImageView extends android.support.v7.widget.AppCompatImageView {

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

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

public CircularImageView(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 = getRoundBitmap(bitmap, w);
    canvas.drawBitmap(roundBitmap, 0, 0, null);

}

public static Bitmap getRoundBitmap(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;
}

 }

这是xml文件

 <com.example.CircularImageView
          android:layout_width="70dp"
          android:layout_height="70dp"
          app:srcCompt="@drawable/dummy />

我在Whosebug上看了很多答案，但没有找到符合我要求的答案。我不想使用任何库我想创建自己的代码。
我是 android 的新手，能否让我知道我的代码中是否缺少我。

Answer 1

您可以使用 fresco lib 循环 image。
您只需按照文档在 xml layout 中添加属性 fresco:roundAsCircle="true"。
此外，此库对于 asynchronous 从网络加载图像很有用。

Answer 2

尝试从 ImageView 扩展 CircularImageView 而不是 android.support.v7.widget.AppCompatImageView。

CircularImageView.java

package com.ferdous.Whosebuganswer;

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.PorterDuff;
import android.graphics.PorterDuffXfermode;
import android.graphics.Rect;
import android.graphics.drawable.BitmapDrawable;
import android.graphics.drawable.Drawable;
import android.util.AttributeSet;
import android.widget.ImageView;

public class CircularImageView extends ImageView {

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

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

    public CircularImageView(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 = getRoundBitmap(bitmap, w);
        canvas.drawBitmap(roundBitmap, 0, 0, null);

    }

    public static Bitmap getRoundBitmap(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 String color = "#BAB399";
        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(color));
        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;
    }

}

在您的 XML 中，尝试使用属性 android:src 而不是 app:srcCompt:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center">

    <com.ferdous.Whosebuganswer.CircularImageView
        android:layout_width="200dp"
        android:layout_height="200dp"
        android:src="@drawable/dummy"
        android:background="#ff0000"/>

</LinearLayout>

输出：

希望对你有所帮助~

Answer 3

使用 Piccasso 是一个非常流行的库

在你的gradle

compile 'com.makeramen:roundedimageview:2.2.1'
compile 'com.squareup.picasso:picasso:2.5.2'

在您的代码中：

Transformation transformation = new RoundedTransformationBuilder()
            .cornerRadiusDp(40)
            .oval(false)
            .build();

    Picasso.with(getApplicationContext())
            .load(//Your url image or bitmap)
            .fit()
            .transform(transformation)
            .into(//Your imageview);

Answer 4

使用 ImageView 和 CardView

创建 RoundedImageView 的简单方法

检查这个例子：https://github.com/SergeySharipov/RoundedImageView

将以下依赖项添加到应用模块的 build.gradle 文件中：

 dependencies {
        implementation 'com.android.support:cardview-v7:27.1.0'
 }

将代码添加到您的布局并更改 "YOUR_PICTURE":

<android.support.v7.widget.CardView
        android:id="@+id/card_view_for_image"
        android:layout_margin="2dp"
        android:layout_width="200dp"
        android:layout_height="200dp"
        app:cardCornerRadius="100dp">

        <ImageView
            android:id="@+id/rounded_image_view"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:scaleType="centerCrop"
            android:src="@drawable/YOUR_PICTURE" />

</android.support.v7.widget.CardView>

Answer 5

我使用 material 可变形图像视图库。

<com.google.android.material.imageview.ShapeableImageView
    app:shapeAppearanceOverlay="@style/ShapeAppearance.App.Image.Circle"
    />

把下面的代码放到styles.xml

<style name="ShapeAppearance.App.Image.Circle" parent="">
    <item name="cornerFamily">rounded</item>
    <item name="cornerSize">50%</item>
    <item name="android:background">@color/transparent</item>
</style>

对于 kotlin 开发人员，我建议 coil library 它具有各种动画和裁剪功能：

imageView.load("https://www.example.com/image.jpg") {
   crossfade(true)
   placeholder(R.drawable.image)
   transformations(CircleCropTransformation())
}

android 中的圆形图像视图

Circular Imageview in android

java

android

android-imageview