Flutter开发（二）——Image组件的使用

今天新学习了Image组件的应用

首先引入图片有四种方式

new Image，用于从ImageProvider获取图像。
new Image.asset，用于使用key从AssetBundle获取图像。
new Image.network，用于从URL地址获取图像。
new Image.file，用于从File获取图像。

为了自动执行像素密度感知资源分辨率，使用AssetImage指定图像，需要确保在控件树中的图片控件上方存在MaterialApp、WidgetsApp和MediaQuery控件。

参考博文：https://blog.csdn.net/hekaiyou/article/details/53204466

然后自己做了一个通过网络url地址引入图片的例子

import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: "Text Widget",
      home: Scaffold(
        body: Center(
          child: Container(
            child: Image.network(//图片组件
              'https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=1352807053,3315013341&fm=26&gp=0.jpg',//图片url地址
              // fit: BoxFit.fitWidth,//图片在容器中的填充方式
              scale: 1.5,
              color: Colors.pink[50],//需要混合在图片上的颜色
              colorBlendMode:BlendMode.colorBurn,//图片以何种模式与颜色混合
              repeat: ImageRepeat.repeatY,//图片重复，以中心Y轴纵向重复
            ),
            width: 420.0,
            height: 700.0,
            color: Colors.pink[100],//容器的颜色，我这里把尺寸设置的超过了屏幕，皆为美观
          ),
        ),
      ),
    );
  }
}

 fit下Boxfit的一些属性

个人colorBlendMode的常用属性：

modulate

colorBurn

multiply

darken

加藤惠可爱了哈