美文网首页
Flutter-5-Image(常用方法)

Flutter-5-Image(常用方法)

作者: 忆往昔Code | 来源:发表于2019-05-22 17:15 被阅读0次

加入图片的几种方式:

Image.asset:加载资源图片,就是加载项目资源目录中的图片,加入图片后会增大打包的包体体积,用的是相对路径。
Image.network:网络资源图片,意思就是你需要加入一段http://xxxx.xxx的这样的网络路径地址。
Image.file:加载本地图片,就是加载本地文件中的图片,这个是一个绝对路径,跟包体无关。
Image.memory: 加载Uint8List资源图片,这个我目前用的不是很多,所以没什么发言权。

代码:
home:Scaffold(
body:Center(
child:Container(
child:new Image.network(
'',
scale:1.0,
),
width:300.0,
height:200.0,
color: Colors.lightBlue,
),
),
),

fit:
BoxFit.fill:全图显示,图片会被拉伸,并充满父容器。

BoxFit.contain:全图显示,显示原比例,可能会有空隙。

BoxFit.cover:显示可能拉伸,可能裁切,充满(图片要充满整个容器,还不变形)。

BoxFit.fitWidth:宽度充满(横向充满),显示可能拉伸,可能裁切。

BoxFit.fitHeight :高度充满(竖向充满),显示可能拉伸,可能裁切。

BoxFit.scaleDown:效果和contain差不多,但是此属性不允许显示超过源图片大小,可小不可大。

图片的混合模式:
child:new Image.network(
'',
color: Colors.greenAccent,
colorBlendMode: BlendMode.darken,
),

  • color:是要混合的颜色,如果你只设置color是没有意义的。
  • colorBlendMode:是混合模式,相当于我们如何混合。

repeat:
ImageRepeat.repeat : 横向和纵向都进行重复,直到铺满整个画布。

ImageRepeat.repeatX: 横向重复,纵向不重复。

ImageRepeat.repeatY:纵向重复,横向不重复。

相关文章

  • Flutter-5-Image(常用方法)

    加入图片的几种方式: Image.asset:加载资源图片,就是加载项目资源目录中的图片,加入图片后会增大打包的包...

  • 集合

    1. 常用容器类 Collection 的常用方法 List 的常用方法 Set 的常用方法 Map 的常用方法 ...

  • Yii2速查手册

    Controller控制器常用方法 Request组件常用方法 Html助手常用方法 CRUD常用方法 一、Act...

  • AlertDialog 实用API及其示例

    本文将介绍常用AlertDialog Api及其常用AlertDialog示例 常用API 常用方法 方法定义方法...

  • java字符串String、StringBuilder、Stri

    String的常用方法 StringBuffer的常用方法 StringBuilder的常用方法 String、S...

  • 2017.6.13-14

    学习python总结python常用的方法string的常用方法dictionary的常用方法 python抽象,...

  • OC笔记

    1. NSString 常用方法 2. NSArray 常用方法 3. NSDictionary 常用方法 4. ...

  • Objective-C之NSDictionary学习笔记(IOS

    NSDictionary类简介 属性表(@property) 常用方法 常用类方法 词典对象的生成 常用实例方法 ...

  • JavaScript数组常用方法

    目录 JS 数组常用API常用属性常用方法常见方法语法解释from方法isArrayconcateveryfill...

  • XPath 用法总结

    xpath常用方法 常用定位元素的方法 一些常用函数

网友评论

      本文标题:Flutter-5-Image(常用方法)

      本文链接:https://www.haomeiwen.com/subject/xvwuzqtx.html