1, load the network picture

Image.network(
          'http://pic1.win4000.com/pic/c/cf/cdc983699c.jpg',
          width: 200,
          height: 200,
        )

2, loading local images

1. Set pubspec.yaml

Here Insert Picture Description
Pubspec.yaml added assets in the file, as shown above, note the path of the images.
If I have 100 pictures pubspec.yaml to set up 100 times? I tested a write-only directory, testing found not feel such an approach is very troublesome ah.

2, Image.asset load

Image.asset('images/1.png',
        width: 300,
        height: 160,)

3, load pictures on sd card

1, by obtaining the local path path_provider

path_provider third-party library, adding a dependency in pubspec.yaml in:
Here Insert Picture Description
After adding click Packages get the upper right corner.

path_provider has two interfaces:

Directory tempDir = await getTemporaryDirectory();
String tempPath = tempDir.path;

Directory appDocDir = await getApplicationDocumentsDirectory();
String appDocPath = appDocDir.path;

String storageDir = (await getExternalStorageDirectory()).path;

For android is:
appDocDir: /data/user/0/com.example.fluttersample/app_flutter
tempDir: /data/user/0/com.example.fluttersample/cache
StorageDir: / Storage / emulated / 0 /
StorageDir is sd card path, load sd card picture needs to read and write permissions, add in AndroidManifest.xml:

<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
    <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />

Figure:
Here Insert Picture Description
After successfully added open android engineering, build-> alone Android studio rebuild project, due flutter not added feature to get permission to open the read and write permissions manually set the interface, sd card root directory to load a picture decentralization

Image.file(
          File('$_storageDir/1.png'),
          width: 300,
          height: 160,
        )

The complete code:

import 'package:flutter/material.dart';
import 'package:path_provider/path_provider.dart';
import 'dart:io';

class ImageDemo extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    // TODO: implement createState
    return ImageFileDemo();
  }
}

class ImageFileDemo extends State<ImageDemo> {
  String _storageDir = '';

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    _getLocalFile();
    return Column(
      children: <Widget>[
        Image.network(
          'http://pic1.win4000.com/pic/c/cf/cdc983699c.jpg',
          width: 200,
          height: 200,
        ),
        Image.asset(
          'images/1.png',
          width: 300,
          height: 160,
        ),
        Image.asset(
          'images/2.png',
          width: 300,
          height: 160,
        ),
        Image.file(
          File('$_storageDir/1.png'),
          width: 300,
          height: 160,
        ),
      ],
    );
  }

  _getLocalFile() async {
    String appDir = (await getApplicationDocumentsDirectory()).path;
    String tempDir = (await getTemporaryDirectory()).path;
    String storageDir = (await getExternalStorageDirectory()).path;
    setState(() {
      _storageDir = storageDir;
    });
    return storageDir;
  }
}

At this time, a picture will be loaded on the sd card
Note getExternalStorageDirectory on ios device is thrown, the following method is getExternalStorageDirectory source path_provider of:

Future<Directory> getExternalStorageDirectory() async {
  if (Platform.isIOS)
    throw new UnsupportedError("Functionality not available on iOS");
  final String path = await _channel.invokeMethod('getStorageDirectory');
  if (path == null) {
    return null;
  }
  return new Directory(path);
}

4, several common attributes

1、fit

Reference Android imageview of scaleType


fill	Completely filled, the aspect ratio may become
contain	Geometric drawing, until one side filled up
cover	Geometric stretch, until the two sides are filled up, while at this time may be outside the range
fitWidth	Geometric drawing, filled up width
fitHeight	Geometric drawing, high filling up
none	It does not stretch beyond the scope of interception
scaleDown	Only narrow, geometric

2、colorBlendMode

And color do fusion, feeling not much opportunity to use, and when used in the detailed description see: https://docs.flutter.io/flutter/dart-ui/BlendMode-class.html