flutter 实现圆角头像的2种方法
圆角头像在开发中应用太普遍了,我总结了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种方法的更多相关文章
- IOS_视图实现圆角效果的三种方法及比较
通过代码,至少有三种方法可以为视图加上圆角效果.附例子:https://github.com/weipin/RoundedCorner 方法一.layer.cornerRadius 第一种方法最简单, ...
- css+div制作圆角矩形的四种方法
圆角矩形一向是设计师最倾心的一种设计,因为他们可以让整个网页生动起来,不那么死板,所以,作为一个优秀的网页设计师,学会一种或多种编辑圆角矩形的方法是必不可少的,而且圆角矩形应用范围极广,一个网页内的所 ...
- Flutter 圆形/圆角头像图片
图片显示 1.本地图片 Image.asset加载项目资源包的图片 //先将图片拷贝到项目 images 目录中,然后在 pubspec.yaml文件配置文件相对路径到 assets Image.as ...
- iOS常见用户头像的圆形图片裁剪常见的几种方法
在开发中,基本上APP的用户头像的处理都需要把用户所上传的方形图片,处理为圆形图片.在这里就总结三种常见的处理圆形图片的方法. 1.使用位图上下文 2.使用UIView的layer进行处理 3.使用r ...
- Quartz2D之生成圆形头像、打水印、截图三种方法的封装
我给UIImage类添加了一个类目,用于封装三个方法,每个方法都没有难度,做这个主要为了练习一下封装: 首先在类目.h文件中声明三个方法:以及创建了一个枚举.用于水印方法中设定水印位置:方法说明和参数 ...
- Qt 之 设置窗口边框的圆角(使用QSS和PaintEvent两种方法)
Qt在设置窗口边框圆角时有两种方式,一种是设置样式,另一种是在paintEvent事件中绘制窗口.下面分别叙述用这两种方式来实现窗口边框圆角的效果. 一.使用setStyleSheet方法 this- ...
- iOS设置圆角的四种方法
小小圆角问题,正常情况下,我们不需要过多关心,但当屏幕内比较多的时候,还是有必要了解下性能问题的 一.设置CALayer的cornerRadius 这是最常用的,也是最简单的. cornerRadiu ...
- 09 Flutter底部Tab切换保持页面状态的几种方法
IndexedStack:保此所有页面的状态: AutomaticKeepAliveClientMixin:保此部分页面的状态: 修改的页面代码: 页面效果: Tabs.dart import 'pa ...
- 为了弄懂Flutter的状态管理, 我用10种方法改造了counter app
为了弄懂Flutter的状态管理, 我用10种方法改造了counter app 本文通过改造flutter的counter app, 展示不同的状态管理方法的用法. 可以直接去demo地址看代码: h ...
随机推荐
- HEOI2016 树
传送门 这道题还是很简单的,可以树剖,然后还有看大佬暴力模拟AC的????!! 我们就执行俩操作,一个是单点修改,这个随便修,然后就是查询一个点,离他最近的被打过标记过的祖先.这个可以这么想,我们先q ...
- AutoIT: 如何设置GUICtrlCreateCombo选项为不可修改状态
GUICtrlCreateCombo中选中的选项是可修改的,也可设置为不可修改状态. #include<ComboConstants.au3> GUICtrlCreateLabel(, , ...
- 使用反射机制恢复xml文件表示的对象
完成如下功能:1)有一个(任意)对象,里面有N个properties以及getter和setter方法2)有一个properties文件,有N个key,value来描述对象中property的值3)有 ...
- ContextLoaderListener与RequestContextListener配置问题
转自:https://blog.csdn.net/yyqhwr/article/details/83381447 SSH2.SSM等web应用开发框架的配置过程中,因为都要用到spring,所以,往往 ...
- MySQL之不得不说的keepsync和trysync
此文已由作者温正湖授权网易云社区发布. 欢迎访问网易云社区,了解更多网易技术产品运营经验. 开宗明义,keepsync和trysync是网易MySQL分支版本InnoSQL的两个参数,非常重要的两个参 ...
- ZOJ5593:Let's Chat(双指针)
传送门 题意 给出x个a区间和y个b区间,询问a和b交区间的子区间长度为m的个数 分析 类似于双指针,具体见代码 trick 代码 #include <bits/stdc++.h> usi ...
- Flutter开发移动端APP的入门教程及简单介绍
Dart&Flutter环境搭建 安装 dart SDK 如果只开发移动应用,那么您不需要Dart SDK; 只需安装Flutter. 这里就直接安装 Flutter (dart SDK已经集 ...
- gRPC入门
一.gRPC简介 在介绍gRPC之前先说一下RPC(Remote Procedure Call),也叫远程过程调用协议,它是一种通过网络从远程计算机程序上请求服务,而不需要了解底层网络技术的协议.相比 ...
- hdu---------3189-------------------
水体一个,但是这种做题的方法值得发扬光大............ Just Do It Time Limit: / MS (Java/Others) Memory Limit: / K (Java/O ...
- icons使用
1.将选中图标加入项目 2.unicode方式查看连接在线连接 3.复制代码到样式表 4.引用样式,并设置I标签,颜色和大小可以通过设置i标签color和font-size进行调整 <i cla ...