我想让任何图像从我的ImageView是圆形的边界。

我搜索了一下,但没有找到任何有用的信息(我尝试的任何方法都不管用)。

如何通过XML实现这一点: 创建一个ImageView与某些src,并使它与边界圆形?


当前回答

你可以简单地使用AndroidX ImageFilterView。

 <androidx.constraintlayout.utils.widget.ImageFilterView
        android:layout_width="48dp"
        android:layout_height="48dp"
        android:layout_marginStart="@dimen/margin_medium"
        android:layout_marginBottom="@dimen/margin_medium"
        android:background="@color/white"
        android:padding="@dimen/margin_small"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:roundPercent="1"
        app:srcCompat="@drawable/ic_gallery" />

其他回答

你可以做一个简单的圆,有白色边框,透明内容的形状。

// res/drawable/circle.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:innerRadius="0dp"
    android:shape="ring"
    android:thicknessRatio="1.9"
    android:useLevel="false" >
    <solid android:color="@android:color/transparent" />

    <stroke
        android:width="10dp"
        android:color="@android:color/white" />
</shape>

然后制作一个可绘制的图层列表,并将其作为imageview的背景。

// res/drawable/img.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >

    <item android:drawable="@drawable/circle"/>    
    <item android:drawable="@drawable/ic_launcher"/>

</layer-list>

把它作为imageview的背景。

   <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/img"/>

你会得到类似的东西。

另一种不使用任何库的方法是使用ImageFilterView,并设置视图的圆百分比将使圆

app: roundPercent =“1”

  <androidx.constraintlayout.utils.widget.ImageFilterView
        android:id="@+id/ivProfile"
        android:layout_width="150dp"
        android:layout_height="150dp"
        android:src="@drawable/custom_button_1"
        app:roundPercent="1"
        android:scaleType="fitXY"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintBottom_toTopOf="@+id/etName"/>

这是一个相对较老的问题,但您可以在可绘制文件夹中创建一个圆形边框(假设xml文件将称为circle_border)

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns="http://schemas.android.com/apk/res/android"
    android:shape="oval">

    <solid android:color="@android:color/transparent" />

    <!-- If you want a padding -->
    <padding android:top="4dp" android:left="4dp" android:right="4dp" android:bottom="4dp" />

    <!-- If you want the circle border to have a color -->
    <strong android:width="1dp" android:color="#FFFFFF" />

</shape>

然后你可以使用它作为ImageView的背景

<ImageView
    android:background="@drawable/circle_border"
    <!-- other attributes here -->
/>

我用shape = "oval"代替下面的"ring"。这对我很有效。为了保持图像在边界内,我使用<padding>并在<ImageView>中设置<adjustViewBounds>为true。我尝试过大小在50 x 50 px到200x200 px之间的图像。

我是这样做的,我在矢量图像中使用了背景色

ic_bg_picture.xml

 <vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="100dp"
    android:height="100dp"
    android:viewportWidth="100"
    android:viewportHeight="100">
  <path
      android:pathData="M100.6,95.5c0,-0.4 -0.1,-0.7 0,-1.1c-0.2,-0.7 -0.2,-1.4 -0.1,-2.1c0,-0.1 0,-0.2 0,-0.3c-0.1,-0.6 -0.1,-1.2 0,-1.8c-1,-1.3 -0.3,-2.9 -0.3,-4.3c-0.1,-28.7 -0.1,-57.3 -0.1,-86C68,-0.1 35.9,-0.1 3.8,-0.2C0.7,-0.2 0,0.5 0,3.6c0.1,32.1 0.1,64.2 0.1,96.2c31,0 62,-0.1 92.9,0.1c3.6,0 6.3,-0.2 7.5,-3.2C100.5,96.4 100.5,95.9 100.6,95.5zM46.3,95.2C26.4,94 2,74.4 3.8,46.8C5.1,27.2 24.4,2.7 52.6,4.6c20.2,1.4 43,21.3 41.5,45.1C96.1,72.4 73,96.8 46.3,95.2z"
      android:fillColor="#6200EE"/>
</vector>

在我的情况下,我创建了一个向量,并更改android:fillColor="#6200EE"

通过我背景的颜色

  <ImageView
    android:id="@+id/iv_profile_image"
    android:layout_width="100dp"
    android:layout_height="100dp"
    android:contentDescription="@string/app_name"
    app:srcCompat="@color/colorPrimaryDark" />

<ImageView
    android:id="@+id/container_profile_image"
    android:layout_width="100dp"
    android:layout_height="100dp"
    android:contentDescription="@string/app_name"
    app:srcCompat="@drawable/ic_bg_picture"/>