如何创建具有以下要求的可绘制圆圈？

Question

我正在尝试创建一个圆形可绘制对象作为个人资料图片（圆形图像）的叠加层我为圆形可绘制叠加层编写了以下代码，

 <?xml version="1.0" encoding="utf-8"?>

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <item>
        <shape>
            <solid android:color="@color/light_blue_bg" />
        </shape>
    </item>
    <item>
        <shape android:shape="oval">
            <stroke
                android:width="2dp"
                android:color="@android:color/white" />
            <solid android:color="@android:color/transparent" />
        </shape>
    </item>
</layer-list>

参考下面屏幕图像中的输出，

已知问题：我正在用@color/light_blue_color 创建一个矩形，它的内部椭圆形带有描边颜色和内部纯色透明，但由于外部矩形颜色内部圆透明度不显示图片。如果我删除外部矩形颜色真正的正方形图片将出现圆形叠加。

有没有办法单独给外圆部分上色？

我们将不胜感激任何帮助

Answer 1

我认为仅在 XML 中完成它是不可能的。但是你可以在之后用代码屏蔽它。有关示例，请参阅 this tutorial.

Answer 2

@Sreedhu Madhu ....你必须自定义你的 imageview 并在位图上工作，canvas 才能实现......

尽管我建议您使用 Henning Dodenhof 在 github 和 android-arsenal 上发布的库之一... CircleImageView

在另一边你可以看看这是如何完成的..使用这个class..

Custom Class for Circular ImageView

imp 方法是 setup() 和 onDraw()

Answer 3

对于圆角（Circled imageView）将此 class 添加到您的来源

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Bitmap.Config;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.PorterDuff.Mode;
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 RoundedImageView extends ImageView {

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

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

       }

       public static Bitmap getRoundedCroppedBitmap(Bitmap bitmap, int radius) {
              Bitmap finalBitmap;
              if (bitmap.getWidth() != radius || bitmap.getHeight() != radius)
                     finalBitmap = Bitmap.createScaledBitmap(bitmap, radius, radius,
                                  false);
              else
                     finalBitmap = bitmap;
              Bitmap output = Bitmap.createBitmap(finalBitmap.getWidth(),
                           finalBitmap.getHeight(), Config.ARGB_8888);
              Canvas canvas = new Canvas(output);

              final Paint paint = new Paint();
              final Rect rect = new Rect(0, 0, finalBitmap.getWidth(),
                           finalBitmap.getHeight());

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

              return output;
       }

}

然后将你的 ImageView 更改为你的包名称和 class 布局文件中的名称 (RoundedImageView) 例如

<com.mypackege.RoundedImageView
        android:id="@+id/imageView_round"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_marginTop="15dp"
        android:src="@drawable/my_image" />

希望这会奏效。

Answer 4

试试这样的方法，它对我有用！

在您的 xml 中放置此自定义 RoundImage：

<com.example.hkh.learningandroid.RoundedImageView
        android:layout_width="200dp"
        android:layout_height="200dp"
        android:src="@drawable/person"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:id="@+id/MyImageView" />

并创建新的 class 并将其命名为 RoundImageView:

public class RoundedImageView extends ImageView {

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

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

}

public static Bitmap getRoundedCroppedBitmap(Bitmap bitmap, int radius) {
    Bitmap finalBitmap;
    if (bitmap.getWidth() != radius || bitmap.getHeight() != radius)
        finalBitmap = Bitmap.createScaledBitmap(bitmap, radius, radius,
                false);
    else
        finalBitmap = bitmap;
    Bitmap output = Bitmap.createBitmap(finalBitmap.getWidth(),
            finalBitmap.getHeight(), Bitmap.Config.ARGB_8888);
    Canvas canvas = new Canvas(output);

    final Paint paint = new Paint();
    final Rect rect = new Rect(0, 0, finalBitmap.getWidth(),
            finalBitmap.getHeight());

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

    return output;

 }
}

和运行，我希望它能有所帮助，它会给出你想要的预期的圆形图像

如何创建具有以下要求的可绘制圆圈？

How to create drawable circle with below requirement?

android

xml

drawable

shape