美文网首页
Android自定义ImageView实现圆角功能

Android自定义ImageView实现圆角功能

作者: KingWorld | 来源:发表于2020-10-19 16:03 被阅读0次

    转载:Android自定义ImageView实现圆角功能

    这篇文章主要为大家详细介绍了Android自定义ImageView实现圆角功能,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    使用自定义ImageView,实现圆角功能,供大家参考,具体内容如下

    1.自定义属性attrs.xml

    <?xml version="1.0" encoding="utf-8"?>
    <resources>
      <declare-styleable name="RoundCornerImageView">
        <attr name="radius" format="dimension" />
        <attr name="left_top_radius" format="dimension" />
        <attr name="right_top_radius" format="dimension" />
        <attr name="right_bottom_radius" format="dimension" />
        <attr name="left_bottom_radius" format="dimension" />
      </declare-styleable>
    </resources>
    

    2.自定义RoundCornerImageView,继承AppCompatImageView

    public class RoundCornerImageView extends AppCompatImageView {
      private float width, height;
      private int defaultRadius = 0;
      private int radius;
      private int leftTopRadius;
      private int rightTopRadius;
      private int rightBottomRadius;
      private int leftBottomRadius;
    
    
      public RoundCornerImageView(Context context) {
        this(context, null);
        init(context, null);
      }
    
      public RoundCornerImageView(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
        init(context, attrs);
      }
    
      public RoundCornerImageView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init(context, attrs);
      }
    
      private void init(Context context, AttributeSet attrs) {
        if (Build.VERSION.SDK_INT < 18) {
          setLayerType(View.LAYER_TYPE_SOFTWARE, null);
        }
        // 读取配置
        TypedArray array = context.obtainStyledAttributes(attrs, R.styleable.RoundCornerImageView);
        radius = array.getDimensionPixelOffset(R.styleable.RoundCornerImageView_radius, defaultRadius);
        leftTopRadius = array.getDimensionPixelOffset(R.styleable.RoundCornerImageView_left_top_radius, defaultRadius);
        rightTopRadius = array.getDimensionPixelOffset(R.styleable.RoundCornerImageView_right_top_radius, defaultRadius);
        rightBottomRadius = array.getDimensionPixelOffset(R.styleable.RoundCornerImageView_right_bottom_radius, defaultRadius);
        leftBottomRadius = array.getDimensionPixelOffset(R.styleable.RoundCornerImageView_left_bottom_radius, defaultRadius);
    
    
        //如果四个角的值没有设置,那么就使用通用的radius的值。
        if (defaultRadius == leftTopRadius) {
          leftTopRadius = radius;
        }
        if (defaultRadius == rightTopRadius) {
          rightTopRadius = radius;
        }
        if (defaultRadius == rightBottomRadius) {
          rightBottomRadius = radius;
        }
        if (defaultRadius == leftBottomRadius) {
          leftBottomRadius = radius;
        }
        array.recycle();
      }
    
    
      @Override
      protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
        super.onLayout(changed, left, top, right, bottom);
        width = getWidth();
        height = getHeight();
      }
    
      @Override
      protected void onDraw(Canvas canvas) {
        //这里做下判断,只有图片的宽高大于设置的圆角距离的时候才进行裁剪
        int maxLeft = Math.max(leftTopRadius, leftBottomRadius);
        int maxRight = Math.max(rightTopRadius, rightBottomRadius);
        int minWidth = maxLeft + maxRight;
        int maxTop = Math.max(leftTopRadius, rightTopRadius);
        int maxBottom = Math.max(leftBottomRadius, rightBottomRadius);
        int minHeight = maxTop + maxBottom;
        if (width >= minWidth && height > minHeight) {
          Path path = new Path();
          //四个角:右上,右下,左下,左上
          path.moveTo(leftTopRadius, 0);
          path.lineTo(width - rightTopRadius, 0);
          path.quadTo(width, 0, width, rightTopRadius);
    
          path.lineTo(width, height - rightBottomRadius);
          path.quadTo(width, height, width - rightBottomRadius, height);
    
          path.lineTo(leftBottomRadius, height);
          path.quadTo(0, height, 0, height - leftBottomRadius);
    
          path.lineTo(0, leftTopRadius);
          path.quadTo(0, 0, leftTopRadius, 0);
    
          canvas.clipPath(path);
        }
        super.onDraw(canvas);
      }
    
    }
    

    3.布局文件中使用

    <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:app="http://schemas.android.com/apk/res-auto"
      xmlns:tools="http://schemas.android.com/tools"
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:orientation="vertical"
      tools:context="voicedemo.iflytek.com.roundimage.MainActivity">
    
      <voicedemo.iflytek.com.roundimage.RoundCornerImageView
        android:id="@+id/iv_avatar"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_marginBottom="10dp"
        android:layout_marginTop="50dp"
        android:scaleType="centerCrop"
        app:left_top_radius="20dp"
        app:right_top_radius="20dp"
        />
    </LinearLayout>
    

    4.调用

    public class MainActivity extends AppCompatActivity {
    
      String avatarUrl = "19e9d4c0a8f1cd033ecac3692_th.jpg";
    
      @Override
      protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    
        ImageView ivAvatar = findViewById(R.id.iv_avatar);
    
        Glide.with(this).load(avatarUrl).into(ivAvatar);
    
      }
    } 
    

    相关文章

      网友评论

          本文标题:Android自定义ImageView实现圆角功能

          本文链接:https://www.haomeiwen.com/subject/gjakmktx.html