我想让任何图像从我的ImageView是圆形的边界。
我搜索了一下,但没有找到任何有用的信息(我尝试的任何方法都不管用)。
如何通过XML实现这一点: 创建一个ImageView与某些src,并使它与边界圆形?
我想让任何图像从我的ImageView是圆形的边界。
我搜索了一下,但没有找到任何有用的信息(我尝试的任何方法都不管用)。
如何通过XML实现这一点: 创建一个ImageView与某些src,并使它与边界圆形?
当前回答
@Jyotman Singh,答案非常好(对于坚实的背景),所以我想通过分享可以根据你的需要重新着色的矢量绘图来增强它,而且这很方便,因为矢量整体形状是可伸缩的。
这是矩形-圆形状(@drawable/shape_round_profile_pic):
<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:viewportWidth="284"
android:viewportHeight="284"
android:width="284dp"
android:height="284dp">
<path
android:pathData="M0 142L0 0l142 0 142 0 0 142 0 142 -142 0 -142 0zm165 137.34231c26.06742 -4.1212 52.67405 -17.543 72.66855 -36.65787 11.82805 -11.30768 20.55487 -22.85153 27.7633 -36.72531C290.23789 158.21592 285.62874 101.14121 253.48951 58.078079 217.58149 9.9651706 154.68849 -10.125717 98.348685 8.5190299 48.695824 24.95084 12.527764 67.047123 3.437787 118.98655 1.4806194 130.16966 1.511302 152.96723 3.4990422 164.5 12.168375 214.79902 47.646316 256.70775 96 273.76783c21.72002 7.66322 44.26673 9.48476 69 5.57448z"
android:fillColor="#ffffff" /> // you can change frame color
</vector>
用法是一样的:
<FrameLayout
android:layout_width="70dp"
android:layout_height="70dp">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/YOUR_PICTURE" />
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/shape_round_profile_pic"/>
</FrameLayout>
其他回答
你可以做一个简单的圆,有白色边框,透明内容的形状。
// 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"/>
你会得到类似的东西。
我有一个简单的解决办法。 通过右键单击软件包名称并选择new ->Image asset创建一个新的Image asset。 输入名称(任何名称)和路径(映像在系统中的位置)。 然后单击“下一步”和“完成”。 如果您输入图像名称为“img”,则在mipmap文件夹中自动创建一个名称为“img_round”的圆形图像。
然后,这样做:
<ImageView
android:layout_width="100dp"
android:layout_height="100dp"
android:src="@mipmap/img_round"/>
您的预览可能仍然显示一个矩形图像。但如果你在你的设备上运行应用程序,它将是圆形的。
if you want to set edit icon on to circle imageview than put this below code.
<FrameLayout
android:layout_width="@dimen/_100sdp"
android:layout_height="@dimen/_100sdp"
android:layout_gravity="center"
android:layout_marginTop="10dp">
<de.hdodenhof.circleimageview.CircleImageView
android:id="@+id/profilePic"
android:layout_width="@dimen/_100sdp"
android:layout_height="@dimen/_100sdp"
android:layout_gravity="bottom|center_horizontal"
android:src="@drawable/ic_upload" />
<de.hdodenhof.circleimageview.CircleImageView
android:id="@+id/iv_camera"
android:layout_width="@dimen/_30sdp"
android:layout_height="@dimen/_30sdp"
android:layout_gravity="top|right"
android:src="@drawable/edit"/>
</FrameLayout>
2021年更新:使用Glide v4 CircleCrop参见https://bumptech.github.io/glide/doc/generatedapi.html
implementation 'com.github.bumptech.glide:glide:4.11.0'
annotationProcessor 'com.github.bumptech.glide:compiler:4.11.0'
XML
<ImageView
android:id="@+id/vinyl"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:ignore="ContentDescription" />
在代码中
Glide.with(this)
.load("https://images.pexels.com/photos/3828241/pexels-photo-3828241.jpeg")
.transform(CircleCrop())
.into(rootView.findViewById<ImageView>(R.id.vinyl))
另一种不使用任何库的方法是使用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"/>