Android使用自定义ImageView实现圆形图片效果

android中的ImageView只能显示矩形的图片,这样一来不能满足我们其他的需求,比如要显示圆形的图片,这个时候,我们就需要自定义ImageView了,其原理就是首先获取到图片的Bitmap,然后进行裁剪圆形的bitmap,然后在onDraw()进行绘制圆形图片输出。

效果图如下:

自定义的圆形的ImageView类的实现代码如下:

package com.xc.xcskin.view;
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Bitmap.Config;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.PorterDuff.Mode;
import android.graphics.PorterDuffXfermode;
import android.graphics.Rect;
import android.graphics.drawable.BitmapDrawable;
import android.graphics.drawable.Drawable;
import android.util.AttributeSet;
import android.widget.ImageView;
/**
 * 自定义的圆形ImageView,可以直接当组件在布局中使用。
 * @author caizhiming
 *
 */
public class XCRoundImageView extends ImageView{
 private Paint paint ;
 public XCRoundImageView(Context context) {
 this(context,null);
 }
 public XCRoundImageView(Context context, AttributeSet attrs) {
 this(context, attrs,0);
 }
 public XCRoundImageView(Context context, AttributeSet attrs, int defStyle) {
 super(context, attrs, defStyle);
 paint = new Paint();
 }
 /**
 * 绘制圆形图片
 * @author caizhiming
 */
 @Override
 protected void onDraw(Canvas canvas) {
 Drawable drawable = getDrawable();
 if (null != drawable) {
 Bitmap bitmap = ((BitmapDrawable) drawable).getBitmap();
 Bitmap b = getCircleBitmap(bitmap, 14);
 final Rect rectSrc = new Rect(0, 0, b.getWidth(), b.getHeight());
 final Rect rectDest = new Rect(0,0,getWidth(),getHeight());
 paint.reset();
 canvas.drawBitmap(b, rectSrc, rectDest, paint);
 } else {
 super.onDraw(canvas);
 }
 }
 /**
 * 获取圆形图片方法
 * @param bitmap
 * @param pixels
 * @return Bitmap
 * @author caizhiming
 */
 private Bitmap getCircleBitmap(Bitmap bitmap, int pixels) {
 Bitmap output = Bitmap.createBitmap(bitmap.getWidth(),
 bitmap.getHeight(), Config.ARGB_8888);
 Canvas canvas = new Canvas(output);
 final int color = 0xff424242;
 final Rect rect = new Rect(0, 0, bitmap.getWidth(), bitmap.getHeight());
 paint.setAntiAlias(true);
 canvas.drawARGB(0, 0, 0, 0);
 paint.setColor(color);
 int x = bitmap.getWidth();
 canvas.drawCircle(x / 2, x / 2, x / 2, paint);
 paint.setXfermode(new PorterDuffXfermode(Mode.SRC_IN));
 canvas.drawBitmap(bitmap, rect, rect, paint);
 return output; 

 }
}

完成这个自定义类后,就可以使用这个类了,就是把这个当组件在布局中使用即可,比如:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:tools="http://schemas.android.com/tools"
 android:layout_width="match_parent"
 android:layout_height="match_parent" >
 <com.xc.xcskin.view.XCRoundImageView
 android:id="@+id/roundImageView"
 android:layout_centerInParent="true"
 android:layout_width="200dp"
 android:layout_height="200dp"
 android:src="@drawable/roundimageview"
 />
</RelativeLayout>

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,如果有疑问大家可以留言交流,谢谢大家对我们的支持。

(0)

相关推荐

  • Android裁剪图片为圆形图片的实现原理与代码

    以前在eoe论坛中找过裁剪图片为圆形图片的方法,但是效果都不是很理想,这几天因为公司业务的要求,需要对头像进行裁剪以圆形的方式显示,这个方法是根据传入的图片的高度(height)和宽度(width)决定的,如果是 width <= height时,则会裁剪高度,裁剪的区域是宽度不变高度从顶部到宽度width的长度:如果 width > height,则会裁剪宽度,裁剪的区域是高度不变,宽度是取的图片宽度的中心区域,不过不同的业务需求,对裁剪图片要求不一样,可以根据业务的需求来调整裁剪的区域.

  • android绘制圆形图片的两种方式示例

    android绘制圆形图片的两种方式 看下效果先 下面有完整的示例代码 使用BitmapShader(着色器) 我们在绘制view 的时候 就是小学上美术课 用水彩笔在本子上画画 使用着色器绘制圆形图片最简单的理解方式 就是把bitmap当做一种颜色 设置给paint ,paint都已经有颜色了 你想让它方了,圆了,扁了 还不是看你心情 canvas调用那个方法咯 实现的大致思路如下: 1. 创建一个类 继承imageView 重写onDraw() 2. 获取到bitmap图片 3. 计算图片的

  • Android实现圆形图片的两种方式

    在项目中,我们经常会用到圆形图片,但是android本身又没有提供,那我只能我们自己来完成. 第一种方式,自定义CircleImageView: public class CircleImageView extends ImageView { private static final ScaleType SCALE_TYPE = ScaleType.CENTER_CROP; private static final Bitmap.Config BITMAP_CONFIG = Bitmap.Con

  • android自定义控件ImageView实现圆形图片

    android开发中常常涉及到一种情况,就是将用户上传的图片以圆形样式显示,但是用户上传的图片可以有直角.圆角.正方形等多种不确定样式,这时就用到了自定义ImageView控件,在安卓客户端使接收到的图片全部以圆形样式显示 CircleImageView.java public class CircleImageView extends ImageView { private static final ScaleType SCALE_TYPE = ScaleType.CENTER_CROP; p

  • Android自定义View旋转圆形图片

    一个自定义View,记录一下思路和代码以备以后使用. 思路: 1.首先要画一个圆形图片和一个圆形背景图(通过自定义View); 2.自定义View基本步骤初始化属性,测量宽高和中心点,然后绘制图片; 3.通过handler实现图片的角度旋转.然后然后就慢慢撸. 效果图: 1.废话不多直接上代码 public class MusicPlayerView extends View { private static final long ROTATE_DELAY = 5;//旋转动作时间 privat

  • 分享一个Android设置圆形图片的特别方法

    Cardview配合ImageView显示圆形图效果图: 刚在看自定义View的知识点时,突然想起来,如果CardView宽高相等,CardView设置圆角的半径为宽高的一半时,不就是一个圆形嘛?! 1.布局文件 <android.support.v7.widget.CardView android:id="@+id/cv_img_activity" android:layout_width="200dp" android:layout_height=&quo

  • Android实现圆形图片或者圆角图片

    Android圆形图片或者圆角图片的快速实现,具体内容如下 话不多说直接上code xml文件布局 <LinearLayout android:id="@+id/ll_headpict" android:layout_width="match_parent" android:layout_height="97dp" android:layout_margin="13dp" android:background="

  • 详解Android中Glide与CircleImageView加载圆形图片的问题

    最近在项目中遇到了一个奇怪的问题,Glide和CircleImageView一起使用加载圆形头像,发现第一次死活都加载出来,出来的是一张占位图,当你刷新的时候或者第二次进入的时候才能加载出来.究其原因,CircleImageView 把位置占了.这时候我们有如下4种解决方案,不管是哪一种都是可以解决的(亲测可行). 1. 不使用占位符 注释掉这两句代码即可. .placeholder(R.drawable.normal_photo) .error(R.drawable.normal_photo)

  • Android开发实现圆形图片功能示例

    本文实例讲述了Android开发实现圆形图片功能.分享给大家供大家参考,具体如下: **绝对布局:通过直接给定控件起始坐标 ( x , y ) 和 ( w , l ) ,来生成控件. 圆形头像:CircleImageView的使用 ** 注:在build.gradle中添加: implementation 'de.hdodenhof:circleimageview:1.3.0' XML布局文件: <?xml version="1.0" encoding="utf-8&q

  • Android中Glide加载圆形图片和圆角图片实例代码

    一.简介: 介绍两种使用 BitmapTransformation 来实现 Glide 加载圆形图片和圆角图片的方法.Glide 并不能直接支持 Round Pictures ,需要使用 BitmapTransformation 来进行处理. 二.网上的实现方式 这里介绍下网上常见的方式和使用 RoundedBitmapDrawable 两种方法,本质上是差不多的: 使用 Canvas 和 Paint 来绘制 使用 Android.support.v4.graphics.drawable.Rou

  • Android编程绘制圆形图片的方法

    本文实例讲述了Android编程绘制圆形图片的方法.分享给大家供大家参考,具体如下: 效果图如下: 第一步:新建RoundView自定义控件继承View package com.rong.activity; import com.rong.test.R; import android.content.Context; import android.graphics.Bitmap; import android.graphics.Bitmap.Config; import android.grap

  • Android自定义View实现旋转的圆形图片

    自定义View是android开发的一个重要技能,用android提供的2/3D绘制相关类可以实现非常多炫酷的效果,需要实打实的编程基础. 但是自定义View又是我的弱项,所以最近都在摸索.练习自定义View.今天我写了一个圆形图片,同时不断匀速旋转的RotateCircleImageView.实现方法是自己想的,但肯定不是最好的实现方法. 自定义View分四步. 一:自定义属性: 二:创建自定义View,在构造方法中拿到自定义属性: 三:重写onMeasure方法: 四:重写onDraw方法

随机推荐