blocks|key|43768|text|如果您在资产中的映像可以使用image.asset构造函数|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|43769|entityMap|0|LINK|mutability|MUTABLE|url|https://docs.flutter.io/flutter/widgets/Image/Image.asset.html^0|E|B|0|0^^$0|@$1|2|3|4|5|6|7|L|8|@]|9|@$A|M|B|N|1|O]]|C|$]]|$1|D|3|-4|5|6|7|P|8|@]|9|@]|C|$]]]|E|$F|$5|G|H|I|C|$J|K]]]]

if your image in the assets you can use the <a href="https://docs.flutter.io/flutter/widgets/Image/Image.asset.html" rel="nofollow noreferrer">image.asset</a> constructor

blocks|key|43771|text|试试这个：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|43772|import+'package:flutter/material.dart';
import+'dart:io';

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

class+MyApp+extends+StatelessWidget+{
++++@override
++++Widget+build(BuildContext+context)+{
++++++++return+new+MaterialApp(
++++++++++++++++home:+new+ImageIcon(
++++++++++++++++++++++++++new+AssetImage(
++++++++++++++++++++++++++++++"assets/images/image.png"),
++++++++++++++++++++++++++size:+24.0,
++++++++++++++++++++++++++color:+Colors.white),
++++++++);
++++}
}|code-block|syntax|javascript|43773|在pubspec.yaml中，您需要：|43774|++assets:
++++-+assets/images/image.png|43775|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

Try this :

<pre><code>import 'package:flutter/material.dart';
import 'dart:io';

void main() =&gt; runApp(new MyApp());

class MyApp extends StatelessWidget {
 @override
 Widget build(BuildContext context) {
 return new MaterialApp(
 home: new ImageIcon(
 new AssetImage(
 "assets/images/image.png"),
 size: 24.0,
 color: Colors.white),
 );
 }
}
</code></pre>

In pubspec.yaml, you need :

<pre><code> assets:
 - assets/images/image.png
</code></pre>

blocks|key|1154269|text|下面是另一个使用jpg作为背景图像的示例。它还将不透明度应用于图像。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1154270|import+'package:flutter/material.dart';

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

class+MyApp+extends+StatelessWidget+{
++//+This+widget+is+the+root+of+your+application.
++@override
++Widget+build(BuildContext+context)+{
++++return+new+MaterialApp(
++++++title:+'Flutter+Demo',
++++++theme:+new+ThemeData(
++++++++primarySwatch:+Colors.blue,
++++++),
++++++home:+new+Scaffold(
++++++++resizeToAvoidBottomPadding:+false,
++++++++appBar:+new+AppBar(
++++++++++title:+new+Text("test"),
++++++++),
++++++++body:+new+Container(
++++++++++decoration:+new+BoxDecoration(
++++++++++++image:+new+DecorationImage(
++++++++++++++colorFilter:+new+ColorFilter.mode(Colors.black.withOpacity(0.6),+BlendMode.dstATop),
++++++++++++++image:+new+AssetImage("assets/images/keyboard.jpg"),
++++++++++++++fit:+BoxFit.cover,
++++++++++++),
++++++++++),
++++++++),
++++++),
++++);
++}
}|code-block|syntax|javascript|1154271|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

Here is another example which uses a jpg as a background image. It also applies opacity to the image.

<pre><code>import 'package:flutter/material.dart';

void main() =&gt; runApp(new MyApp());

class MyApp extends StatelessWidget {
 // This widget is the root of your application.
 @override
 Widget build(BuildContext context) {
 return new MaterialApp(
 title: 'Flutter Demo',
 theme: new ThemeData(
 primarySwatch: Colors.blue,
 ),
 home: new Scaffold(
 resizeToAvoidBottomPadding: false,
 appBar: new AppBar(
 title: new Text("test"),
 ),
 body: new Container(
 decoration: new BoxDecoration(
 image: new DecorationImage(
 colorFilter: new ColorFilter.mode(Colors.black.withOpacity(0.6), BlendMode.dstATop),
 image: new AssetImage("assets/images/keyboard.jpg"),
 fit: BoxFit.cover,
 ),
 ),
 ),
 ),
 );
 }
}
</code></pre>

blocks|key|1281307|text|下面是使用Image.file的一个示例。这不是推荐的方法，但是如果您通过http下载了应用程序中的映像，然后想要显示映像(例如，在安装过程中图像没有存储在资产中)，则用例可能是这样的。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1281308|在您的pubspec.yaml中添加：|1281309|path_provider:+%5E0.2.2|code-block|syntax|javascript|1281310|代码：|1281311|import+'dart:io';
import+'dart:async';
import+'package:path_provider/path_provider.dart';
import+'package:flutter/material.dart';

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

class+MyApp+extends+StatelessWidget+{

++Future<File>+_getLocalFile(String+filename)+async+{
++++String+dir+=+(await+getApplicationDocumentsDirectory()).path;
++++File+f+=+new+File('$dir/$filename');
++++return+f;
++}

++@override
++Widget+build(BuildContext+context)+{
++++return+new+MaterialApp(
++++++++title:+'Flutter+Demo',
++++++++home:+new+FutureBuilder(
++++++++++++future:+_getLocalFile("flutter_assets/image.png"),
++++++++++++builder:+(BuildContext+context,+AsyncSnapshot<File>+snapshot)+{
++++++++++++++return+snapshot.data+!=+null+?+new+Image.file(snapshot.data)+:+new+Container();
++++++++++++})
++++);
++}
}|1281312|要模拟下载映像，可以使用亚行推送映像：|1281313|adb+push+image.png+/data/data/com.example.imagetest/app_flutter/flutter_assets/|1281314|entityMap^0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|T|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|U|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|V|8|@]|9|@]|A|$]]|$1|K|3|L|5|F|7|W|8|@]|9|@]|A|$G|H]]|$1|M|3|N|5|6|7|X|8|@]|9|@]|A|$]]|$1|O|3|P|5|F|7|Y|8|@]|9|@]|A|$G|H]]|$1|Q|3|-4|5|6|7|Z|8|@]|9|@]|A|$]]]|R|$]]

Here is an example of the use of Image.file. This would not be the recommended way, but the use case could be if you downloaded the image in your app via http and then wanted to display the image (e.g. the image is not stored in assets during install).

In your pubspec.yaml, add :

<pre><code>path_provider: ^0.2.2
</code></pre>

Code :

<pre><code>import 'dart:io';
import 'dart:async';
import 'package:path_provider/path_provider.dart';
import 'package:flutter/material.dart';

void main() =&gt; runApp(new MyApp());

class MyApp extends StatelessWidget {

 Future&lt;File&gt; _getLocalFile(String filename) async {
 String dir = (await getApplicationDocumentsDirectory()).path;
 File f = new File('$dir/$filename');
 return f;
 }

 @override
 Widget build(BuildContext context) {
 return new MaterialApp(
 title: 'Flutter Demo',
 home: new FutureBuilder(
 future: _getLocalFile("flutter_assets/image.png"),
 builder: (BuildContext context, AsyncSnapshot&lt;File&gt; snapshot) {
 return snapshot.data != null ? new Image.file(snapshot.data) : new Container();
 })
 );
 }
}
</code></pre>

To simulate downloading the image you can push the image using adb :

<pre><code>adb push image.png /data/data/com.example.imagetest/app_flutter/flutter_assets/
</code></pre>

blocks|key|1281361|text|请先使用此软件包：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1281362|import+'package:http/http.dart'+show+get;
import+'dart:io';

Image+loadImageFromFile(String+path)+{
++++File+file+=+new+File(path);
++++Image+img+=+Image.file(file);
}

void+storeImageToFile(String+path,String+url)+async+{
++++var+response+=+await+get(Url);
++++File+file+=+new+File(path);
++++file.create(recursive:+true).then((val)+async+{
++++++++if+(await+val.exists())+{
++++++++++++await+file.writeAsBytesSync(response.bodyBytes);
++++++++}
++++});
}|code-block|syntax|javascript|1281363|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

use this package first:

<pre><code>import 'package:http/http.dart' show get;
import 'dart:io';

Image loadImageFromFile(String path) {
 File file = new File(path);
 Image img = Image.file(file);
}

void storeImageToFile(String path,String url) async {
 var response = await get(Url);
 File file = new File(path);
 file.create(recursive: true).then((val) async {
 if (await val.exists()) {
 await file.writeAsBytesSync(response.bodyBytes);
 }
 });
}
</code></pre>

blocks|key|1154377|text|颤振包含pubspec.yaml中的断言部分，其中包含应用程序的断言。例：|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1154378|assets:
++++-+data_repo/img/ic_launcher.png|code-block|syntax|javascript|1154379|1.使用pubspec.yaml:|BOLD|1154380|import+'package:flutter/material.dart';

void+main()+{
++runApp(new+MaterialApp(home:+LoadLocalImage()));
}

class+LoadLocalImage+extends+StatelessWidget+{
++@override
++Widget+build(BuildContext+context)+{
++++return+new+Scaffold(
++++++appBar:+new+AppBar(
++++++++title:+new+Text("Load+Local+Image"),
++++++),
++++++body:+new+Container(
++++++++decoration:+new+BoxDecoration(
++++++++++++image:+new+DecorationImage(
++++++++++++++++image:+new+AssetImage('data_repo/img/ic_launcher.png'),+fit:+BoxFit.cover)),
++++++),
++++);
++}
}|1154381|2.使用Image.asset:|1154382|import+'package:flutter/material.dart';

++++void+main()+{
++++++runApp(new+MaterialApp(home:+LoadLocalImage()));
++++}

++++class+LoadLocalImage+extends+StatelessWidget+{
++++++@override
++++++Widget+build(BuildContext+context)+{
++++++++return+new+Scaffold(
++++++++++++appBar:+new+AppBar(
++++++++++++++title:+new+Text("Load+Local+Image"),
++++++++++++),
++++++++++++body:+Image.asset(
++++++++++++++'data_repo/img/ic_launcher.png',
++++++++++++++fit:+BoxFit.cover,
++++++++++++));
++++++}
++++}|1154383|文件夹结构：|1154384|📷|atomic|1154385|输出：|1154386|1154387|​|1154388|请参阅下面的链接以获得更多的描述：|1154389|https://flutter.dev/docs/cookbook/images/network-image|1154390|entityMap|0|IMAGE|mutability|IMMUTABLE|imageUrl|https://developer.qcloudimg.com/http-save/yehe-900000/29343f95a1e4a97042fa79897a5797e8.png|imageAlt|1|https://developer.qcloudimg.com/http-save/yehe-900000/ede2bf551638ebed5b0885793d0411ce.png|2|LINK|MUTABLE|url^0|4|C|0|0|0|H|0|0|0|G|0|0|0|6|0|0|1|0|0|0|3|0|0|1|1|0|0|0|0|1I|2|0^^$0|@$1|2|3|4|5|6|7|1M|8|@$9|1N|A|1O|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|1P|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|1Q|8|@$9|1R|A|1S|B|M]]|D|@]|E|$]]|$1|N|3|O|5|H|7|1T|8|@]|D|@]|E|$I|J]]|$1|P|3|Q|5|6|7|1U|8|@$9|1V|A|1W|B|M]]|D|@]|E|$]]|$1|R|3|S|5|H|7|1X|8|@]|D|@]|E|$I|J]]|$1|T|3|U|5|6|7|1Y|8|@$9|1Z|A|20|B|M]]|D|@]|E|$]]|$1|V|3|W|5|X|7|21|8|@]|D|@$9|22|A|23|1|24]]|E|$]]|$1|Y|3|Z|5|6|7|25|8|@$9|26|A|27|B|M]]|D|@]|E|$]]|$1|10|3|W|5|X|7|28|8|@]|D|@$9|29|A|2A|1|2B]]|E|$]]|$1|11|3|12|5|6|7|2C|8|@]|D|@]|E|$]]|$1|13|3|14|5|6|7|2D|8|@]|D|@]|E|$]]|$1|15|3|16|5|6|7|2E|8|@]|D|@$9|2F|A|2G|1|2H]]|E|$]]|$1|17|3|-4|5|6|7|2I|8|@]|D|@]|E|$]]]|18|$19|$5|1A|1B|1C|E|$1D|1E|1F|-4]]|1G|$5|1A|1B|1C|E|$1D|1H|1F|-4]]|1I|$5|1J|1B|1K|E|$1L|16]]]]

Flutter contains assert section inside <code>pubspec.yaml</code> where it contains asserts of your application. 
eg:

<pre><code>assets:
 - data_repo/img/ic_launcher.png
</code></pre>

1. With pubspec.yaml:

<pre><code>import 'package:flutter/material.dart';

void main() {
 runApp(new MaterialApp(home: LoadLocalImage()));
}

class LoadLocalImage extends StatelessWidget {
 @override
 Widget build(BuildContext context) {
 return new Scaffold(
 appBar: new AppBar(
 title: new Text("Load Local Image"),
 ),
 body: new Container(
 decoration: new BoxDecoration(
 image: new DecorationImage(
 image: new AssetImage('data_repo/img/ic_launcher.png'), fit: BoxFit.cover)),
 ),
 );
 }
}
</code></pre>

2. With Image.asset:

<pre><code>import 'package:flutter/material.dart';

 void main() {
 runApp(new MaterialApp(home: LoadLocalImage()));
 }

 class LoadLocalImage extends StatelessWidget {
 @override
 Widget build(BuildContext context) {
 return new Scaffold(
 appBar: new AppBar(
 title: new Text("Load Local Image"),
 ),
 body: Image.asset(
 'data_repo/img/ic_launcher.png',
 fit: BoxFit.cover,
 ));
 }
 }
</code></pre>

Folder Structure:
<a href="https://i.stack.imgur.com/1ar7B.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/1ar7B.png" alt="enter image description here"></a> 
Output:
<a href="https://i.stack.imgur.com/L4f54.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/L4f54.png" alt="enter image description here"></a>

Please refer below link for more description:

<a href="https://flutter.dev/docs/cookbook/images/network-image" rel="nofollow noreferrer">https://flutter.dev/docs/cookbook/images/network-image</a>

blocks|key|1154430|text|Image与ImageProvider的区别与联系|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1154431|Image|1154432|创建一个显示图像的小部件。
要显示来自网络的映像或资产包，请考虑分别使用新的Image.network和新的Image.asset。|blockquote|1154433|所以Image是一个小部件。就像html中的<img>标记。|1154434|ImageProvider|1154435|标识图像，而不提交到精确的最终资产。这允许识别一组图像，然后根据环境(例如，设备像素比)对精确图像进行解析。|1154436|因此，ImageProvider就像Image的src属性。|1154437|现在，Image采用了一个参数image，这是一个ImageProvider。有四种获取ImageProvider的方法|1154438|AssetImage：
用于加载与apk一起打包的预定义图像集。
例如，为了显示横幅图像，一些自定义图标。|unordered-list-item|1154439|NetworkImage：
用于从互联网上加载动态图像。|1154440|FileImage：
用于从目标设备中的文件系统加载图像。
显示新下载的图像。|1154441|MemoryImage：
用于从内存中加载原始图像。
例如，获取用户的壁纸并将其加载到小部件中。|1154442|现在他们都是ImageProviders了。它们中的任何一个都可以用作image小部件的Image属性。flutter社区将扩展类添加到Image小部件本身，从而简化了语法。|1154443|所以|1154444|Image.asset(name)本质上是Image(image:+AssetImage(name))，|1154445|Image.file(path)本质上是Image(image:+FileImage(File(path)))，|1154446|Image.network(url)本质上是Image(image:+NetworkImage(url))，|1154447|Image.memory(list)本质上是Image(image:+MemoryImage(list))|1154448|现在应该清楚的是|1154449|apk大小随资产映像数的增加而增加。|1154450|它们的加载时间(用户所看到的)通常按顺序排列。
NetworkImage+>+FileImage+>+AssetImage+>+MemoryImage|1154451|entityMap|0|LINK|mutability|MUTABLE|url|https://api.flutter.dev/flutter/widgets/Image/Image.html|1|https://api.flutter.dev/flutter/painting/ImageProvider-class.html^0|0|5|6|D|0|0|5|0|5|0|0|0|2|5|M|5|0|0|D|0|D|1|0|0|3|D|I|5|O|3|0|3|5|F|5|P|D|18|D|0|0|A|0|0|C|0|0|9|0|0|B|0|6|E|Z|5|18|5|1W|5|0|0|0|H|L|U|0|0|G|K|Z|0|0|I|M|V|0|0|I|M|V|0|0|0|O|1F|0^^$0|@$1|2|3|4|5|6|7|1V|8|@$9|1W|A|1X|B|C]|$9|1Y|A|1Z|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|20|8|@$9|21|A|22|B|C]]|D|@$9|23|A|24|1|25]]|E|$]]|$1|H|3|I|5|J|7|26|8|@]|D|@]|E|$]]|$1|K|3|L|5|6|7|27|8|@$9|28|A|29|B|C]|$9|2A|A|2B|B|C]]|D|@]|E|$]]|$1|M|3|N|5|6|7|2C|8|@$9|2D|A|2E|B|C]]|D|@$9|2F|A|2G|1|2H]]|E|$]]|$1|O|3|P|5|J|7|2I|8|@]|D|@]|E|$]]|$1|Q|3|R|5|6|7|2J|8|@$9|2K|A|2L|B|C]|$9|2M|A|2N|B|C]|$9|2O|A|2P|B|C]]|D|@]|E|$]]|$1|S|3|T|5|6|7|2Q|8|@$9|2R|A|2S|B|C]|$9|2T|A|2U|B|C]|$9|2V|A|2W|B|C]|$9|2X|A|2Y|B|C]]|D|@]|E|$]]|$1|U|3|V|5|W|7|2Z|8|@$9|30|A|31|B|C]]|D|@]|E|$]]|$1|X|3|Y|5|W|7|32|8|@$9|33|A|34|B|C]]|D|@]|E|$]]|$1|Z|3|10|5|W|7|35|8|@$9|36|A|37|B|C]]|D|@]|E|$]]|$1|11|3|12|5|W|7|38|8|@$9|39|A|3A|B|C]]|D|@]|E|$]]|$1|13|3|14|5|6|7|3B|8|@$9|3C|A|3D|B|C]|$9|3E|A|3F|B|C]|$9|3G|A|3H|B|C]|$9|3I|A|3J|B|C]]|D|@]|E|$]]|$1|15|3|16|5|6|7|3K|8|@]|D|@]|E|$]]|$1|17|3|18|5|W|7|3L|8|@$9|3M|A|3N|B|C]|$9|3O|A|3P|B|C]]|D|@]|E|$]]|$1|19|3|1A|5|W|7|3Q|8|@$9|3R|A|3S|B|C]|$9|3T|A|3U|B|C]]|D|@]|E|$]]|$1|1B|3|1C|5|W|7|3V|8|@$9|3W|A|3X|B|C]|$9|3Y|A|3Z|B|C]]|D|@]|E|$]]|$1|1D|3|1E|5|W|7|40|8|@$9|41|A|42|B|C]|$9|43|A|44|B|C]]|D|@]|E|$]]|$1|1F|3|1G|5|6|7|45|8|@]|D|@]|E|$]]|$1|1H|3|1I|5|W|7|46|8|@]|D|@]|E|$]]|$1|1J|3|1K|5|W|7|47|8|@$9|48|A|49|B|C]]|D|@]|E|$]]|$1|1L|3|-4|5|6|7|4A|8|@]|D|@]|E|$]]]|1M|$1N|$5|1O|1P|1Q|E|$1R|1S]]|1T|$5|1O|1P|1Q|E|$1R|1U]]]]

The difference and relation between <code>Image</code>, <code>ImageProvider</code>:
<a href="https://api.flutter.dev/flutter/widgets/Image/Image.html" rel="noreferrer"><code>Image</code></a>:
<blockquote>
Creates a widget that displays an image.
To show an image from the network or an asset bundle, consider using [new Image.network] and [new Image.asset] respectively.
</blockquote>
So <code>Image</code> is a widget. Like <code>&lt;img&gt;</code> tag in html.
<a href="https://api.flutter.dev/flutter/painting/ImageProvider-class.html" rel="noreferrer"><code>ImageProvider</code></a>:
<blockquote>
Identifies an image without committing to the precise final asset. This allows a set of images to be identified and for the precise image to later be resolved based on the environment, e.g. the device pixel ratio.
</blockquote>
So <code>ImageProvider</code> is like the <code>src</code> attribute for an <code>Image</code>.
Now <code>Image</code> takes an argument <code>image</code> which is an <code>ImageProvider</code>.
There are 4 ways of getting the <code>ImageProvider</code>
<ul>
<li><code>AssetImage</code>:
Use to load a pre-defined set of images that are packed along with the apk.
e.g. To display Banner Images, some custom icons.
</li>
<li><code>NetworkImage</code>:
Used to load dynamic images from the internet.
</li>
<li><code>FileImage</code>:
Used to load images from the file system in the target device.
e.g. To display a newly downloaded image.
</li>
<li><code>MemoryImage</code>:
Used to load raw image from memory.
e.g. To get the user's wallpaper and load it into a widget.
</li>
</ul>
Now they are all <code>ImageProviders</code>.
Anyone of them can be used as the <code>image</code> attribute to the <code>Image</code> widget.
And the flutter community simplified the syntax by adding extended classes to the <code>Image</code> widget itself.
So
<ul>
<li><code>Image.asset(name)</code> is essentially <code>Image(image: AssetImage(name))</code>,</li>
<li><code>Image.file(path)</code> is essentially <code>Image(image: FileImage(File(path)))</code>,</li>
<li><code>Image.network(url)</code> is essentially <code>Image(image: NetworkImage(url))</code>,</li>
<li><code>Image.memory(list)</code> is essentially <code>Image(image: MemoryImage(list))</code></li>
</ul>
Now it should be clear that
<ul>
<li>The apk size increases with the number of asset images.
</li>
<li>The loading time (what the user sees) for them would be generally in the order
<code>NetworkImage &gt; FileImage &gt; AssetImage &gt; MemoryImage</code>
</li>
</ul>

blocks|key|43989|text|您可以将Image.File添加为Container的子级。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|43990|Container(
+++++padding:
++++++++EdgeInsets.zero,
+++++++++height:+150,
+++++++++++++++width:+150,
+++++++++++++++child:+Image.file(File(filePath))
+++)|code-block|syntax|javascript|43991|entityMap^0|4|A|H|9|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@$9|N|A|O|B|C]|$9|P|A|Q|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|R|8|@]|D|@]|E|$I|J]]|$1|K|3|-4|5|6|7|S|8|@]|D|@]|E|$]]]|L|$]]

You can add <code>Image.File</code> as <code>Container</code>'s child
<pre><code>Container(
 padding:
 EdgeInsets.zero,
 height: 150,
 width: 150,
 child: Image.file(File(filePath))
 )
</code></pre>

blocks|key|1281551|text|​|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1281552|📷|atomic|offset|length|1281553|1281554|pubspec.yaml中的资产必须不加注释。|1281555|这将有助于按预期加载文件image.asset。|1281556|entityMap|0|IMAGE|mutability|IMMUTABLE|imageUrl|https://developer.qcloudimg.com/http-save/yehe-900000/71f99fac0f6baa8c4c88440bb3ca9fcd.png|imageAlt^0|0|0|1|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|U|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|V|8|@]|9|@$E|W|F|X|1|Y]]|A|$]]|$1|G|3|4|5|6|7|Z|8|@]|9|@]|A|$]]|$1|H|3|I|5|6|7|10|8|@]|9|@]|A|$]]|$1|J|3|K|5|6|7|11|8|@]|9|@]|A|$]]|$1|L|3|-4|5|6|7|12|8|@]|9|@]|A|$]]]|M|$N|$5|O|P|Q|A|$R|S|T|-4]]]]

<a href="https://i.stack.imgur.com/UwQqT.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/UwQqT.png" alt="The assets in the pubspec.yaml must be uncommented. "></a>

The assets in the pubspec.yaml must be uncommented. 
This will help to load the file image.asset as expected.

blocks|key|1281603|text|child:+Image.file(
+File('DirectoryLocation/imageName.jpg'),
+height:+45.0,
+width:+45.0,
),|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|1281604|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

<pre><code>child: Image.file(
 File('DirectoryLocation/imageName.jpg'),
 height: 45.0,
 width: 45.0,
),
</code></pre>

blocks|key|1281613|text|替换|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1281614|new+Image.file(file)|code-block|syntax|javascript|1281615|使用|1281616|FileImage(file)|1281617|这对你来说应该管用。|1281618|entityMap^0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|Q|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|R|8|@]|9|@]|A|$E|F]]|$1|K|3|L|5|6|7|S|8|@]|9|@]|A|$]]|$1|M|3|-4|5|6|7|T|8|@]|9|@]|A|$]]]|N|$]]

Replace
<pre><code>new Image.file(file)
</code></pre>
with
<pre><code>FileImage(file)
</code></pre>
and that should work for you.

blocks|key|44119|text|如果您寻找与从存储(即Someimage.jpeg+)加载文件的相关的问题的、更多的，那么它可能会对有所帮助。让我解释一下。|type|unstyled|depth|inlineStyleRanges|offset|length|style|BOLD|entityRanges|data|44120|首先，你应该知道一些重要的问题。|44121|在“颤振”中，文件夹称为目录。|ordered-list-item|44122|内置存储本身就是一个目录，其路径为'/storage/emulated/0/'，可以使用Directory('/storage/emulated/0/')进行访问|44123|类似地，下载文件夹路径是'/storage/emulated/0/Download/'，可以使用Directory('/storage/emulated/0/Download/')访问。|44124|'/storage/emulated/0/Download/Someimage.jpeg'文件夹中下载文件夹中图像的路径可以是|44125|图像的路径在相机文件夹中可以是等。|44126|如果您对查找路径有任何问题，那么只需打开文件管理器并检查文件(图像)+detail，就可以在其中找到它。|44127|例子:-|44128|Align(
alignment:+Alignment.topCenter,
child:+Image.file(
File('/storage/emulated/0/DCIM/Camera/Someimage.jpeg'),
fit:+BoxFit.contain,
),
),|code-block|syntax|javascript|44129|确保您拥有存储访问权限。|44130|entityMap^0|9|1H|0|0|G|0|0|F|0|0|29|0|0|2L|0|0|1R|0|0|H|0|0|1G|0|0|4|0|0|0|C|0^^$0|@$1|2|3|4|5|6|7|15|8|@$9|16|A|17|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|18|8|@$9|19|A|1A|B|C]]|D|@]|E|$]]|$1|H|3|I|5|J|7|1B|8|@$9|1C|A|1D|B|C]]|D|@]|E|$]]|$1|K|3|L|5|J|7|1E|8|@$9|1F|A|1G|B|C]]|D|@]|E|$]]|$1|M|3|N|5|J|7|1H|8|@$9|1I|A|1J|B|C]]|D|@]|E|$]]|$1|O|3|P|5|J|7|1K|8|@$9|1L|A|1M|B|C]]|D|@]|E|$]]|$1|Q|3|R|5|J|7|1N|8|@$9|1O|A|1P|B|C]]|D|@]|E|$]]|$1|S|3|T|5|6|7|1Q|8|@$9|1R|A|1S|B|C]]|D|@]|E|$]]|$1|U|3|V|5|6|7|1T|8|@$9|1U|A|1V|B|C]]|D|@]|E|$]]|$1|W|3|X|5|Y|7|1W|8|@]|D|@]|E|$Z|10]]|$1|11|3|12|5|6|7|1X|8|@$9|1Y|A|1Z|B|C]]|D|@]|E|$]]|$1|13|3|-4|5|6|7|20|8|@]|D|@]|E|$]]]|14|$]]

It may help if you looking for something more for the problem related to loading a file from Storage ( i.e. Someimage.jpeg ). Let me explain.
First of all you should know some important point.
<ol>
<li>In flutter, Folder is called Directory.</li>
<li>Inbuilt storage is itself a Directory whose path is '/storage/emulated/0/' and can be access using Directory('/storage/emulated/0/')</li>
<li>Similarly Download Folder path is '/storage/emulated/0/Download/' and can be access using Directory('/storage/emulated/0/Download/')</li>
<li>Path of a image in Download folder can be '/storage/emulated/0/Download/Someimage.jpeg'</li>
<li>Path of a image in Camera folder can be '/storage/emulated/0/DCIM/Camera/Someimage.jpeg' , etc.</li>
</ol>
If you have any problem with finding path, then just open File manager and check file(image) detail where you will find that.
Example :-
<pre><code>Align(
alignment: Alignment.topCenter,
child: Image.file(
File('/storage/emulated/0/DCIM/Camera/Someimage.jpeg'),
fit: BoxFit.contain,
),
),
</code></pre>
Make Sure you have Storage Access Permission.

blocks|key|44157|text|如果您正在使用image_picker或其他工具上传图像，并希望从您获得的FileImage(路径)中呈现它。您可能需要使用图像(图像:FileImage(文件(路径)格式，而不是使用Image.file(路径)。在使用Image.file(Path)时，我得到了以下错误：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|44158|The+argument+type+'ImageProvider<Object>'+can't+be+assigned+to+the+parameter+type+'File'.|code-block|syntax|javascript|44159|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

In case you are uploading an image using image_picker or something and want to render it from the FileImage(PATH) you get. You might need to use Image(image: FileImage(File(path))) format instead of Image.file(path). I was getting the following error when using Image.file(path):
<pre><code>The argument type 'ImageProvider&lt;Object&gt;' can't be assigned to the parameter type 'File'.
</code></pre>

I can't seem to simply load an image from the hard drive to the screen. Image.network seems straightforward. But I can't figure out how to use Image or Image.file. Image seems to require a stream, so I don't think that is what I am looking for. 

<pre><code>import 'package:flutter/material.dart';
import 'dart:io';

void main() =&gt; runApp(new MyApp());

class MyApp extends StatelessWidget {
 File file = new File("Someimage.jpeg");
 @override
 Widget build(BuildContext context) {
 return new MaterialApp(
 home: new Image.file(file), //doesn't work, but no errors
 );
 }
}
</code></pre>

I added Someimage to the pubspec.yaml file, but that doesn't work either:

<pre><code>assets:
 - Someimage.jpeg
</code></pre>

Can someone give me an example of how this is done? Thanks.

How to load images with image.file

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

我似乎不能简单地将图像从硬盘加载到屏幕上。Image.network看起来很简单。但我不知道如何使用图像或Image.file。图像似乎需要一个流，所以我不认为这是我正在寻找的。import 'package:flutter/material.dart';import 'dart:io';void main() => ...

问如何用image.file加载图像
EN

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何用image.file加载图像EN