Image Flutter components, the local picture, remote picture, image cropping

Image Local Image Configuration

1. pubspec.yamlIn the 所有图片资源added to the configuration file, and distinguish at least 2.0x、3.0xtwo kinds of screen resolution material.
2. In the project directory images, respectively, to create at least 2.0x、3.0xtwo file folders.
3. All the pictures were placed imagesunder the picture layer of directories and 2.0x、3.0xfolders
4. Introduced Image.asset("images/timg.jpg"）after the restart project

Image common attributes

class StudyBodyImage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Center(
      child: Container(
        //child:Image.network("地址"),//网络图片方式
          child: Image.asset(
            "images/timg.jpg",
            alignment: Alignment.center,//图片在盒子的位置
            color: Colors.pink,//背景颜色
            colorBlendMode: BlendMode.saturation,//混合颜色方式,可以改变图片的色系
            fit: BoxFit.cover,//图片的填充方式类似于css
            repeat:ImageRepeat.repeatX,//平铺方式类似于css
          ),
        width: 500.0,
        height: 800.0,
      ),
    );
  }
}

ClipOval cut

class StudyBodyImage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Center(
      child: Container(
        child: ClipOval(//裁剪成圆角图片结合高度宽度
          child: Image.asset(
            "images/timg.jpg",
            alignment: Alignment.center,
            colorBlendMode: BlendMode.saturation,
            width: 500,
            height: 800,
            fit: BoxFit.cover,
          ),
        ),
    );
  }
}