备案控制台
探索云世界
开发者社区 开发与运维 文章 正文

Fresco框架SimpleDraweeView控件的简单使用

2017-11-08 1789
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介：
[java]  view plain  copy
  1. 首先把网络、SD卡的读写权限添加上:<span style="font-family: Arial, Helvetica, sans-serif;">   </span>  
[java]  view plain  copy
  1. <span style="font-family: Arial, Helvetica, sans-serif;"><span style="white-space:pre">     </span></span><pre name="code" class="html"><span style="white-space:pre">  </span><uses-permission android:name="android.permission.INTERNET">  
  2.     <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE">  
  3.         <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE">  

 

[java]  view plain  copy
  1. </pre><pre name="code" class="java">添加依赖，好像版本太高不支持GIF类型的动态图????  
[java]  view plain  copy
  1. <span style="font-family: Arial, Helvetica, sans-serif;"><span style="white-space:pre">         </span>compile 'com.facebook.fresco:fresco:0.9.0'</span>  

 

[java]  view plain  copy
  1. private SimpleDraweeView simple;//控件  


[java]  view plain  copy
  1. @Override  
  2.   protected void onCreate(Bundle savedInstanceState) {  
  3.       //Fresco库的初始化,要先初始化库，才能完成布局文件的加载  
  4.       Fresco.initialize(this);//初始化框架  
  5.       super.onCreate(savedInstanceState);  
  6.       setContentView(R.layout.activity_main);  


        1、加载网络图片，在SimpleDraweeView控件显示

[java]  view plain  copy
  1. String url = "http://img4.imgtn.bdimg.com/it/u=1738110171,2299636339&fm=21&gp=0.jpg";//正确网址  
  2.   
  3. Uri uri = Uri.parse("http://img4.imgtn.bdimg.com");//错误的地址  
  4. //找出控件  
  5. simple = (SimpleDraweeView) findViewById(R.id.simpledraweeview);  
[java]  view plain  copy
  1. simple.setImageURI(uri);//开始下载  
  2.   
  3. //重试,创建DraweeController对象  
  4. DraweeController controller = Fresco.newDraweeControllerBuilder()  
  5.         .setUri(url)//URL地址  
  6.         .setTapToRetryEnabled(true)//开启点击重试  
  7.         .build();//构建  
  8.   
  9. simple.setController(controller);  


SD卡的根目录:

[java]  view plain  copy
  1. private String str = Environment.getExternalStorageDirectory().getAbsolutePath();  
[java]  view plain  copy
  1. </pre><pre name="code" class="java">  

2、加载SD卡上面的图片,注意格式：

[java]  view plain  copy
  1. <span style="white-space:pre">        </span>file:///。。。。。，字符串形式  
[java]  view plain  copy
  1. String uri= "file:///storage/emulated/0/DCIM/Camera/IMG_20160227_133717_904.jpg";  
[java]  view plain  copy
  1. <span style="white-space:pre">    </span>DraweeController controller = Fresco.newDraweeControllerBuilder()  
  2.                .setUri(uri)  
  3.                .setTapToRetryEnabled(true)  
  4.                .build();  
  5.   
  6.        simple.setController(controller);<pre name="code" class="java">Uri uri=Uri.parse("asset:///aa.gif");   
  7.   
  8. DraweeController controller=Fresco.newDraweeControllerBuilder()  
  9.                .setUri(uri)  
  10.                .setAutoPlayAnimations(true)  
  11.                .build();  
  12.   
  13.        simple.setController(controller);  


3、加载res目录下的资源文件(图片)

注意格式：

[java]  view plain  copy
  1. Uri uri = Uri.parse("res:///" + R.mipmap.bb113);  
  2.        DraweeController controller = Fresco.newDraweeControllerBuilder()  
  3.                .setUri(uri)  
  4.                .setTapToRetryEnabled(true)  
  5.                .build();  
  6.   
  7.        simple.setController(controller);  



4、加载assets文件夹下的动态图片(gif格式),也可以改为网络地址

注意格式：asset：///


 

[java]  view plain  copy
  1. </pre><p></p><p><span style="font-family:宋体; color:#808080"><span style="font-size:18px"><em></em></span></span></p><pre name="code" class="java"><span style="white-space:pre">  </span>Uri uri=Uri.parse("asset:///aa.gif");  


[java]  view plain  copy
  1. DraweeController controller=Fresco.newDraweeControllerBuilder()  
  2.         .setUri(uri)  
  3.         .setAutoPlayAnimations(true)  
  4.         .build();  
  5.   
  6. simple.setController(controller);  



 

[java]  view plain  copy
  1. rap_content  
  2. Drawees 不支持 wrap_content 属性。  
  3.   
  4. 所下载的图像可能和占位图尺寸不一致，如果设置出错图或者重试图的话，这些图的尺寸也可能和所下载的图尺寸不一致。  
  5.   
  6. 如果大小不一致，假设使用的是 wrap_content，图像下载完之后，View将会重新layout，改变大小和位置。这将会导致界面跳跃。  
  7.   
  8. 固定宽高比  
  9. 只有希望显示固定的宽高比时，可以使用wrap_content。  
  10.   
  11. 如果希望图片以特定的宽高比例显示，例如 4:3，可以在XML中指定:  
  12.   
  13. <com.facebook.drawee.view.SimpleDraweeView  
  14.     android:id="@+id/my_image_view"  
  15.     android:layout_width="20dp"  
  16.     android:layout_height="wrap_content"  
  17.     fresco:viewAspectRatio="1.33"  
  18.     <!-- other attributes -->  
  19. 也可以在代码中指定显示比例：  
  20.   
  21. mSimpleDraweeView.setAspectRatio(1.33f);  




XML文件：

[java]  view plain  copy
  1. <com.facebook.drawee.view.SimpleDraweeView  
  2.   
  3.     android:id="@+id/my_image_view"  
  4.     android:layout_width="20dp"  
  5.     android:layout_height="20dp"  
  6.   
  7.     fresco:fadeDuration="300"//图片淡出的事件(ms)  
  8.   
  9.     fresco:actualImageScaleType="focusCrop"  
  10.   
  11.     fresco:placeholderImage="@color/wait_color"//占位图  
  12.   
  13.     fresco:placeholderImageScaleType="fitCenter"//占位图的缩放类型  
  14.   
  15.     fresco:failureImage="@drawable/error"//失败图片  
  16.   
  17.     fresco:failureImageScaleType="centerInside"//失败图片的类型  
  18.   
  19.     fresco:retryImage="@drawable/retrying"//重试图片  
  20.   
  21.     fresco:retryImageScaleType="centerCrop"//图的重试缩放类型  
  22.   
  23.     fresco:progressBarImage="@drawable/progress_bar"//进度图片  
  24.   
  25.     fresco:progressBarImageScaleType="centerInside"//进度图的缩放类型  
  26.   
  27.     fresco:progressBarAutoRotateInterval="1000"//进度图自动旋转的间隔时间(ms)  
  28.   
  29.     fresco:backgroundImage="@color/blue"//背景图片  
  30.   
  31.     fresco:overlayImage="@drawable/watermark"//叠加图片  
  32.   
  33.     fresco:pressedStateOverlayImage="@color/red"//按压状态下显示的叠加图  
  34.   
  35.     fresco:roundAsCircle="false"//是否设置为圆形图片  
  36.   
  37.     fresco:roundedCornerRadius="1dp"//圆角半径  
  38.   
  39.     fresco:roundTopLeft="true"//左上角是否为圆角  
  40.   
  41.     fresco:roundTopRight="false"//右上角是否为圆角  
  42.   
  43.     fresco:roundBottomLeft="false"//左下角是否为圆角  
  44.   
  45.     fresco:roundBottomRight="true"//右下角是否为圆角  
  46.   
  47.     fresco:roundWithOverlayColor="@color/corner_color"//圆形或者圆角图片底下的叠加颜色  
  48.   
  49.     fresco:roundingBorderWidth="2dp"//圆形或者圆角图片边框的宽度  
  50.   
  51.     fresco:roundingBorderColor="@color/border_color"//圆形或者圆角边框的颜色  
  52.   />  



[java]  view plain  copy
    1. 缩放类型—ScaleType：  
    2.   
    3. 类型  描述  
    4. center  居中，无缩放  
    5.   
    6. centerCrop  保持宽高比缩小或放大，使得两边都大于或等于显示边界。居中显示。  
    7.   
    8. focusCrop   同centerCrop, 但居中点不是中点，而是指定的某个点  
    9.   
    10. centerInside    使两边都在显示边界内，居中显示。如果图尺寸大于显示边界，则保持长宽比缩小图片。  
    11.   
    12. fitCenter   保持宽高比，缩小或者放大，使得图片完全显示在显示边界内。居中显示  
    13.   
    14. fitStart    同上。但不居中，和显示边界左上对齐  
    15.   
    16. fitEnd  同fitCenter， 但不居中，和显示边界右下对齐  
    17.   
    18. fitXY   不保存宽高比，填充满显示边界  
    19.   
    20. none    如要使用tile mode显示, 需要设置为none  
    21.   
    22. 推荐使用：focusCrop 类型 


    本文转自 一点点征服   博客园博客，原文链接：http://www.cnblogs.com/ldq2016/p/6645185.html ，如需转载请自行联系原作者
文章标签：
Java
Android开发
数据格式
XML
技术小胖子
目录
相关文章
jcLee95
|
7月前
|
数据库 容器
Flutter笔记：无限滚动与动态加载的实现
在 Flutter 中，实现一个无尽滚动列表通常涉及使用 ListView、ListView.builder 或 ListView.separated 组件，并结合数据源和滚动控制器。这使得你可以加载和显示大量数据，只有在需要时才会动态加
jcLee95
146 0
二流小码农
|
9月前
|
API Android开发
Flutter控件封装之视频进度条
视频控制器，三方所提供的样式，有时很难满足我们的需求，对于此情况，我们不得不在此基础上自行封装，今天所分享的文章就是一个很简单的控制器封装案例，包含了基本的播放暂停，全屏和退出全屏，以及时间和进度的展示，封装了事件回调以及各个属性的控制，基本上可以满足大部分的业务需求，即便不满足，大家也可以在此基础之上拓展。
二流小码农
131 0
二流小码农
|
9月前
|
XML Android开发 数据格式
Android开发中那些你费力写的控件，其实原生都有
实现一个开关的切换,你会怎么做，写一个layout，一半点击为开，一半点击为关，还是两张图片，点一下开，再点一下关？让你实现一个根据用户的输入弹出一个下拉菜单等等，其实都大可没有必要去自己写，本身Android里都有，下面对各个控件，我会一一举例。
二流小码农
132 0
吃个甘蔗嚼一年
|
9月前
|
Dart
Flutter EasyRefreshList使用方法 下拉加载 上拉刷新
Flutter EasyRefreshList使用方法 下拉加载 上拉刷新
吃个甘蔗嚼一年
167 0
二哈侠
|
Android开发
侧滑菜单的简单使用
本节给大家带来基础UI控件部分的最后一个控件：DrawerLayout，官方给我们提供的一个侧滑菜单控件，和上一节的ViewPager一样，3.0以后引入，低版本使用它，需要v4兼容包，说到侧滑，相信很多人都用过github上的SlidingMenu，不过好像有两个版本，一个是单独的，另一个需要依赖另一个开源项目：ActionBarSherlock；既然Google为我们提供了这个控件，为何不用咧，而且在Material Design设计规范中，随处可见的很多侧滑菜单的动画效果，大都可以通过Toolbar +DrawerLayout来实现。
二哈侠
53 0
公众号：小余的自习室
|
Java Maven Android开发
Android组件化开发（五）--完整版音乐播放组件的封装
前面几篇系列文章我们讲解了`组件化开发`中几个常用功能组件的开发，包括：`网络请求组件`，`图片加载请求组件`，`应用保活组件`。今天我们来封装一个`音乐播放组件`。
公众号：小余的自习室
205 0
恬静的小魔龙Unity
|
C# 图形学
UGUI系列-原理分析(Unity3D)（四）
了解各种不同UI Render Mode
恬静的小魔龙Unity
155 0
恬静的小魔龙Unity
|
前端开发 图形学
UGUI系列-原理分析(Unity3D)（二）
了解各种不同UI Render Mode
恬静的小魔龙Unity
260 0
恬静的小魔龙Unity
|
前端开发 图形学 数据安全/隐私保护
UGUI系列-原理分析(Unity3D)（三）
了解各种不同UI Render Mode
恬静的小魔龙Unity
439 0
恬静的小魔龙Unity
|
编解码 前端开发 算法
UGUI系列-原理分析(Unity3D)（一）
了解各种不同UI Render Mode
恬静的小魔龙Unity
586 1

热门文章

最新文章

  • 1
    疑犯追踪第一季/全集Person Of Interest迅雷下载
  • 2
    【直播系列之一】1篇文章看懂峰值带宽、流量、转码、连麦、截图五大直播计费方式
  • 3
    理解事务的4种隔离级别
  • 4
    阿里云网站域名备案流程全过程讲解(图文)
  • 5
    在服务器的raid1中安装windows server系统（踩坑记录）
  • 6
    如何用Vue实现简易的富文本编辑器，并支持Markdown语法
  • 7
    怎么才能快速提高小程序留存率！
  • 8
    程序员请放下浮躁的心
  • 9
    如何解决域中普通用户只限于10台客户机加入域的数量问题
  • 10
    博客园模板 样式优化
  • 1
    未来技术纵横谈：区块链、物联网与虚拟现实的融合与创新
    74
  • 2
    软件体系结构 - 缓存技术（9）缓存穿透
    65
  • 3
    提升Android应用性能的实用技巧
    62
  • 4
    工具变量法(两阶段最小二乘法2SLS)线性模型分析人均食品消费时间序列数据和回归诊断（下）
    72
  • 5
    软件体系结构 - 缓存技术（8）缓存雪崩
    68
  • 6
    软件体系结构 - 缓存技术（7）Redis持久化方法
    73
  • 7
    Python用KShape对时间序列进行聚类和肘方法确定最优聚类数k可视化
    68
  • 8
    软件体系结构 - 缓存技术（6）淘汰策略
    77
  • 9
    基于R语言股票市场收益的统计可视化分析
    88
  • 10
    软件体系结构 - 数据分片（2）一致性哈希分片
    77

    • 相关电子书

    更多
  • Flutter 应用框架 Fish-Redux
  • UI2CODE智能生成flutter代码--整体架构 【上叶】
  • 《Flutter in action》
    • 下一篇
    部署LAMP环境（Alibaba Cloud Linux 3）