【Android】多种方式实现圆角控件View、图片、配景、边框（最全） ...

---

实现方式

button按钮、ImageView、自界说View等各种控件大概布局常常需要如许的样式：

下面是多种方式去实现圆角效果（圆角配景大概圆角边框），各有千秋吧：
1. shape

在drawable文件夹中新建一个shape.xml文件，在其中设置配景颜色和圆角半径即可：

1. <?xml version="1.0" encoding="UTF-8"?>
2. <shape xmlns:android="http://schemas.android.com/apk/res/android"
3.     android:shape="rectangle" >
5.     <!-- 设置背景颜色 -->
6.     <solid android:color="#02B4FE" />
7.     <!-- 设置边框颜色和粗细 -->
8.     <stroke android:color="#02B4FE" android:width="1dp"/>
9.    
10.     <!-- 圆角半径 -->
11.    
12.         <!-- 统一设置四个角 -->
13.     <corners android:Radius="5dp" />
14.         <!-- 单独设置四个角 -->
15.         <corners
16.         android:topRightRadius="5dp"
17.         android:bottomRightRadius="5dp"
18.         android:topLeftRadius="5dp"
19.         android:bottomLeftRadius="5dp"/>
21. </shape>

复制代码

在布局大概控件中设置配景即可：

1. android:background="@drawable/shape"

复制代码

特点：一种新的设置就需要重新创建文件，在xml中设置，可以设置配景大概边框，可以单独设置某个角。
2. ViewOutlineProvider

Android 5.x引入的新特性，用于实现View的阴影和轮廓

1. view.setOutlineProvider(new ViewOutlineProvider() {
2.             @Override
3.             public void getOutline(View view, Outline outline) {
4.                 // 设置圆角半径为5
5.                 outline.setRoundRect(0, 0, view.getWidth(), view.getHeight(), 5);
6.                 // 设置按钮为圆形
7.                 outline.setOval(0, 0, view.getWidth(), view.getHeight());
8.             }
9.         });
10. view.setClipToOutline(true);

复制代码

特点：不需要新建文件，在java中设置，不能单独设置某个角。
3. CardView

CardView嵌套view可以实现阴影和圆角，通过cardCornerRadius设置圆角半径，cardElevation设置阴影

1.         <androidx.cardview.widget.CardView
2.             android:layout_width="match_parent"
3.             android:layout_height=""
4.             app:cardCornerRadius="5dp"
5.             app:cardElevation="0dp"
6.             app:cardUseCompatPadding="false">
8.             <ImageView
9.                 android:layout_width="match_parent"
10.                 android:layout_height="match_parent"/>
12.         </androidx.cardview.widget.CardView>

复制代码

特点：不需要新建文件，在xml中设置，不能单独设置某个角。
4. 第三方库

这里以Glide为例，在Glide中设置圆角可以利用transform()方法应用 RoundedCorners / GranularRoundedCorners 转换

1. // 设置圆角半径为10dp
2. int radius = 10;
4. //统一设置4个角
5. RequestOptions options = new RequestOptions().transform(new RoundedCorners(radius));
6. //单独设置某个角
7. RequestOptions options = new RequestOptions().transform(new GranularRoundedCorners(radius, radius, radius, radius));
9. // 在ImageView上显示圆角图片
10. Glide.with(context)
11.      .load(imageUrl)
12.      .apply(options)
13.      .into(imageView);

复制代码

特点：不需要新建文件，需要导入第三方包，在java中设置，可以单独设置某个角。
5. GradientDrawable和RoundedBitmapDrawable

GradientDrawable：

1.         // 设置圆角半径为10dp
2.         int radius = 10;
3.        
4.         //同时设置四个角
5.     GradientDrawable drawable = new GradientDrawable();
6.     drawable.setShape(GradientDrawable.RECTANGLE);
7.     drawable.setCornerRadius(radius);
8.     drawable.setColor(0xFFE1F5ED);
9.     imageView.setImageDrawable(drawable);
10.    
11.     //单独设置四个角
12.     GradientDrawable drawable = new GradientDrawable();
13.     drawable.setShape(GradientDrawable.RECTANGLE);
14.     drawable.setColor(0xFFE1F5ED);
15.     float[] rad = new float[]{
16.         radius, radius,
17.         0f, 0f,
18.         0f, 0f,
19.         radius, radius
20.     };
21.     drawable.setCornerRadii(rad);
22.     imageView.setImageDrawable(drawable);

复制代码

RoundedBitmapDrawable：通过RoundedBitmapDrawableFactory创建RoundedBitmapDrawable，第二个参数可以传入Bitmap（可将drawable文件转成Bitmap）、filepath、InputStream三种

1.         RoundedBitmapDrawable drawable = RoundedBitmapDrawableFactory.create(getResources(),...);
2.         drawable.setCornerRadius(radius);
3.         imageView.setImageDrawable(drawable);

复制代码

特点：不需要新建文件，在java中设置，GradientDrawable可以单独设置某个角，RoundedBitmapDrawable不能单独设置。
可以将这两种运用在自界说View大概Button中去·自界说控件的属性，补充了利用shape元素的缺点，当项目中需要很多不同的样式时，只需要修改对应的属性值。
6. 自界说Drawable

新建RoundRectDrawable类，实现Drawable抽象方法，用画笔绘制draw圆角配景（圆角边框也雷同）

1. import android.graphics.*
2. import android.graphics.drawable.Drawable
4. class RoundRectDrawable() : Drawable() {
6.     private val paint = Paint()
8.     private val path = Path()
10.     private lateinit var rect: RectF
12.     private var radius: FloatArray = floatArrayOf(
13.         0f, 0f,
14.         0f, 0f,
15.         0f, 0f,
16.         0f, 0f
17.     )
19.     init {
20.         paint.isAntiAlias = true
21.         paint.isDither = true
22.     }
24.     constructor(color: Int, radius: FloatArray) : this() {
25.         this.radius = radius
26.         paint.color = color
27.     }
29.     constructor(color: Int, radius: Float) : this(
30.         color, floatArrayOf(
31.             radius, radius,
32.             radius, radius,
33.             radius, radius,
34.             radius, radius
35.         )
36.     )
38.     constructor(color: Int) : this(
39.         color, floatArrayOf(
40.             0f, 0f,
41.             0f, 0f,
42.             0f, 0f,
43.             0f, 0f
44.         )
45.     )
47.     override fun setBounds(left: Int, top: Int, right: Int, bottom: Int) {
48.         super.setBounds(left, top, right, bottom)
49.         rect = RectF(
50.             left.toFloat(),
51.             top.toFloat(),
52.             right.toFloat(),
53.             bottom.toFloat()
54.         )
55.     }
57.     override fun draw(canvas: Canvas) {
58.         path.addRoundRect(
59.             rect,
60.             radius,
61.             Path.Direction.CW
62.         )
63.         canvas.drawPath(path, paint)
64.     }
66.     override fun setAlpha(alpha: Int) {
67.         paint.alpha = alpha
68.         invalidateSelf()
69.     }
71.     override fun setColorFilter(colorFilter: ColorFilter?) {
72.         paint.colorFilter = colorFilter
73.         invalidateSelf()
74.     }
76.     override fun getOpacity(): Int {
77.         return PixelFormat.TRANSLUCENT
78.     }
79. }

复制代码

在自界说View中利用：设置background属性

1. AppCompatTextView(context).apply {
2.             setTextColor(0xFF06CB7C.toInt())
3.             background = RoundRectDrawable(0xFFE1F5ED.toInt(), 5)
4.             text = ""
5.         }

复制代码

特点：在java中设置，一次设置多次利用，可以单独设置某个角（这里是统一设置）

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。