fresco是facebook开源的android平台图片加载库,可以从网络,从本地文件系统,本地资源加载图片
上述就是android开发分享Android基于Fresco实现圆角和圆形图片的全部内容,如果对大家有所用处且需要了解更多关于Android学习教程,希望大家多多关注—计算机技术网(www.ctvol.com)!
fresco本身已经实现了圆角以及圆形图片的功能。
<!--圆形图片,一般用作头像--> <com.facebook.drawee.view.simpledraweeview android:id="@+id/iv_avatar" android:layout_width="40dp" android:layout_height="40dp" app:placeholderimage="@drawable/ic_avatar_default" app:roundascircle="true"/>
<!--圆角图片,为了美观大多数图片都会有这样的处理。--> <!--当图片为正方形的时候,将roundedcornerradius设置为边长的一半,也可以形成圆形图片的效果--> <com.facebook.drawee.view.simpledraweeview android:id="@+id/iv_avatar" android:layout_width="40dp" android:layout_height="40dp" app:placeholderimage="@drawable/ic_avatar_default" app:roundedcornerradius="5dp"/>
工作中,遇到圆形头像的时候,ui通常会给我们这样一张图作为默认图片
理论上来讲,只需要加入下列这行代码,就可以完成这部分工作了
app:placeholderimage="@drawable/ic_avatar_default"
然而圆形图片本身已经是圆形的了,在有些机型上就出现了这个样式。
搜索了一波,自带的属性都不能解决这个问题,干脆自己来定义这个圆形的实现吧,同时fresco自带的圆角效果只能保证使用统一的半径,想要让四个圆角的半径不同,只能在java文件中设置,不够灵活,定义圆角半径的属性也需要做些变更。
思路:自定义roundimageview继承自 simpledraweevie,具备其所有的功能。
canvas的clippath(path path)可以根据path,将canvas剪裁成我们想要的图形。
public class roundimageview extends simpledraweeview { private final static int default_value = 0; private float mwidth; private float mheight; private path mpath; // 圆角角度 private float mcornerradius; // 左上角圆角角度 private float mlefttopradius; // 右上角圆角角度 private float mrighttopradius; // 右下角圆角角度 private float mrightbottomradius; // 左下角圆角角度 private float mleftbottomradius; // 是否使用圆形图片 private boolean mascircle; // 圆形图片半径 private float mradius; public roundimageview(context context) { this(context, null); } public roundimageview(context context, attributeset attrs) { this(context, attrs, 0); } public roundimageview(context context, attributeset attrs, int defstyleattr) { super(context, attrs, defstyleattr); initdata(); initattrs(context, attrs); } private void initdata() { mpath = new path(); } private void initattrs(context context, attributeset attrs) { typedarray typedarray = context.obtainstyledattributes(attrs, r.styleable.roundimageview); mcornerradius = typedarray.getdimension(r.styleable.roundimageview_cornerradius, default_value); mascircle = typedarray.getboolean(r.styleable.roundimageview_ascircle, false); if (mcornerradius <= 0) { // 说明用户没有设置四个圆角的有效值,此时四个圆角各自使用自己的值 mlefttopradius = typedarray.getdimension(r.styleable.roundimageview_lefttopradius, default_value); mrighttopradius = typedarray.getdimension(r.styleable.roundimageview_righttopradius, default_value); mrightbottomradius = typedarray.getdimension(r.styleable.roundimageview_rightbottomradius, default_value); mleftbottomradius = typedarray.getdimension(r.styleable.roundimageview_leftbottomradius, default_value); } else { // 使用了统一的圆角,因此使用mcornerradius统一的值 mlefttopradius = mcornerradius; mrighttopradius = mcornerradius; mrightbottomradius = mcornerradius; mleftbottomradius = mcornerradius; } typedarray.recycle(); } @override protected void onlayout(boolean changed, int left, int top, int right, int bottom) { super.onlayout(changed, left, top, right, bottom); mwidth = getwidth(); mheight = getheight(); // 如果开启了圆形标记 if (mascircle) { mradius = math.min(mwidth / 2, mheight / 2); } } @override protected void ondraw(canvas canvas) { // 如果开启了圆形标记,圆形图片的优先级高于圆角图片 if(mascircle) { drawcircleimage(canvas); } else { drawcornerimage(canvas); } super.ondraw(canvas); } /** * 画中间圆形 * @param canvas */ private void drawcircleimage(canvas canvas) { mpath.addcircle(mwidth / 2, mheight / 2, mradius, path.direction.cw); canvas.clippath(mpath); } /** * 画圆角 * @param canvas */ private void drawcornerimage(canvas canvas) { if (mwidth > mcornerradius && mheight > mcornerradius) { // 设置四个角的x,y半径值 float[] radius = {mlefttopradius, mlefttopradius, mrighttopradius, mrighttopradius, mrightbottomradius, mrightbottomradius, mleftbottomradius, mleftbottomradius}; mpath.addroundrect(new rectf(0,0, mwidth, mheight), radius, path.direction.cw); canvas.clippath(mpath); } } }
attr属性如下
<!--适配android10的图片控件--> <declare-styleable name="roundimageview"> <!--圆形图片--> <attr name="ascircle" format="boolean"/> <!--左上角圆角半径--> <attr name="lefttopradius" format="dimension"/> <!--右上角圆角半径--> <attr name="righttopradius" format="dimension"/> <!--右下角圆角半径--> <attr name="rightbottomradius" format="dimension"/> <!--左下角圆角半径--> <attr name="leftbottomradius" format="dimension"/> <!--四个圆角半径,会覆盖上边四个圆角值--> <attr name="cornerradius" format="dimension"/> </declare-styleable>
以上就是android开发分享Android基于Fresco实现圆角和圆形图片的全部内容,希望对大家的学习有所帮助,也希望大家多多支持<计算机技术网(www.ctvol.com)!!>。
本文来自网络收集,不代表计算机技术网立场,如涉及侵权请联系管理员删除。
ctvol管理联系方式QQ:251552304
本文章地址:https://www.ctvol.com/addevelopment/1071603.html