圆角头像在开发中应用太普遍了，我总结了2种实现方法，分享给大家

方法一：

使用Container组件的decoration可以实现

Container(

  width: 40,

  height: 40,

  decoration: BoxDecoration(

    borderRadius: BorderRadius.circular(20),

    image: DecorationImage(

      image: NetworkImage("https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1561011314262&di=29253749380f34583bbcae1a614d6f6e&imgtype=0&src=http%3A%2F%2Fimg3.mukewang.com%2F5c18cf540001ac8206000338.jpg",)

    )

  ),

),

其中borderRadius的值设为宽或高的一半

方法二：使用ClipRRect组件

ClipRRect(

  borderRadius: BorderRadius.circular(20),

  child: Image.network(

    "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1561011314262&di=29253749380f34583bbcae1a614d6f6e&imgtype=0&src=http%3A%2F%2Fimg3.mukewang.com%2F5c18cf540001ac8206000338.jpg",

    width: 40,

    height: 40,

  ),

),

flutter 实现圆角头像的2种方法的更多相关文章

  1. IOS_视图实现圆角效果的三种方法及比较

    通过代码,至少有三种方法可以为视图加上圆角效果.附例子:https://github.com/weipin/RoundedCorner 方法一.layer.cornerRadius 第一种方法最简单, ...

  2. css+div制作圆角矩形的四种方法

    圆角矩形一向是设计师最倾心的一种设计,因为他们可以让整个网页生动起来,不那么死板,所以,作为一个优秀的网页设计师,学会一种或多种编辑圆角矩形的方法是必不可少的,而且圆角矩形应用范围极广,一个网页内的所 ...

  3. Flutter 圆形/圆角头像图片

    图片显示 1.本地图片 Image.asset加载项目资源包的图片 //先将图片拷贝到项目 images 目录中,然后在 pubspec.yaml文件配置文件相对路径到 assets Image.as ...

  4. iOS常见用户头像的圆形图片裁剪常见的几种方法

    在开发中,基本上APP的用户头像的处理都需要把用户所上传的方形图片,处理为圆形图片.在这里就总结三种常见的处理圆形图片的方法. 1.使用位图上下文 2.使用UIView的layer进行处理 3.使用r ...

  5. Quartz2D之生成圆形头像、打水印、截图三种方法的封装

    我给UIImage类添加了一个类目,用于封装三个方法,每个方法都没有难度,做这个主要为了练习一下封装: 首先在类目.h文件中声明三个方法:以及创建了一个枚举.用于水印方法中设定水印位置:方法说明和参数 ...

  6. Qt 之 设置窗口边框的圆角（使用QSS和PaintEvent两种方法）

    Qt在设置窗口边框圆角时有两种方式,一种是设置样式,另一种是在paintEvent事件中绘制窗口.下面分别叙述用这两种方式来实现窗口边框圆角的效果. 一.使用setStyleSheet方法 this- ...

  7. iOS设置圆角的四种方法

    小小圆角问题,正常情况下,我们不需要过多关心,但当屏幕内比较多的时候,还是有必要了解下性能问题的 一.设置CALayer的cornerRadius 这是最常用的,也是最简单的. cornerRadiu ...

  8. 09 Flutter底部Tab切换保持页面状态的几种方法

    IndexedStack:保此所有页面的状态: AutomaticKeepAliveClientMixin:保此部分页面的状态: 修改的页面代码: 页面效果: Tabs.dart import 'pa ...

  9. 为了弄懂Flutter的状态管理, 我用10种方法改造了counter app

    为了弄懂Flutter的状态管理, 我用10种方法改造了counter app 本文通过改造flutter的counter app, 展示不同的状态管理方法的用法. 可以直接去demo地址看代码: h ...

随机推荐

  1. HDU1698 Just a Hook —— 线段树 区间染色

    题目链接:https://vjudge.net/problem/HDU-1698 In the game of DotA, Pudge’s meat hook is actually the most ...

  2. HDU - 2586 How far away ？（离线Tarjan算法）

    1.给定一棵树,每条边都有一定的权值,q次询问,每次询问某两点间的距离. 2.这样就可以用LCA来解,首先找到u, v 两点的lca,然后计算一下距离值就可以了. 这里的计算方法是,记下根结点到任意一 ...

  3. python库学习笔记——BeautifulSoup处理子标签、后代标签、兄弟标签和父标签

    首先,我们来看一个简单的网页https://www.pythonscraping.com/pages/page3.html,打开后: 右键"检查"(谷歌浏览器)查看元素: 用导航树 ...

  4. BZOJ_1532_[POI2005]Kos-Dicing_二分+网络流

    BZOJ_1532_[POI2005]Kos-Dicing_二分+网络流 Description Dicing 是一个两人玩的游戏,这个游戏在Byteotia非常流行. 甚至人们专门成立了这个游戏的一 ...

  5. 【SCOI 2005】 最大子矩阵

    [题目链接] 点击打开链接 [算法] 动态规划 我们发现,M只有两种取值,1和2,那么,只需分类讨论即可 当M = 1时,其实这个问题就成了就最大连续子段和的问题,只不过要选K段而已 用f[i][j] ...

  6. [转]python_常用断言assert

    原文地址:http://www.jianshu.com/p/eea0b0e432da python自动化测试中寻找元素并进行操作,如果在元素好找的情况下,相信大家都可以较熟练地编写用例脚本了,但光进行 ...

  7. iOS开发，#define的使用

    1.判断当前设备是不是iOS7以上版本 #define IOS_VERSION_7_OR_ABOVE (([[[UIDevice currentDevice] systemVersion] float ...

  8. asp.net mvc5 使用百度ueditor 本编辑器完整示例（上）

    最近做一个项目,用到了百度ueditor富文本编辑器,功能强大,在线编辑文档,上传图片\视频.附件. MVC 模型的控制器准备: 1.建立模型. 在项目中Model 文件夹中建立 文章 模型,注意如果 ...

  9. 关于使用kafka时对于大数据消息体是遇到的问题

    kafka对于消息体的大小默认为单条最大值是1M. 但是在我们应用场景中, 常常会出现一条消息大于1M, 如果不对kafka进行配置. 则会出现生产者无法将消息推送到kafka或消费者无法去消费kaf ...

  10. PCB Web版SI9000阻抗计算器

    在几个月前写过一遍关于: PCB SI9000阻抗计算引擎Web方式实现方法  ,最近开始参考Polar SI9000的界面,将阻抗计算器转为网页版的方式实现.   一.Web版SI9000阻抗计算器 ...