在ImageView中设置圆角图像

Posted 2021-05-03

我在网站上搜索了更多，并得到了如下的许多建议

• 使用自定义样式更改背景以设置角半径和填充（将图像设置为矩形，将背景设置为圆角）
• 通过传递此位图和宽度（它需要更多时间加载）来解码图像和裁剪功能，从而将给定图像更改为位图

我检查了WhatsApp Chat history list and it has rounded corner images but its loaded with minimum time。

你能否建议我用WhatsApp创建带有圆形图像的listview模板的最佳方法？

我希望通过在xml页面中设置样式详细信息来更改带圆角的图像。 （图像宽度和高度是60 dp，我的listview也有大约60项）

参考文献：

• https://xjaphx.wordpress.com/2011/06/23/image-processing-image-with-round-corner/
• How to Make an ImageView in Circular Shape?
• How to create a circular ImageView in Android?

RES / mylayout.xml：

<ImageView
        android:id="@+id/contactssnap"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:src="@drawable/contactssnap"
        android:background="@drawable/roundimage" />

RES /绘制/ roundimage.xml：

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle" >
    <solid android:color="#ffffffff" />
    <stroke
        android:width="2dp"
        android:color="#90a4ae" />
    <size
        android:height="50dp"
        android:width="50dp" />
    <padding
        android:bottom="2dp"
        android:left="2dp"
        android:right="2dp"
        android:top="2dp" />
    <corners android:radius="100dp" />
</shape>

注意：支持的Android版本从14到22

答案

sats的答案是有效的。但是RoundedBitmapDrawable无法应用于scaleType：centerCrop的ImageView。

更新。

如果您在21级使用Android API。我们在这里有一个简单的解决方案。

1，创建drawable作为imageview的背景

<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners android:radius="8dp" />
<solid android:color="@android:color/white" />

<stroke
    android:width="1dp"
    android:color="@color/colorWhite" />
</shape>

接下来，将ImageView的属性setClipToOutline更改为true。并将roundled drawable设置为ImageView的背景。

而已。

在我的演示中，我使用此方法进行圆形imageview。可以在这里找到cuberto's dialog

另一答案

将imageView放入CardView并为CardView设置CornerRadius

<android.support.v7.widget.CardView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        app:cardCornerRadius="8dp"
        app:cardElevation="0dp">

        <ImageView
            android:id="@+id/imgTourismHr"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:scaleType="fitXY" />

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

另一答案

您可以使用Google提供的标准API来创建循环ImageView。

ImageView imageView = (ImageView) findViewById(R.id.circleImageView);
Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.image);
RoundedBitmapDrawable roundedBitmapDrawable = RoundedBitmapDrawableFactory.create(getResources(), bitmap);
roundedBitmapDrawable.setCircular(true);
imageView.setImageDrawable(roundedBitmapDrawable);

另请参阅https://www.youtube.com/watch?v=zVC-YAnDlgk

另一答案

你在android中检查了9补丁技术吗？

如果您正在尝试创建类似于具有圆角的应用程序泡泡聊天的内容，我建议您使用此技术而不是使用XML位图解码器。

这是一个例子：Link

根据此示例，您可以使用9个补丁生成器创建自己的自定义形状和位图图像，这些图像会自动调整大小以适应视图内容和屏幕大小。图像的选定部分基于水平或垂直基于图像内绘制的指示符进行缩放。

另一答案

使用Glide加载网络图像的任何人的快速解决方案，使用RequestOptions.circleCropTransform（）：

Glide.with(context)
     .load(imageUrl)
     .apply(RequestOptions.circleCropTransform())
     .into(object : CustomViewTarget<ImageView, Drawable>(imageView) {
            override fun onLoadFailed(errorDrawable: Drawable?) {
            }
            override fun onResourceCleared(placeholder: Drawable?) {
            }
            override fun onResourceReady(resource: Drawable, transition: Transition<in Drawable>?) {
                imageView.setImageDrawable(resource)
            }
        })