Android开发 两种ImageView 圆角化的方法与效果对比

54 篇文章 2 订阅

程序效果如下:

原图:

5dp圆角化及增加边框5dp阴影效果: 

 

第一种方法 :直接在需要圆角化的ImageView外部嵌套一层CardView控件即可

代码如下:(注:网上您能搜索到的都是<android.support.v7.widget.CardView> 实际上这个已经过时了,替代的方案就是下面的Androidx )

使用新的CardView依赖关系androidx.cardview:cardview:1.0.0。在xml中使用<androidx.cardview.widget.CardView/>而不是<android.support.v7.widget.CardView/>

    <androidx.cardview.widget.CardView
            android:id="@+id/imgCard"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:cardCornerRadius="5dp"
            app:cardElevation="5dp"
            android:layout_gravity="center"
            android:layout_marginTop="20dp" >

        <ImageView
                android:src="@drawable/userface1"
                android:id="@+id/imageView"
                android:layout_width="100dp"
                android:layout_height="100dp"/>
    </androidx.cardview.widget.CardView>

主要用到的是3个属性:

​​app:cardElevation="5dp"  阴影的大小​​
app:cardCornerRadius="5dp"  卡片的圆角大小
​​app:contentPadding="5dp" 卡片内容于边距的间隔​​ 通常都是3-5dp左右

第二种方法:ImageView控件自绘,重载onDraw方法实现自己的RoundImageView即可

代码如下:

package com.example.UserCenter;

import android.annotation.SuppressLint;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Path;
import android.graphics.RectF;
import android.util.AttributeSet;
import android.widget.ImageView;

/**
 * @author wh445306
 * @version 1.0
 * @Description RoundImageView
 * @Date 2023-03-12 0:51
 */


@SuppressLint("AppCompatCustomView")
public class RoundImageView extends ImageView {

    //圆角弧度
    float radius = 20.0f;//20.0f;// 画出圆角效果,圆角(180度为正圆)

    public RoundImageView(Context context) {
        super(context);
    }

    public RoundImageView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public RoundImageView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    protected void onDraw(Canvas canvas) {
        Path path = new Path();
        int w = this.getWidth();
        int h = this.getHeight();

        //绘制圆角imageview
        path.addRoundRect(new RectF(0,0,w,h),radius, radius, Path.Direction.CW);
        canvas.clipPath(path);
        super.onDraw(canvas);
    }
}

说明:

两种方法都可以完美实现图片圆角化,第二种重载控件自绘的方法也是不错的。灵活性更高。可以实现特殊复杂的要求,比如只某一个角或两个角圆角化。其它不变。

  • 1
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值