圆角头像在开发中应用太普遍了,我总结了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. eclipse相关技巧总结

    原文:http://licoolxue.iteye.com/blog/619983 eclipse作为被广泛使用的ide,基本的使用技巧每个人都会一些,然而可能并未充分发掘其潜力,也许我们并没有真正认 ...

  2. I.MX6 Android shutdown shell command

    /******************************************************************************* * I.MX6 Android shu ...

  3. BZOJ 4815 数论

    今年的重庆省选? 具体就是,对于每次修改,A[p,q]这个位置,  设d=gcd(p,q) ,则 gcd为d的每一个格子都会被修改,且他们之间有个不变的联系 A[p,q]/p/q==A[k,t]/k/ ...

  4. Educational Codeforces Round 22 补题 CF 813 A-F

    A The Contest 直接粗暴贪心 略过 #include<bits/stdc++.h> using namespace std; int main() {//freopen(&qu ...

  5. 转3xian之所在 (一位ACM大牛的博文)

    3xian的经历和见解...我深思... 最后一天,漫天飘起了雪花,假装欢送我离去. 这次WF之战不太顺利,早期的C题大概花了1秒钟构思,然而由于输出格式多了一个空格直到两个半小时才逃脱Wrong A ...

  6. String 对象

    1 你使用位置(索引)可以访问字符串中任何的字符: var str="this is a demo"; alert(str[3])//    s 字符串的索引从零开始, 所以字符串 ...

  7. 三步升级已安装的 Android SDK 和 ADT 插件(转载)

    转载:http://www.tfan.org/update-adt-and-android-sdk-in-five-minutes/ 如何快速地把已安装的 Android SDK 及 Eclipse ...

  8. bzoj 1787: [Ahoi2008]Meet 紧急集合【树链剖分lca】

    对于三个点求最小路径长度和,答案肯定在某两个点的lca上,因为如果把集合点定在公共lca上,一定有两个点汇合后再一起上到lca,这样显然不如让剩下的那个点下来 这个lca可能是深度最深的--但是我懒得 ...

  9. SGU 176 Flow construction【有上下界最小流】

    正好考到了所以翻一些题来做--猛然发现搞了半个月的网络流却没做两道上下界(不过这种题好像是比较少233) 首先建立超级源汇ss,tt,没限制的边照常连,对于有限制的边(u,v,mn,mx),连接(u, ...

  10. JAVA中抽象类不可以实例化,却可以创建数组

    这是我定义的一个抽象类: 如果你试图创建一个对象,当然是不行的,抽象类不能用new运算符创建对象. 这是错误提示,还记得instantiate这个单词吗?在我的这篇随笔第二篇(那些JAVA程序BUG中 ...