Flutter 图片组件Image

图片组件Image是显示图像的组件,Image组件有多种构造函数:

  • Image:  从ImageProvider获取图像
  • Image.asset: 加载资源图片
  • Image.file: 加载本地图片文件
  • Image.network: 加载网络图片
  • Image.memory: 加载Uint8List资源图片

Image组件常用属性

Image组件属性及描述
属性名 类型 说明
fit BoxFit 图片填充模式,具体取值见下一个表
colorBlendMode BlendMode 在对图片进行手动处理的时候,可能用到图层混合,如改变图片的颜色,此属性可以对颜色进行混合处理。有多重模式
color Color 图片颜色
alignment Alignment 控制图片的摆放位置,比如图片放置在右下角则为Alignment.bottomRight
repeat ImageRepeat 此属性可以设置图片重复模式。noRepeat为不重复,Repeat为x和y方向重复,repeatX为x方向重复,repeatY为y方向重复
centerSlice Rect 当图片需要被拉伸显示时,centerSlice定义的矩形区域会被拉伸,可以理解成我们在图片类别定义一个点9个点文件用作拉伸,9个点为“上、下、左、右、上中、下中、左中、右中、正中”
matchTextDirection bool matchTextDirection与Directionality配合使用。TextDirection有两个值分别为:TextDirection.ltr从左到右展示图片,TextDirection.rtl从右到左展示图片
gaplessPlayback bool 当ImageProvider发生变化后,重新加载图片的过程中,原图片的展示是否保留。值为true则保留;值为false则不保留,直接空白等待下一张图片加载

BoxFit取值及描述

BoxFit取值及描述
取值 描述
BoxFit.fill 全图显示,显示可能拉伸、充满
BoxFit.contain 全图显示,显示原比例,不需充满
BoxFit.cover 显示可以拉伸,可能裁剪,充满
BoxFit.fitWidth 显示可能拉伸,可能裁剪,宽度充满
BoxFit.fitHeight 显示可能拉伸,可能裁剪,高度充满
BoxFit.none 原始大小
BoxFit.scaleDown 效果和BoxFit.contain差不多,但是此属性不允许显示超过源图片大小,即可小不可大

 

你可能感兴趣的:(App)