顯示圖片的組件
以下是幾種加載圖片路徑方式：
- Image.asset 加載asset項目資源中的文件
- Image.network 加載網絡資源圖片，通過url加載
- Image.file 加載本地文件中的圖片
- Image.memory 加載Uint8List中的圖片
圖片的支持格式有：JPEG, PNG, GIF, 動畫GIF, WebP, 動畫WebP, BMP, WBMP
使用Image.asset為例：
- 首先在你的項目目錄下新建一個文件夾images
- 然后在pubspec.yaml文件中配置路徑
- 最后在需要引入圖片的地方進行引入
child: new Container( width: 400.0, height: 300.0, child: new Image.asset( 'images/2-normal.png', alignment: Alignment.topLeft, color: Colors.green, colorBlendMode: BlendMode.dstATop, ), )
上面就是資源圖片的引入方法，下面則看看主要的幾個屬性：
1、alignment
圖片的對齊方式,也是有以下幾個選擇：
- topCenter：頂部居中對齊
- topLeft：頂部左對齊
- topRight：頂部右對齊
- center：水平垂直居中對齊
- centerLeft：垂直居中水平居左對齊
- centerRight：垂直居中水平居右對齊
- bottomCenter底部居中對齊
- bottomLeft：底部居左對齊
- bottomRight：底部居右對齊
2、color和colorBlendMode
設置圖片的背景顏色，通常和colorBlendMode配合一起使用，這樣可以是圖片顏色和背景色混合。上面的圖片就是進行了顏色的混合，綠色背景和圖片紅色的混合。
3、fit
fit屬性用來控制圖片的拉伸和擠壓，這都是根據父容器來的。
-
BoxFit.fill:全圖顯示，圖片會被拉伸，並充滿父容器。
-
BoxFit.contain:全圖顯示，顯示原比例，可能會有空隙。
-
BoxFit.cover：顯示可能拉伸，可能裁切，充滿（圖片要充滿整個容器，還不變形）。
-
BoxFit.fitWidth：寬度充滿（橫向充滿），顯示可能拉伸，可能裁切。
-
BoxFit.fitHeight ：高度充滿（豎向充滿）,顯示可能拉伸，可能裁切。
-
BoxFit.scaleDown：效果和contain差不多，但是此屬性不允許顯示超過源圖片大小，可小不可大。
舉個栗子：
child: new Image.asset( 'images/2-normal.png', alignment: Alignment.center, color: Colors.green, colorBlendMode: BlendMode.dstATop, fit: BoxFit.contain, ),
4、repeat
-
ImageRepeat.repeat : 橫向和縱向都進行重復，直到鋪滿整個畫布。
-
ImageRepeat.repeatX: 橫向重復，縱向不重復。
-
ImageRepeat.repeatY：縱向重復，橫向不重復。
child: new Image.asset( 'images/2-normal.png', alignment: Alignment.center, color: Colors.green, colorBlendMode: BlendMode.dstATop, repeat: ImageRepeat.repeat, ),
5、更詳細的屬性需要，可以去官網查看：一鍵送達