flutter 图片形状裁剪

27 篇文章 0 订阅

flutter 中 不管是三方图片显示插件 还是自带的 Image.asset  Image.netWork 操作图片外层的Container 元素 ,是不能限制图片的显示形状的

官方自带

ClipOval和 ClipRRect 方法

//圆形裁剪
ClipOval(
      
      child: Image.asset(
        'assets/images/demo1.png',
        fit: fit,
        width: 300,
        height: 300,
      ),
 )

/**
 * 源码  圆角矩形裁剪
 *  const ClipRRect({
    Key key,
    this.borderRadius,//圆角半径
    this.clipper,//裁剪路径
    this.clipBehavior = Clip.antiAlias,
    Widget child,
    })
 */



//自定义裁剪

ClipRRect(
      
      child: Image.asset(
        'assets/images/demo1.png',
        fit: fit,
        width: 300,
        height: 300,
      ),
 )



/*自定义裁剪源码 
ClipRRect({
    Key key,
    this.borderRadius = BorderRadius.zero,//圆角角度
    this.clipper,  //裁剪路径
    this.clipBehavior = Clip.antiAlias,//
    Widget child,
*/
看源码 自己做
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值